Мнения 26 июля 2022

Интерфейсы, которые работают: 4 главные ошибки начинающих дизайнеров

Далее

Интерфейс — это средство взаимодействия между пользователем и программой, которое должно быть максимально простым и удобным. В дизайне даже есть метрика, отражающая это, — Time on Task, «время, потраченное на задачу». Влиять на нее можно через UX-дизайн — продумывать действия пользователя таким образом, чтобы путь между точками A и B занимал меньше шагов и времени. Однако дизайнерам-новичкам это не всегда удается: программы получаются сложными и громоздкими. О трудностях и ошибках UX/UI-дизайнеров на старте рассказал 3D motion-дизайнер и художник, визуальный дизайнер платформы для онлайн-изучения языков Mango Languages Константин Жабинский.

Почему новичкам сложно на старте

Слабая визуальная насмотренность

Часто начинающие специалисты копируют чужой стиль и замыкаются на нем. Они забывают, что в дизайне нужно генерировать много идей, которые необязательно должны быть красивыми и точно проработанными с самого начала. Это распространенная ошибка дизайн-школ: специалисты выходят оттуда перфекционистами и хотят сразу делать безупречные проекты. Но все работает наоборот: сначала лучше придумать несколько разных вариантов, а затем постепенно отбрасывать неподходящие и уже в конце переходить к деталям.

Опыт «в вакууме» новички не сталкивались с реальными задачами

Мало кто понимает, что цель дизайнера — решать запрос бизнеса, а не просто создать красивый дизайн-макет в Figma. Поэтому только зашедшие в профессию специалисты вместо того, чтобы решать задачу, рисуют красивую картинку. Этот «переход» от красоты к функциональности дается нелегко, но он очень важен для роста в профессии. Фактически это одна из главных сложностей на старте карьеры дизайнера.

С каждым годом требования к специалисту растут

Набор базовых навыков и так объемный, а к нему добавляются еще и смежные — знания в продуктовой аналитике, разработке, анимации и так далее. Самостоятельно развивать их очень сложно, почти всегда нужен руководитель или ментор.

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

4 ошибки новичков и как с ними работать

Можно выделить несколько «пробелов», которые есть почти у всех начинающих дизайнеров. Но с ними легко можно справиться, если заметить в своей работе.

1. Видеть работу как искусство. Нередко новички думают, что они художники, и занимаются не тем: выверяют отступы между блоками текста, часами подбирают цвета и пытаются построить композицию по золотому сечению. Все это почти неприменимо к дизайну интерфейсов. Область не просто так называют Human Interface Design, она очень прикладная: здесь важно проектировать интерфейс для работы человека с компьютером, сайтом или приложением и в первую очередь думать о том, насколько удобно и просто будет пользоваться продуктом. Здесь лучший совет: думайте сначала о функции, а потом об эстетике.

2. Усложнять интерфейс и украшать ненужными элементами. Начинающие дизайнеры часто пытаются добавить больше иконок, графики и других «украшательств» в сложный интерфейс. На такой случай есть хорошее правило: чем меньше дизайна, тем лучше. Минимальный набор элементов выгоден и для дизайнера, и для будущего пользователя. Первый легче и быстрее справится с задачей, а второй сократит время на решение запроса. Тут следует помнить про главную метрику — Time on Task.

3. Плодить лишние экраны и действия для пользователя. Девиз многих новичков: «Сложно — значит для профессионалов». Из-за этого они намеренно усложняют некоторые шаги, чтобы показать, как много умеют. По этой же причине можно наблюдать сайты ресторанов и кафе, которые оформляют диджитал-меню так же, как обычное непосредственно в заведении. Везде добавляют расписные фоны, анимированные картинки и баннеры, которые перегружают страницу и отвлекают от основного. Например, номер телефона, по которому клиент может заказать столик и заплатить за ужин, найти практически невозможно.

4. Не видеть общую картину процесса. Новички стараются не выходить из зоны комфорта и мыслят только в рамках поставленной задачи. У них пропадает ощущение масштаба и не получается связать свою часть работы с общей целью проекта. Из-за этого возникают ситуации, когда дизайнер создает крутое решение, которое упрощает регистрацию с трех шагов до двух, но потом сайт перебрасывает пользователя на сложнейший экран настроек: от этого весь эффект улучшения пропадает. Чтобы вовремя замечать подобные ошибки, нужно уметь общаться с другими отделами: разработкой, маркетингом, бизнесом. Дизайнер может обратить их внимание на проблему и предложить решение, выходящее за рамки «сделать дизайн регистрации». Важно всегда чувствовать масштаб изменений, которые дизайнер вносит в продукт.

Лайфхаки: как создавать крутой интерфейс

Делайте упор на UX опыт пользователя. Продукт дизайнера, в первую очередь, должен быть простым и понятным. Поэтому при разработке дизайна нужно всегда думать о клиенте и цели, которую он хочет достичь.

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

Понятный UI то, как сайт или приложение выглядит. Хороший интерфейс всегда сделан с вниманием к конкретному пользователю. Поскольку понятие «удобный интерфейс» для всех разное, дизайнеру нужно отделять целевую аудиторию от остальных и разбираться, как именно ей будет удобнее пользоваться продуктом.

Такой подход позволяет создавать интерфейсы действительно понятными для конкретной аудитории с определенными ожиданиями от продукта. 

Здесь также приветствуется простота. Поэтому если совсем не знаете, каким сделать интерфейс, используйте принцип «чтобы поняла моя бабушка». Он работает в любой непонятной ситуации.

Проводить коридорные интервью и тестировать интерфейс. Невозможно точно просчитать, насколько актуальным будет продукт, поэтому лучше начинать разработку с малого и только потом добавлять новые функции. Так можно запустить продукт быстро и развивать его, максимально учитывая потребности целевой аудитории. 

Рассмотрим в качестве примера разработку дизайна для Generated Photos — сервиса, который генерирует фотографии лиц на основе искусственного интеллекта. Первую версию продукта осознанно спроектировали в виде портала стоковых фотографий с большим набором фильтров: можно было выбрать цвет кожи, волос, расу.

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

Каталог фотографий с фильтрами / Generated Photos, 2022

Также начали добавлять функции, которые полезны непосредственно для компании-разработчика. Поскольку генерация лиц искусственным интеллектом — экспериментальная вещь, хотелось научить ее допускать меньше ошибок и неестественных фотографий. Самое дешевое решение, которое оказалось очень полезным: к каждой фотографии добавить лайк и дизлайк, чтобы пользователи оценивали, насколько хорошо сделано фото. Многие превратили это в некую игру, в которой «охотились» за плохо сгенерированными фотографиями и ставили им дизлайк. Нейронная сеть училась на таких оценках и постепенно становилась все лучше. 

Виджет оценки сгенерированной фотографии (справа) / Generated Photos, 2022

Может показаться, что добавлять такие вещи может только менеджер продукта, разработчик или аналитик, но хороший дизайнер делает это так же часто. Для него очень важно разобраться в аудитории и продукте, включить эмпатию и представить, как можно сделать лучше одновременно для заказчика и потребителя.

Использовать дизайн-систему, чтобы создавать продукт быстро и качественно. Если вы работаете в компании, у которой несколько продуктов и сервисов, отличным решением будет привести все дизайн-элементы к одному стилю. Это очевидная идея, однако ей не всегда уделяют достаточно внимания. Зачем пользователю каждый раз переучивать мозг, чтобы находить нужные элементы? А зачем дизайнеру каждый раз продумывать новые визуальные UX-решения? Можно их унифицировать, чтобы клиент всегда знал, чего ожидать, начиная пользоваться другим сервисом компании. На Западе у этого есть емкий термин из психологии восприятия — affordance, что значит «ожидаемое назначение». 

Унифицированные навигация, поиск, управление аккаунтом и фильтры / Icons, Ouch, Moose (by Icons8), 2022

Это сокращает тот самый Time on Task, упрощает жизнь пользователю, поскольку ему легче переходить от одного сервиса к другому, а также помогает бизнесу запускать новые продукты быстрее, минуя длительный этап разработки с нуля.

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


Читать далее:

Создан квантовый компьютер, который «вышел за пределы двоичной системы»

Сверхзвуковой самолет будет летать со скоростью 2 000 км/ч и пересечет океан за 3,5 часа

Появилась новая убедительная теория, почему разрушилась цивилизация майя