Привет, меня зовут Дарина, я работаю джуниор UX UI дизайнером в продуктовой компании специализирующейся на туровом бизнесе.Мой путь типичен для большинства дизов из СНГ, закончив одну из известных дизайн школ, я отправилась на поиски работы мечты. И вот какими инсайтами я могу поделить спустя время:
1. Зеленому джуну нужен сенсей
Для молодого и неокрепшего джуна, еженедельное дизайн ревью от квалифицированного лида - основа для планомерного роста. Чем профессиональнее кругозор и знания лида выполняющего арт надзор, тем круче это сказывается на получаемых знаниях джуна.
Дизайн-лид отвечает за качество сдаваемого в эксплуатацию дизайна, в обязанности лида входит подтверждение пригодности работы дизайнера по всем аспектам, по которым измеряется качество дизайна. Чем чаще будете получать обратную связь по создаваемым продуктам, тем ниже вероятность допуска ошибок в проектировке.В интересах лида выровнять группу по базовой компетенции. Но если у лида нет мотивации быть наставником для junior-а, задавайте вопросы самостоятельно. Берите обратную связь от других коллег, ищите альтернативу, спрашивайте стейкхолдеров - нравится ли им предложенное вами решение, не бойтесь получить критику.
Как говорил мой первый сенсей "Наша работа - это череда постоянных переделок".
2. Проектирование начинается с ... вопросов
Прежде чем открыть Figma и кинуться отрисовывать варфрейм (а того хуже собирать готовый макет), убедись, правильно ли ты понял задачу. На начальных этапах советую обзавестись чек листом, в котором ты выделишь ключевые вопросы:
1. Какую задачу мы хотим решить?
2. Проработана ли логически основа решения? ( вдруг уже готово решение, а тебе нужно только натянуть UI )
3. Для кого мы решаем задачу ( какое количество сценариев \ их доступность) ?
4. Реализуемо ли решение в рамках технических возможностей разработки? Правильно определенная задача, экономит дни, иногда целые недели.
3. Быстро не будет. От идеи до финального макета
Первый этап. Проработай идею минимально глубоко. Куда на текущем экране будет добавлена новая идея? Какой путь будет вести к ней? Каковы ее основные части? Куда она в конце приводит?
Второй этап - или толстый маркер. Этап на котором набрасываются ключевые компоненты и связи в интерфейсе . Выделим три момента : места - это части интерфейса в которые можно попасть - экраны, поп апы. Действия - это части экрана с которыми можно взаимодействовать - кнопки, инпуты. Связи - это невидимые линии которые показывает как действие переносит нас с одного экрана на другой.Описывая места, действия и связи, мы можем быстро проработать принципиальные дизайнерские решения не отвлекаясь на мелочи. Суть этого процесса не тратить много времени на прорисовку мелких элементов, а понять в правильном ли направлении мы двигаемся или стоит еще немного побрейнштормить.
Третий этап. Варфрейминг. Hi Fi layoutНа этом этапе определяем сетку, скругления элементов, высоту кнопок, количества текста и т.д. Нужен именно тот обьем конкретики который в дальнейшем будет нужен для формирования финального макета.
Четвертый этап. Финальный макет.P.S Забыла сказать, что каждый из этапов апрувится тим лидом (либо другим участником процесса несущим ответственность за дизайн).На последнем, финальном этапе, можем применять стили существующей дизайн системы, следовать гайдлайнам компании, приводить в порядок артборд для последующей передачи макетов в разработку.
4. Порядок на макете - порядок в голове
Самые частые ошибки новичков — неправильное выравнивание слоёв, игнорирование межбуквенного интервала или высоты строк и хаотичный порядок редактуры. Все это в дальнейшем сказывается на качестве работы.
Правильно организованное дизайн пространство в Figma напрямую влияет на два показателя:
1. выполнение дизайнерами проектирования поднимается на уровень выше, за счет наличия дизайн системы с которой легко взаимодействовать ( легко - значит что все стили зафиксированы в отдельной папке UI KIT которая обновляется постоянно. Продукты компании это живые организмы, которые постоянно меняются, дополняются. Ты должен быть в курсе всего, что вносится в дизайн систему, для этого лучше всего подходят небольшие синки с коллегами, для уточнения нюансов. Наладив этот процесс вы быстро и эффективно будете закрывать рутинные таски.)
2. разработчикам гораздо проще взаимодействовать с макетами в Figma которые логично структурированы, разбиты на подгруппы, разбиты по сценариям, соответствую дизайн системе.
P.S Дизайн это прикладное искусство, лучший способ перенять навык — наблюдать за «мастером своего дела». Работайте с лучшими, учитесь у лучших.
