Дизайн алгоритма, который помогает подбирать одежду
Стройные процессы = эффективный интерфейс. Лидия Богданович
1. Стройные процессы = эффективный интерфейс
Как построить рабочие процессы в дизайн отделе,
чтобы вас все любили
Богданович Лидия
Head of Design Department
PROVECTUS IT, INC
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22. Note:
1. Пронумеровать, подписать, прокомментировать все экраны
2. Логически верно и последовательно расположить экраны
3. Проработать все возможные сценарии и ошибки
4. Проработать граничные значения
5. Протестировать схему
49. Note:
1. Проверенная схема приложения с дизайном, со всеми
проработанными сценариями и ошибками
2. Анимационные ресурсы и раскадровки
3. Нарезка дизайна для разработки, во всех необходимых размерах
4. Руководство по сборке дизайна
5. Проверенная сборка
50.
51. Lidiya Bogdanovich | Head of Design Department
PROVECTUS IT, INC | lbogdanovich@provectus-it.com
+380 68 2540866 (mobile)
Skype: lidiyabo
http://provectus-it.com
Email
Dribbble
Notes de l'éditeur
международная R&D компания, предоставляющая полный комплекс услуг по разработке программного обеспечения для корпоративного сегмента, мобильных платформ и WEBТри года подряд завоевывает титул лучшего работодателя украины в рейтинге IT-компанийВ компании Провектус работает более 270 человек, 6 из которых составляют отдел дизайна, специализацией которого является разработка web и мобильного UI.
Оговоримся, о том, из кого состоит наша дизайн команда
Существует много споров о том, должен ли дизайнер быть usability специалистом? должен ли usability специалист уметь рисовать?В компании Provectus, мы для себя решили, что UX специалист и графический дизайнер это должно быть одно лицо, компететный специалист, способный выполнять полный спект диайнерских задач.
Все мы сталкивались с ситуацией, когда финальная сборка не похожа на финальный дизайн, и заказчик в итоге получает непредсказуемый результат.
Или наоборот. Как часто мы видим на дрибббле высокохудожественные макеты, которые слишком фееричны, чтобы их воплотить в жизнь в разработке?
Когда дизайнер заигрался а заказчик утвердил?...
В результате мы имеет сорванные сроки и утраченные нервные клетки у всех участников процесса.Чаще всего это не ошибка дизайнера или разработчика. Не злого заказчика или менеджера. Чаще всего это ошибка взаимодействия и коммуникации.Поломанного процесса разработки дизайна.
Поэтому мы поговорим сегодня о том, как наладить и стандартизировать этот процесс, и сделать его максимально прозрачным, для всех участников разработки.
Итак основные конфликтующие роли в процессе разработки это:разработчик, который хочет чтобы разработка была максимально простой как и дизайнДизайнер, который хочет, чтобы было максимально красиво (если это хороший дизайнер)PM, который хочет чтобы проект прошел максимально быстро и уложился в заявленные сроки и бюджетИ заказчик, который хочет максимально красиво, быстро, просто, экономично, в срок, и чтобы процесс был понятен.Наша задача построить такой процесс, чтобы все стороны остались довольны.
Итак первый шаг- определение дизайнерского процесса
Методом проб и ошибок, в течении трех лет, нами был выведен следующий сценарий работы,При котором процесс дизайна от этапа выянения требований до поддержки продукта после выхода на рынок является максимально структурированным и прозрачным.Подробней рассмотрим каждый из этих пунктов.
После выяснения требований заказчика (в котором, на равне со всеми, принимает участие дизайнер) мы переходим к провектированию ключевых экранов приложения
Wireframes workflow.
Что представляет из себя wireframes workflow. Это не только набор схематически отрисованных экранов, высокой детализации, это также все логические связи и переходы, между всеми возможными экранами в приложении, во всех возможных сотояниях.Все экраны пронумерованы, так удобней обсуждать схему внутри команды и с заказчиком, подписаны, описаны (что в будущем является более удобным инструментом для разработчиков интерфейса, чем текстовое ТЗ). Прорабатываются все крайние значения и возможные ошибки. Полностью графически детально описанное приложение.
Полная схема приложения. На этом этапе более-менее окончательно утверждается функционал приложения, обсуждаются основные технические и нетехнические вопросы с заказчиком. Позволяет экономить время на этапе переговоров
Схемы могут быть как среднего размера так и огромными. Но тем не менее, как показала многолетняя практика, даже огромная схема является наиболее гибким и удобным инструментом, для взаимодействия как с заказчиком, так и внутри команды.
Неудачный пример. Иногда мы сталкиваемся с подобными схемами от сторонних дизайнеров. С такой схемой дальнейшая работа невозможна.
Итак что необходимо помнить, при разработке такой схемы.
Разработка дизайна. Самая любимая часть работы любого дизайнера.
И тут очень важно не забыть, что люди мы подневольные, и работаем на заказчика и на его пользователей. И в первую очередь, наша цель-удовлетворить их потребности и решить их задачи, а не удовлетворить свои дизайнерские амбиции. Казалось бы это очевидно, но тем не менее мы каждый день сталкиваемся с красивым дизайном, который к сожалению не подходит для решения данной конкретной задачи.
Один из ярких примеров, то, чем часто грешат девушки-дизайнеры.Когда очень очень и давно хотелось сделать именно такой, жизнерадостный красивый нежный интерфейс. И первый же проект, вне зависимости от тематики, попадает под творческий обстрел и понеслась душа в рай =) креатив. Красиво же
Вот еще очень показательный противоположный пример, приложение, разработкой которго занимался мой очень хороший знакомый, и очень удивлялся, что его ругают за дизайн. Что делает это приложение
Приложение позволяет любящим матерям находить своих детей на карте.
После того, как look and feel приложения утвержден, в выбранном стиле отрисовывается вся ранее нарисованная схема приложения.
Самый популярный на сегодняшний день вид развлечения дизайнеров. Motion design или анимация
Анимация является неотъемлимой частью процесса создания интерфейса.Она придает дизайну завершенности,И является признаком более продуманного графического дизайна
Анимация должна быть неощутимой в дизайне.Однако, многие забывают, что создавая анимацию очень важно не заиграться,
Иначе анимация выйдет на первый план, вместо основной функциональности приложения
Тестирование
Нам не хватит 15 минут моего доклада, чтобы обсудить юзабилити тестирование,Поэтому мы остановимся на некоторых показательных моментах, о которых зачастую забывают.
Проверка дизайна приложения должна осуществляться на всех этапах разработки. Это существенно сэкономит время на финальных стадиях разработки.
Приложения должно проверятся в тех условиях, в которых оно будет эксплуатироваться. Если приложение будет использоваться на улице. Это может быть и поиск кафе и вызов такси и фото видео приложение. Тогда нужно выйти с приложением на улицу и проверять его там.Так например, если дизайн недостаточно контрастный, он может бликовать и функциональные элементы будут плохо различимы под солнцем.
До проектирования приложения - пообщайтесь с вашей целевой аудиторией. Если приложения для рецептов-проверяйте его на кухне, если для такси, поездите с таксистами и узнайте их мнение. Мы занимались разработкой приложения для заказа линз-и проверяли его соответсвенно на людей с плохим зрением, вумен.ру- на женщинах домохозяйках. Такси-на таксистах. Приложение для Лас Вегаса- в Лас Вегасе.
Когда работу дизайнера, можно считать оконченной
Создание набора красивых картинок, еще не означает завершение работы над приложением.Задача дизайнера, создать максимально комфортные условия для сборки дизайна для разработчиков, если он хочет получить задуманный результат.В обязанности наших дизайнеров входит подготовка ресурсов для разработки. Это нарезка под все необходимые разрешения
Максимально детальное руководство по сборке дизайна
Пошаговое руководство и покадровая анимация
Аккуратно организованные рабочие файлы и исходники
Ревью каждой версии сборки.
Что получает заказчик на каждом этапеПеречисленные пункты+ заявленные сроки по каждому этапу, и полная прозрачность процесса.
Как результат-соблюденные сроки, попадание в заявленный бюджет, предсказуемые результаты и довольная команда.