Идеальный процесс разработки дизайна

Идеальный процесс разработки дизайна Мы, дизайнеры, постоянно экспериментируем с инструментами в попытке найти лучший. Немного поэкспериментировав, я (автор статьи. прим. пер.) обнаружил идеальный рабочий процесс, которым хочу поделиться с вами. Я использую его во всех моих проектах для создания продуктов, которые любят пользователи.

1. Создание скетча (бумага и карандаш), каждый успешный дизайн начинается на бумаге. Возьмите бумагу, карандаш и начните рисовать.

sketch.jpeg
>Безупречно
2. Ваш следующий шаг - сфотографировать скетчи на ваш смартфон и перевести в POP, так вы сможете протестировать ваш прототип.

pop.gif
3. Следующим шагом станет создание макетов. Скетчей никогда не будет достаточно. Нет другого пути. Просто откройте Omnigraffle и сделайте парочку.

Omnigraffle.png
4. Осознайте, что вам необходимо выпадающее меню, а значит придется переделать макеты в Balsamiq.

Balsamiq.jpeg
5. Дальше, осознайте, что вы б***ь ненавидите Balsamiq, переделайте макеты в Axure.

Azure.gif
6. Дальше, осознайте что вы б***ь ненавидите Axure, переключитесь на Adobe Illustrator и используйте этот UI kit за 89$

Illustrator.png
7. Сейчас нужно экспортировать макеты в PNG и импортировать их в Invision, чтобы показать их вашей команде.

Invision.png
8. Проведите ваше следующее утро рыдая над чашкой хлопьев Honey Bunches of Oats из-за комментариев Джона под вашим прототипом.

HoneyBunchesOfOats.jpeg
Вкусняшка
9. Пообещайте, что больше никогда не воспользуетесь Invision. Из-за ё****го Джона. 

damnright.gif
10. Переделайте прототип в Marvel и молитесь, чтобы Джон не понял как делать комментарии в Marvel.
Marvel.png
11. Успех. Макеты наконец-то одобрены. Отдельное спасибо Джону. Настало время начать работу над высокоточным прототипом. 

success.gif
12. Возьмите несколько стоковых фотографий, которые используют буквально все. Потом в Photoshop'е оптимизируйте их.

photoshop.jpeg
Выглядит довольно оптимизировано
13. Откройте Sketch и начните создавать UI для вашего приложения. Теперь это похоже на настоящий продукт!

sketch.jpeg
14. Теперь экспортируйте в PNG и импортируйте в Flinto Lite.

FlintoLite.jpeg
15. Осознайте, что вам нужны жесты. Купите Flinto for Mac за 99$. Теперь вы можете добавить жесты.

FlintoForMac.jpeg
Они отличаются! Очень важно!
16. Ваш CEO/Stakeholder/Клиент "не хочет устанавливать еще одно приложение на свой смартфон" и отказывается скачать Flinto для iphone.

boss.gif
17. Импортируйте ваш дизайн в Principle и добавьте интерактивности.

Principle.jpeg
18. Осознали, что Principle экспортирует только ё***ое видео? Погрустите минутку.. Все же будет хорошо, правда? 

walk.gif
19. Скачайте Pixate, потому что оно бесплатное и... почему бы и нет?

Pixate.jpeg
20. Постарайтесь научиться использовать Pixate (удачи вам в этом).

21. Все что вам нужно - это разбить ваш компьютер. Если можете, сопротивляйтесь этому. Все это части процесса разработки. Ни кто не заставят вас плакать.

hate.gif
22. Когда-нибудь Pixate доведет вас до грани безумия. Скачайте бесплатную версию Framer.

Framer.jpeg
Очень обнадеживающе!
23. Пойдите поужинайте. Вы это заслужили.

tacos.jpeg
Выглядит неплохо
24. Придите с ужина и осознайте, что пробная версия Framer вышла (серьезно, они дают 32-минутный trial). 

anger.gif
25. Переделайте ваш прототип в Justinmind.

Justinmind.png
26. Стать объектом ненависти для вашей команды из-за отправки файла Jastinmind. Потому что никто не может открыть его. Потому что никто не знает что это за ё***ый Justinmind. 

glee.gif
27. Рассмотрите вариант прыжка с крыши, но осознайте, что все хорошо. Ваши друзья рассказывали вам о совершенно новом потрясающем приложении для прототипирования, о котором они узнали из meetup/конференции/блога/TED talk.

itsyou.gif
Это вы.
Спасибо за внимание. Я надеюсь это поможет моим коллегам-дизайнерам. 

Очень уж вольный перевод статьи (кроме мата, он оригинальный) Keaton Harzer в блоге Prototypr.io: https://blog.prototypr.io/the-ideal-design-workflow-2c200b8e337d


Возврат к списку