Самый большой FAQ для начинающего UX/UI дизайнера

Ответы на самые злободневные вопросы, которых нет нигде больше

Nikita Morozov
UX / UI insane
12 min readOct 8, 2019

--

В свете последних трех лет мне приходилось, хоть и с радость, доучивать начинающих дизайнеров интерфейсов, дабы могли они генерить шекель и майнить достойный оклад в небезизвестном hh.

Как ни странно, но пути всех, без исключения, начинающих дизайнеров, проходили приблизительно по одному и тому же полю, аккуратно устланному многоразовыми граблями ❤️

Мне хочется уберечь вас от свежей шишки на одухотворенном лице, рассказать вам о самом сокровенном.

Идея в том, чтобы подсказать, соориентировать вас в мире непонятном, объяснить понятные нам, прожженным, вещи, совершенно неочевидные со стороны.

Жаль, что когда я начинал этим заниматься, ни одна сволочь не удосужилась поделиться опытом. А я вас люблю, потому честно им делюсь.

Красиво завернул 😎, погнали.

Гайдланы придумали для идиотов. Зачем мне их читать?

На что мы кладем болт сразу? Правильно! На гайдлайны! Ведь ну мы же, ну как же, уже дизайнеры интерфейсов! Идите и перечитайте их целиком, по несколько раз.

Вы не понимаете зачем? Объясню дебильной фразой неблизко к тексту: «Чтобы ломать правила, надо их понимать». А вы ведь не понимаете этих правил, что вполне естественно в начале пути. Начните же их понимать правильно и сразу.

Дело в том, что «кирпичи», идущие в коробке с ОС, подробнейшим образом описаны в гайдлайнах. А вы, как человек, впервые видящий этот конструктор, даже не знаете назначение половины деталей. Считайте, что это инструкция, которую для вас любезно написали сами создатели конструктора, чтобы вы не городили херни там, где проблема сто раз как решена.

Не поленитесь, ваши страдания окупятся очень быстро.

Я не знаю, с чего начать…

Да, этот вопрос — 100% хит! А как вы думаете, с чего все начинали? С поста в фейсбухе, вкАнтактике, одноглазниках о том, что вы теперь могёте и ЮХ и ЮЙ и их дизайн! Никто иначе не узнает. А, как показывает практика, мало у кого во френдах есть друзья-дизайнеры, да еще и дизайнеры интерфейсов. Сообщите Миру о том, что вы есть, и, может быть, на вас снизойдут заказы. Но не сразу, через какое-то время точно.

Второй нехитрый способ — отечественная биржа проклятых, вроде фриланс.ру и иже с ними.

Третий способ — группы типа ИЩУ_ДИЗАЙНЕРА в фейсбухах, чат-ботики в Телеге.

Четвертый способ — расклейка объявлений на подъездах 😂

Как разобраться в ТЗ?

Вопрос, поначалу леденящий душу. Правда, очень стремно, да и потом бывает сердце ёкает от непонятности.

Давайте декомпозируем проблему.

Во-первых, к вам не пойдут профи с целью сделать бОООльшую систему, потому что они понимают опасность затеи.

Во-вторых, к вам потянутся люди, согласные на определенный ценник (400 — 600 рублей в час).

В-третьих, клиенты еще и хуже вас понимают, как их проект должен работать и выглядеть. С высокой долей вероятности, для клиента, как и для вас, это первый опыт IT-любви.

В-четвертых, если вы читали мой пост про модель данных, то именно этот способ и личное (Skype/Zoom) общение с клиентом позволит вам понять, что же вы такое делать собрались.

В итоге-то что? Как читать ТЗ?

Достаточно просто: читайте и рисуйте на бумажке из каких частей состоит продукт (админка; профиль; корзина; страница товара/услуги; логин-регистрация и т.п).

Затем обсуждаете ваши догадки с клиентом, и узнаете в десяток раз больше подробностей, которые жили лишь в его голове (и он не мог их нормально сформулировать).

Далее, в идеале, расписать модель данных и, положив пару листочков А4 перед глазами, начать рисовать Ч/Б схемки экранов, рисуя на них данные из модели.

А потом — рисуйте!

Мое портфолио состоит из одного проекта. Что делать?

Это – норма (с)

У всех так было. Ничего, с голоду не померли. Почему так произошло вам понятно, а что с этим делать-то?

Давайте взглянем на ситуацию глазами различного рода клиентов и вы сами все поймете.

DISCLAIMER — все персонажи выдуманные. Любое сходство является случайным.

Персона #1

Василий, #яумамыстартапер. Он никогда не занимался IT, но они с другом решили просадить мамины деньги и придумали, как захватить Мир. Кого ищет Василий: «Дизайнер должен рисовать модные интерфейсы как у крокетбанков, уберов, яндексов».
Условные «Василии» не понимают ничего в IT, потому выберут по кандидата из-за красоты интрефейсов (что их и погубит, ха-ха-ха).

Персона #2

Онотолий. #опытныйгусь. Работал консультантом в условном КПМЖо, запускал какие-то проекты с каким-то результатом. Несмотря на хороший костюм и умные глаза, Онотолий не знает толком ничего про данные, про настоящих пользователей и полагается в этом вопросе на UX/UI дизайнера. «Онотолий» будет смотреть на продуманность проектов, искать в них логику и здравый смысл. Что касается красоты, то в мире B2B ей всецело пренебрегают, причем осознанно.

Персона #3

Опытный бизнесмен, бывший продакт менеджер или продакт оунер Захарий. Захарий поел говна на разных проектах и готов работать только с демиургами по 100500 рублей за час. Разумеется, на ваше портфолио он смотреть не будет (не обижайтесь, правду говорю).

Это ваши условные клиенты (на самом деле, типажей несколько больше, но не суть). Теперь подумайте, как сработает в вашем портфолио yet another редизайн фейсбуха? Или как сработает проект по созданию антивируса для Android, который вы сделали бесплатно в качестве первого проекта? Впечатление будет разное для каждого заказчика.

Увы, нет такой серебряной пули — каждый ищет своего дизайнера.

А что делать с портфолио?

Вы о том, что вас не лайкают на бехансиках-дрибббббблах? Меня тоже не лайкают 😂

А знаете почему? Потому что бехансик уже лет пять как превратился в ферму по майнингу лайков. Хотите, чтобы лайкали: идите и лайкайте все подряд, и пишите в комментах «WOW! Amazing work! Please check mine (и вставляете ссылку на свой проект)». Все как в инстаграме с накруткой.

Вам противно побираться лайками (как и мне)? Тогда просто постите те проекты, которые считаете удачными. Вы не прыгните выше головы, да и не нужно это никому. Ваш будущий клиент выберет именно вас среди тысяч других по одной лишь ему известной причине, и вы никогда не поймете почему.

Кто-то из клиентов ждет розовых единорогов и ищет смуззи. Кто-то ищет сурового технаря на отрисовку ERP или CRM, и ему плевать на смуззи-дизайн. Кому-то понравился ваш стиль, пусть вам он и кажется недостойным.

Касательно дрибббббла, скажу так: я в принципе не понимаю этого ресурса. Там много красивых вещей, но 99.9% из них обречены остаться там, ибо не применимы. Сами создатели дриббббла промоутят его как площадку для цифррового онанизма, экспрессии тайных ЮХ/ЮЙ фантазий. Вот встал у вас на ночь глядя интерфейсный кукан, пошли порисовали креатив, придумали новый паттерн, залили на дрибббббл и попустило. Имеет смысл размещать там портфолио? Ну такое…

Как ни крути, ваше портфолио — ваш актив. Он такой же индивидуальный, как и вы. Вы ведь не стесняться себя? Если стесняетесь, то опытный психотерапевт выбьет из вас эту дурь за 3–4 занятия 😉
Не благодарите.

Через четыре года успешной работы в IT-сфере, ваше портфолио вам будет не особо нужно. У вас будет репутация!

Что мне лучше рисовать: бизнесовые приложения или B2C?

Деньги в B2B, если смотреть с позиции фрилансера или наёмного сотрудника. Денег там по определению больше, как и сложность проектов. Достаточно сбалансированное сочетание, если не брать в счет проекты по отмывке бабла условным газмясом 😱

B2C — творчество и дух стартапа. А как мы знаем, художник должен быть бедным. Беднее граф. и принт дизайнеров вы точно не будете, но и сверх богатыми тоже, если вам не выделили долю в бизнесе.

А сильно различаются между собой платформы?

И да и нет. Простого ответа нет.

iOS от Android отличается суммарно на 20–30%. Если говорить о стандартных контроллах и паттернах, которые идут «из коробки» вместе с ОС. Имеются ввиду «нативные» контроллы, паттерны и компоненты.

Говоря об универсальном дизайне под обе платформы, чаще всего имеют ввиду то, что разрабатывать будут на React Native сразу под обе платформы. Но это не значит, что на разных платформах приложение будет выглядеть идентично!!! Это лишь значит, что вам придется нарисовать все экраны под одну платформу, и нарисовать ключевые и самые сложные экраны под другую платформу.

Если говорить об отличии web app (те, что работают в браузере на компе) от mobile apps — это пропасть.

На самом деле нюансов много больше, но сейчас по верхам пойдем.

Данные? А что это? Никогда не слышал…

Я достаточно много писал о них (но кто будет про них читать, пока петух в жопу не клюнет). Студенты начинают понимать ценность данных только когда начинают искать работу, и вы с ними в этом очень похожи 🧐.

Почему это важно? Потому что это слой, который лежит сразу же под гримом UI. Без данных ничего, никогда и нигде работать не будет. Весь ваш UX есть ни что иное, как упаковка и распихивание данных по экранам. Просто примите это как данность, ибо с продакт менеджером, разработчиком и бизнес аналитиком вы будете 90% времени говорить о данных и способе их отображения в интерфейсе в виде паттернов, контролов и форм на разных экранах.

97% этих данных находятся через построение модели данных при помощи мозгов, карандаша и листов бумаги формата А4.

Но ни в коем случае не говорите об этом другим – пусть страдают.

Как начать рисовать круто?

Круто — значит рисовать как нужно для этого конкретного приложения. Мы не художники, мы на 2/3 технари (сюрприз!). А это значит, что вам нужно решать проблему человека при помощи дизайна интерфейса (а он, в свою очередь, должен быть удобным. А затем уже красивым).

Потому, первое, с чего имеет смысл начинать — научиться перерисовывать чужие интерфейсы. Но прежде, чем вы броситесь на беханс за красотой, напомню о том, что перерисовывайте СЛОЖНЫЕ, максимально сложные экраны бизнесовых приложений! Перерисовка смуззи-редизайнов даст вам ровным счетом чуть более, чем ни**я в плане скилла.

Второе, что вы должны знать: как создавать библиотеки символов (Sketch) или компонентов (Figma). Почему это важно? Хорошо сделанная (а не скачанная) библиотека сродни профессиональному музыкальному инструменту, который звучит в ваших руках великолепно, вам с ним всегда удобно и комфортно. А еще библиотека может экономить вам часы, дни или даже месяцы. И я сейчас, б***дь, максимально серьезно об этом говорю! Никаких Group 142 и Layer 976 быть в ваших файлах не должно, также как и отсутсвие Text и Color styles. Как это правильно сделать? Youtube вам в помощь по запросу «How to create design system in Sketch app». Помогите себе не работать по 14 часов в день, работайте 6 с вдвое большей эффективностью.

И, третье. Как в свое время сказал мне коллега:

“Никита, твоя задача сделать удобно и не очень страшно. Большие системы не могут быть красивыми, потому что в них слишком много данных”.

Мне так и не удалось опровергнуть этот тезис 🥵. Не гонитесь за красотой там, где удобство должно быть на первом месте.

Как пользователь оценивает дизайн?

В большинстве своем — никак. Лишь нам кажется, ввиду проф.деформации, что все вокруг обладают чувством прекрасного. Увы и ах, господа.

В лучшем случае, в течение 30 секунд человек оценит ваше стремление к прекрасному. В следующий раз восторг продлится не более 10 секунд. А в третий раз это станет привычкой.

Касательно того, что дизайн приложения должен родниться с брендбуком клиента забудьте сразу: оно никому не нужно.

Может ли человек отличить два очень похожих приложения? БЕЗУСЛОВНО, ДА! Поэтому не нужно внедрять «красоту» там, где можно обойтись без нее. Не оценят, а разработка стоит денег. Но если вам это так важно, то вперед, залейте Мир красотой! 🦄 🌈

Если нет опыта, то что мне делать?

Идти, рисовать, проектировать и получать опыт. В идеале — стажировка. Если не получается — фриланс. Кто-то устраивается на позицию Junior UX/UI дизайнера сразу. Нужно пробовать все варианты.

Где ты берешь шрифты?

Стараюсь использовать нативные (те, что идут вместе с iOS или Android. Можете загуглить). В остальных случаях — Google fonts. Он закрывает 100% кейсов, потому что только дизайнер может отличить SF Display Pro от Helvetica; Garamond от Times New Roman; Open Sans от Roboto.

Не мучайте себя и других. Когда-нибудь, вы обязательно встретите клиента, готового отдать 8 000–16 000$ за шрифты для iOS и Android во имя красоты…

Как общаться с клиентом?

Как с ребенком лет десяти. Ему нужно все очень подробно объяснять, потому что он нихера не понимает в ваших UX/UI делах (может быть и к счастью). В душе он будет думать, что где-то вы его наебываете, и ваша задача состоит в том, чтобы снять эту тревожность, разжевав и объяснив все на «пальцах».

Как определить сроки проекта?

🎱 ☕️

Беда в том, что даже опытные коллеги по цеху далеко не всегда могут «угадать» со сроками. Если быть совсем честным, угадать получается один раз из десяти.

Можно лишь предположить, что исходя из понимания вами сути и сложности проекта, это займет неделю / месяц / три месяца. Клиент имеет шанс угадать где-то 1 к 1000, потому вам придется его убедить в том, что вы прикинули точнее.

Но не путайте: продолжительность работ и fix — не одно и тоже. Вы можете сделать все за неделю, а сдать через месяц. А можете, наоборот, поработать полтора месяца (при оговоренном с клиентом месяце) и профакапить проект на две недели, сработав себе в минус.

И как же мне «ванговать» сроки? Для начала, не надо сходу называть цифры. Возьмите денек на подумать, лучше два. Внимательно посмотрите ТЗ / требования / модель данных, выдохните, расслабьтесь и дайте интуиции подсказать вам число. Что пришло первым в голову, тот срок и ставьте.

Что и сколько стоит?

У вас есть три опции (на фрилансе):

  1. Почасовка (Time & Material). Цена от 400 до 5000 ₽ / час. Зависит от скилла и любви к себе. Наебать не получится ибо это чувствуется в общении и в том, как хорошо и быстро вы делаете свою работу. Потому назначайте ту цену, на которую согласна ваша совесть в данный момент вашей жизни. Ее можно пересмотреть, когда вы будете себя больше любить.
  2. За проект (Fix). Он и в Африке фикс. Тут все зависит от того, насколько хорошо вы оценили свои риски. Можно обосрать, можно заработать сверху.
  3. Фикс + почасовка. Вы оговариваете, скажем, 80 часов по n-рублей. Все, что выше по вине клиента идет по часам сверху. Применяется, когда ни вы, ни клиент не понимаете сколько займет проект. Обычно встречается на очень больших либо очень непонятных проектах.

Как передавать работу клиенту?

Голубиной почтой, разумеется.

Сейчас (как и последние четыре года) применяется выгрузка экранов в zeplin.io плюс передача исходников.

Ничего лучше я пока не встречал. Можете передавать в Invision, там тоже есть похожий на Zeplin функционал.

Как работать в Sketch нескольким дизайнерам?

Sketch сейчас готовит какую-то систему контроля версий (информация на начало октября 2019). Приятная альтернатива ему — abstract.com. Приблизительно также работают разработчики (GIT). Лично мне такой подход нравится, хотя это не бюджетно и для фрилансера договато.

Можете попробовать работать через Dropbox, но велик шанс перетереть изменения соседа, если оба работают одновременно над одним файлом.

Других альтернатив для себя я не находил.

Меня приглашают/хочу найти работу. Какие расценки?

Благо я не HR, но есть моя личная статистика на октябрь 2019 в «Нерезиновой» родимой. Суммы могут быть другие, но я всего-лишь диванный аналитик 🥴

Стажер: 40 000 – 70 000 рублей.

Junior UX/UI: 70 000 – 100 000 рублей.

Middle UX/UI: 120 000 – 160 000 рублей.

Senior UX/UI: 160 000 – 200 000 рублей.

Design lead: 180 000 – 260 000 рублей.

Демиург, любимец газмясов: 300 0000 – 500 0000 рублей.

Сын маминой подруги: 500 000 – 1 000 000 рублей.

Нужна ли дизайн-система?

Вы имеете ввиду несколько файлов, подключенных в Sketch как библиотека?

Не люблю этот термин, пахнет от него казенщиной и корпоративной культурой 🥶🤢

Когда мы говорим о фрилансе, то использовать (и переиспользовать) Library можно и нужно.

Когда вы работаете на дядю, то конечно же, без «дезигн-системы» никуда. О ней можно написать в блоге, рассказать начальству и получить премию. Но, по-прежнему, это будет один или несколько Sketch-файлов…

Если речь идет о Figma, то там в платном плане есть Shared library, что никак не меняет общей сути — дизайн-система живет лишь в голове, а то, что вы видите в редакторе есть ни что иное, как набор компонентов, стилей текста и цвета.

Как долго разрабатывают приложение?

Моя любимая тема. Видите ли, это теория большого обмана. Разработчики называют сроки и никогда в них не укладываются. Почему? Потому что реальные сроки разработки не устраивают ни заказчика, ни менеджера, ни вас. Никого. Потому приходится чуть-чуть приврать, но все к этому давно уже привыкли 😏

Как же тогда для себя определить, когда можно выкладывать проект в портфолио? Очень просто: есть одна формула, которую в свое время вывел мой прекрасный друг VP Engineering.
Следим за руками 😎:

(N* х 2) х 1.3 **

N = срок, который предполагают разработчики.

* Дизайн в расчет не входит, так как к началу разработки он должен быть завершен и принят заказчиком.

** Тестирование и фикс багов занимает около 30% от затраченного на разработку времени.

Ожидание: разработчик Руслан утверждает, что он сделает iOS-приложение за три месяца.
Реальность: (3 месяца х 2) х 1.3 = 7 месяцев и 23 дня. Да-да, за почти 8 месяцев и все готово и протестировано. Накинем еще две недельки на публикацию приложения в Apple App Store и вуаля! 👑

Если у вас есть вопросы, оставляйте их в комментариях и я с удовольствием дополню этот пост ответами на них 🙏🏻

Счастья вам и лениться побольше ❤️

Если вам понравилось, — скажите «Спасибо», кликнув на кнопку 👏🏻 — это поможет другим людям быстрее найти статью.

Другие интересные темы:

Почему красивый интерфейс никому не нужен →

Самый большой FAQ начинающего UX/UI дизайнера →

Лень →

Дизайн продукта VS Аутсорсинг VS Фриланс →

Способы хранения контролов →

Что такое бизнес-логикаc

Sketch VS Figma & co. →

Дизайн-экономика в продукте →

Целевая аудитория и то, что под ней НЕ понимают →

Модель данных в интерфейсе →

Приоритеты пользователей →

А что рисуют дизайнеры? →

UI киты против реальности →

Запуск проекта глазами дизайнера →

UX весь какой он есть →

Простое и понятное в UI →

Жизнь после ТЗ, опыт на ниве интерфейсов Рунета, «кто все эти люди» и мое предназначение →

Парад заблуждений новичка →

Наш лучший друг — клиент →

Из чего же сделаны наши прилаги? →

Проблема, решение и функционал →

Коротко о Главном →

Прайс vs ТЗ →

Парочка “бюджетных” страхов →

Вот наше ТЗ. Тут все и так понятно! →

Цена вопроса →

Локализуй — или покарают →

Шрифты и их малообразие →

Железно-софтверный обман →

--

--

Nikita Morozov
UX / UI insane

UI/UX Lead, продакт менеджер, преподаватель. Обладаю огромным опытом в проектировании и дизайне B2C, ERP и BPMs, а также мобильных и веб приложений.