Как дизайнеру подготовить передачу Android-приложения разработчику
Во время нарезки графики под приложения часто возникает множество сложностей: от разрешения устройств и проблемы с сетками и рекомендациями Google до непосредственно передачи приложения разработчику. За 2 года работы над более десятком приложений я научилась находить решения самых разных проблем и делать так, чтобы в конечном итоге приложение выглядело так же, как и в дизайне.
Об этом и пойдет речь под катом.
Разрешения
xxxhdpi — максимальное разрешение
Спецификация
При создании спецификации необходимо убедиться, что элементы интерфейса стоят по сетке. Размер сетки для XXH 24 px, для остальных разрешений 12 px. (см. таблицу выше)
Мы не можем редактировать все элементы меню, можем только задавать цвет (данные для меню есть в material design)
Каждый элемент необходимо вписать в сетку. Google рекомендует набор кеглей в SP (12, 14, 16, 20 и 34). SP — это универсальный размер шрифта, который рассчитывается:
x (pt)*3=n (sp)
Для чего это нужно
В Material Design размеры в sp и dpi, потому что в Android разрешения, как и высота, и ширина экрана у разных производителей отличаются друг от друга, в том время как sp и dpi универсальны. Но рисуем всё равно в максимальном разрешении, потому что приложение будет тянуться по-разному, в зависимости от устройства.
Нарезка
Создается папка «cut» (позже она передается разработчику), в которой, в свою очередь, создаются папки под необходимые разрешения, например, XXH, XH, H. После создания элемент помещается в папку с соответствующим разрешением и названием.
Размер элементов нарезки должен быть кратен 3 и записываться в dpi. То есть, если размер иконки 240 px, то записываем размер 80 dpi.
Аннотации
В аннотациях подписываем отступы, размеры графических элементов, размеры шрифтов.
Кстати, есть удобная программа для аннотаций specctr pro
Эти цифры являются координатами элемента по осям Х и У. Они нужны для разработчика, чтобы он вводил координаты элемента и элемент вставал на своё место. Понимаю, что размеров и линий очень много и можно запутаться. Я предлагаю ввести логику : размеры графических элементов подписывать одним цветом или начертанием.
Стандартные элементы (bar, alert, разделители) подписывать не нужно, максимум — выделить цветом, но это всегда лучше уточнить у разработчика.
Пример аннотации шрифтов, цвета и размера разделителей:
Графические элементы (кнопки)
Всегда нужно учитывать, что у кнопок есть три состояния. Не забывайте их прорисовать, иначе разработчику придется делать это за вас.
В Android у графического элемента есть свойство тянуться во все стороны, если он состоит из одного цвета:
Так кнопка выглядит в нарезке: 
Нарезаем, проверяем макеты, графические элементы, делаем аннотации и передаем разработчикам.
И не забывайте делать ревью!
Если остались вопросы/пожелания/замечания, пишите в комментариях.
PS: Материалов на данную тему очень мало, если у вас они есть, то поделитесь, пожалуйста ;)
