Независимо от того, являетесь ли вы опытным Android-дизайнером или новичком в этой сфере, существует множество нюансов, затрудняющих создание приложений для Android.
Здесь, в Brotherhood, мы получаем множество писем с просьбами о помощи и совете по этому поводу, поэтому мы написали руководство по устранению некоторых из наиболее распространенных проблемных моментов для разработчиков Android.
Боль: стена руководств для Android
Если вы когда-нибудь посещали Android для разработчиков, вы увидите, что кроме того, почему Материальный дизайн так хорош, найти информацию о том, как начать работу, немного сложно.
Легко заблудиться и запутаться, особенно когда видишь, что даже на половине устройств Android не установлена последняя версия ОС.
Google с 9 до 5 дает вам довольно хорошее представление о том, о чем мы здесь говорим. Если вы новичок в дизайне Android, то это первая проблема, с которой вы, вероятно, столкнетесь.
Исправление №1: знайте, для каких версий вы разрабатываете
В идеальном мире вы будете проектировать для последней версии ОС Android. На самом деле, поскольку Marshmallow работает только на 0,3% современных устройств, это, вероятно, не так.
« Первый шаг в разработке для Android: знайте, для каких версий вы разрабатываете .»
Хорошие новости: с момента появления Material Design в Lollipop 5.0 все версии выше 2.1 поддерживают Material Design. Так что, за исключением нескольких настроек и изменений (которые мы внесем), ваш дизайн будет довольно хорошо транслироваться в большинстве версий ОС.
Но вам все равно нужно знать, для каких версий вы разрабатываете, поскольку разные версии указывают на разные переменные дизайна.
Будь то географическое положение, размер устройства или даже предпочтения чтения L2R или R2L, важно знать, для какой версии вы будете разрабатывать. Если вы разрабатываете для клиентов, попросите подробную информацию о том, где запускается приложение. Если вы создаете дизайн для себя или для себя, подумайте о своих образах.
Исправление №2: всегда держите ключевую информацию под рукой
Вот несколько ресурсов Android для разработчиков, которые мы держим под рукой при разработке. В зависимости от целей проекта и того, что вас просят сделать, вам может потребоваться дополнительная информация. Но это работает как хороший обзор:
- Образцы цветов для материального дизайна: Google предоставляет подробные основные и акцентные цвета для использования в материальном дизайне. Вы можете легко загрузить образцы для использования в своих проектах (Material Pallette - еще одна быстрая победа)
- Гарнитуры. Шрифт по умолчанию в Material Design - Roboto. Также существуют подробные рекомендации по стилям, сочетаниям и высоте строки. Если вас когда-либо просят перенести дизайн iOS на Android, это спасение.
- Написание: Lorem ipsum и общий текст-заполнитель - это большой запрет в дизайне Android. Хотя вы не играете в копирайтер, всегда давайте своим проектам правильный заполнитель и текст диалога.
- Навигация. В дизайне Android есть разные шаблоны и иерархия навигации. Вы можете не только сделать информацию более заметной, но и разными способами скрыть информацию.
- Рекомендации по продукту: Google довольно точно определяет размер иконок продуктов и системы. Убедитесь, что вы следуете им до пикселя, иначе вы столкнетесь с проблемами в дальнейшем.
- Жесты: независимо от того, просят ли вас заняться прототипированием или просто попросить совета по UX, знание ярких жестов Android является обязательным. По крайней мере, проверьте их и изучите шаблоны.
- Компоненты: Опять же, знание того, как ведут себя компоненты Android, необходимо для создания прототипов. Это также действительно полезно, чтобы знать, где разместить ваши материальные компоненты (и как они будут себя вести).
Боль: поиск примеров качественного дизайна
Отличный способ стать лучшим разработчиком Android: разобрать качественную существующую работу и посмотреть, как она устроена.
Такой подход позволяет увидеть, как создаются ресурсы Android и Material Design. Что наиболее важно, это дает вам возможность самостоятельно создавать проекты и вносить любые изменения (в соответствии с рекомендациями Android), которые вам нужны.
« Отличный способ стать лучшим разработчиком Android: разобрать качественную существующую работу .»
Однако не всегда легко найти качественные примеры, которые бросают вызов вам как дизайнеру, но при этом тщательно соответствуют уже существующим рекомендациям для Android.
Исправление: Используйте наши любимые ресурсы
Мы обнаружили, что UI8 является бесценным ресурсом на протяжении многих лет. У них есть отличные примеры комплектов пользовательского интерфейса, содержащих многоразовые ресурсы Android, которые отмечены всеми нужными полями. Вы можете перестроить (или ретушировать) эти активы по мере необходимости и по-настоящему познакомиться с Material Design. Хотя комплекты пользовательского интерфейса не бесплатны, для любого в мире дизайна Android их ресурсы - воровство.
В качестве альтернативы, если вы ищете бесплатные ресурсы, вот 2 бесплатных набора, которые мы нашли для Photoshop (загружает ZIP-файл) и Sketch.
Боль: сокращение ресурсов Android
Есть вероятность 50/50, что вас попросят сделать это как разработчика Android.
Это схематичная территория, которая находится на стыке дизайна и разработки. В зависимости от того, с кем вы работаете, это может выпасть на вас - так что будьте готовы.
Итак, что именно включает в себя сокращение активов Android?
Как и в случае с iOS, разработчикам Android нужно урезать ресурсы дизайна, чтобы они могли растягиваться и расти с разными размерами экрана. Как и многослойные файлы PSD или файлы Sketch, приложения Android построены на разных уровнях, поэтому кнопки или графические элементы требуют отдельных ресурсов дизайна.
И если вы никогда раньше не сокращали ресурсы Android, вас ждет настоящий шок.
Исправление №1: используйте лучшие практики при сокращении ресурсов Android
Как мы уже упоминали, не все используют самую последнюю версию ОС Android. Вот почему, когда вы сокращаете ресурсы для разработчиков, вас попросят предоставить ресурсы определенным образом.
Плотность
В случае сомнений всегда обращайтесь к руководствам по продуктам Google (они регулярно меняются), но, как правило, все активы, экспортируемые для Android, должны иметь следующую плотность и формат .PNG:
- mdpi: 160 dpi
- hdpi: 240 точек на дюйм
- xhdpi: 320 точек на дюйм
- xxhdpi: 490 точек на дюйм
- xxxhdpi: 640 точек на дюйм
Объекты, вырезанные в указанном выше формате, должны быть одинаковой высоты и ширины. Используйте отступы, чтобы исправить любые проблемы с неравномерными активами, но не переусердствуйте с заполнением, потому что это может вызвать проблемы разработки в дальнейшем.
Размер
Вместо того, чтобы следовать инструкциям, мы используем этот удобный снимок экрана из Справочника по значкам. Он дает четкий обзор размеров и форматов, необходимых для соответствующих значков, а также некоторые примечания, поясняющие, что к чему.
Именование
Это довольно незначительно, но оно необходимо для Android Studio. Все ресурсы должны быть названы с использованием подчеркивания для разделения слов с описательным соглашением об именах для ресурса, например checkbox_on_bg_24dp.png.
9.PNG
В самом буквальном смысле, 9.PNG - это 9 частей изображения PNG, используемых для создания кнопок и всплывающих окон, которые необходимо растягивать и расширять. Таким образом, при добавлении текста он будет правильно расширяться без переполнения.
Самый простой способ создать 9.PNG - сохранить соответствующие вырезанные ресурсы под расширением filename.9.png, окруженные сплошной черной линией толщиной 1 пиксель (# 000000) на краю областей, которые вы Смотрите в масштабе (оставляя углы открытыми). Когда разработчик добавляет это в набор Android Studio, он автоматически определяет их как 9.PNG.
Есть несколько инструментов, которые вы можете использовать для создания 9.PNG без необходимости вручную вырезать и настраивать правила, но если вы хотите узнать больше о том, как это сделать, это руководство предоставит вам всю необходимую информацию.
Исправление №2: используйте правильные инструменты
Вместо того, чтобы вырезать каждый отдельный актив вручную, что является огромной проблемой, вы можете использовать несколько инструментов, которые устранят посредника. Как только вы их запустите и начнете, вы удивитесь, почему не нашли их раньше.
Активы
Вот несколько бесплатных инструментов, с которыми мы добились успеха:
- Sketch Android Assets: если вы дизайнер Sketch, то этот инструмент для вас. Довольно прост в настройке, и мы тоже добились больших успехов. Разработчик неплохо держит это в актуальном состоянии и с последними версиями Sketch.
- Android Assets Studio: с другой стороны, если вы дизайнер Photoshop, то этот инструмент сильно поможет в этом процессе. Снова небольшая настройка, но действительно простая в использовании и отличный способ сэкономить массу времени, сокращая ресурсы. Вы также можете использовать этот инструмент для создания файлов .9.PNG (что является палочкой-выручалочкой).
- Cut and Slice Me (CS6): К сожалению, это не работает с Adobe CC, но если у вас установлена более старая версия Photoshop, то это творит чудеса. Это был наш инструмент, и у него были отличные отзывы, жаль, что он не так полезен, как раньше.
9.PNGS
Мы используем только 2 инструмента для .9.PNGS:
Если у вас есть какие-либо проблемы с настройкой вышеуказанного, просто сообщите разработчикам (или ознакомьтесь с документацией). Хотя они просты в использовании, они полностью меняют правила игры.
Боль: дизайнеры ненавидят материальный дизайн
Материальный дизайн вызывает много ненависти.
TL; DR: Материальный дизайн очень ограничен и иногда создает рекомендации для определенных элементов, которые не соответствуют вашим идеям или художественному руководству. В худшем случае мы слышали, что Material Design окрестили принципом «ленивого дизайна», что немного жестоко.
Исправление: Дизайн как босс
Самый простой способ избавиться от ненависти к материальному дизайну - это сделать то, что сделал бы любой хороший дизайнер: сделать материальный дизайн действительно, очень хорошо.
Dribbble - отличное место для вдохновения с Material Design. Кроме того, вы можете использовать уловку деконструкции, чтобы проанализировать, почему некоторые примеры Material Design превосходят другие, несмотря на строгие правила.
На фото выше представлены несколько лучших снимков Dribbble по ключевому слову «материал». Если вы хотите стать первоклассным дизайнером Android, то вот несколько вопросов, которые вы можете задать, чтобы разобрать кадры:
- Почему они так хорошо выступили?
- Как они раздвинули границы руководящих принципов?
- Как они включили свой собственный стиль и бренд в ограничения?
Не забывайте: иногда Dribbble также содержит нефункциональные произведения искусства. Это может быть что угодно, от концепций до дизайна, расширяющего границы, поэтому убедитесь, что вы черпаете вдохновение из актуальных функциональных источников.
Проектирование для Android не должно быть проблемой. Причина, по которой нам это нравится в Brotherhood, заключается в том, что мы определили свои болевые точки, а затем нашли решения, которые облегчают нашу жизнь.
Мы рекомендуем вам применять этот подход практически ко всему, что вы делаете: определить болевую точку, выяснить, почему она болезненна, и исправить ее.
Фотография из заголовка Карлис Дамбранс. Лицензия Creative Commons Attribution 2.0 Generic. Первоначально опубликовано на сайте blog.invisionapp.com 3 декабря 2015 г.
