Решения сильных дизайнеров
Посмотрим на три правила взрослых решений в дизайне интерфейсов
Все принимают решения. Маша-дизайнер думает, в какой цвет покрасить кнопку, Вася-менеджер выбирает, кому лучше отдать задачу, а Игорь-разработчик сомневается: $received_data или $receivedData?
Люди редко рефлексируют над своими решениями и чувствами: почему они поступили так, на что их решения повлияли и как стать лучше в долгосрочной перспективе. Надеюсь, эта статья поможет взглянуть на ежедневные задачи чуть глубже.
Мы посмотрим на три ситуации, а потом проанализируем ошибки и попробуем придумать решения.
Вот Маша, она рисует интерфейсы. Вся ее работа состоит из решений:
- выбор UI-паттернов,
- цветовых палитр,
- альтернативных сценариев,
- альтернативных компонентов,
- ё или е,
- …
В общем, повсюду Машу ждет выбор между разными вариантами, а она с помощью каких-то суперспособностей вроде опыта и исследований решает какой из вариантов выбрать.
Баланс
Компания, в которой работает Маша состоит в основном из программистов. То есть это такая софтверная компания, где рулит разработка и код. Маша здесь работает давно и уже прониклась всеми премудростями: то девтулз откроет, чтобы на ходу поправить что-то на сайте, то библиотеку найдет, чтобы не писать с нуля какую-то функцию.
Маша знает, что разрабатывать интерфейсы сложно, а менеджеры всегда нападают со сроками, поэтому она заранее планирует интерфейс под разработку.
Появилась задача — сделать экран в приложении, который расскажет, что контент станет доступен через определенное время.
Маша в курсе всей программистской кухни, поэтому сразу прикидывает, как можно упростить интерфейс. «Не буду использовать таймер. Лучше напишу, что контент обновляется раз в день» — думает Маша и пилит интерфейс.
Макеты уходят в разработку, ребята рады: не нужно прикручивать базу ради поганого таймера, а «юзерам» и так понятно будет. Обновление уходит в релиз.
Через какое-то время команда видит статистику: с экрана отваливаются пользователи и забрасывают приложение, потому что не понимают, когда появится контент. «Блин, надо было делать таймер».
Обычно в команде при работе над продуктом у всех разные цели. В общем-то все хотят завершить проект, двигаются в одном направлении, но вот решения принимают по-разному.
Дизайнеры работают в роли «адвокатов для пользователей»: защищают их интересы, думают об их целях и привычках и генерируют кучу задач для разработчиков.
Разработчикам обычно не очень интересно что там с пользователями, а вот как эту фичу запрограммировать — важно. Поэтому они скорее склоняются к более простым, «дешевым» решениям, чтобы не усложнять код. У разработчиков часто возникают конфликты с дизайнерами.
Менеджерам важно делать задачи и запускать продукты. Они пытаются подружить дизайнеров и разработчиков, чтобы они уже успокоились и что-то запилили.
Дизайнеру супер-важно балансировать: думать про пользователей, находить компромиссы с разработчиками и приносить пользу бизнесу. Тогда он будет машиной по производству счастья.
Но бывает так, что дизайнер смирился с халатностью и оптимизациями задач и поплыл по течению: никакой заботы о пользователях, а в голове готовый барьер «это слишком дорого». Цену задачам знать полезно, но отсекать все подряд — неправильно.
Нет:
Сразу фильтрую «дорогие» по моему мнению решения, потому что их не сделают.Да:
Сначала думаю, как эти решения могут быть полезны пользователям и бизнесу, потом доказываю пользу команде, а потом оптимизирую.
Короче, ⚖️ балансируйте.
Категоричность
Маша принимается за другую задачу. Теперь нужно нарисовать сложный фильтр для данных в мобильном приложении. Маша решает втиснуть все это в модальное окно.
Разработчики сокрушаются: модальное окно получается сложным, в нем много элементов и это дороговато, но Маша стоит на своем: «в модальном окне сохраняется текущий контекст, пользователю так удобнее». Ребята ни к чему не приходят.
Через какое-то время клиент просит добавить еще фильтров. Маша лезет в модалку и растягивает ее. Приходится делать скроллируемую модалку и рисовать несколько состояний.
Маша опять показывает разработчикам модальное окно, но у них стало только больше неудобных вопросов:
- «Как будет выглядеть клавиатура?»
- «А если у пользователя маленький экран?»
- «Сколько данных поместится, если откроется клавиатура и у пользователя будет маленький экран?»
Маша была категорична и стояла на своем: она уже отрисовала модальное окно, это «контекст» и все такое, а разработчики просто ленятся.
На спор команды приходит арт-директор и говорит: «Маша, может быть сделать отдельный экран для фильтра? Все равно длинные модальные окна будут работать как отдельные экраны и закрывать контент под ними, а так нам это сэкономит время на разработку и граничные случаи.»
Маша прислушивается к словам арт-директора и рисует отдельный экран: получилось проще как ей, так и разработчикам. А пользователям от этого хуже не станет.
Начинающие дизайнеры быстро принимают решения и неохотно от них отказываются: «делаем модальное окно и точка». Хотя рядом могут лежать более дешевые или удобные решения, которые так же хорошо сработают для пользователя.
Категоризм дизайнера тормозит итерационный процесс. Всегда есть решение лучше, поэтому нужно смотреть на все варианты.
Нет:
Выбираю понравившийся паттерн, потому что его легче нарисовать и у него меньше состояний.Да:
Сначала думаю, как этот паттерн будет работать, пробую разные варианты, показываю команде и получаю фидбек. Потом отбрасываю лишнее и выбираю.
Будьте 🧐 менее категоричными.
Осознанность
Менеджер Вася дал задачу Маше: нарисовать лендос для их нового продукта, который будет пиариться на конференции.
Маша принялась за работу: накидала структуру, сделала классический хиро в шапке, карусель со скриншотами, этаж с фичами, показала форму для заявки и даже про копирайт не забыла. В общем — все по учебнику.
Через несколько итераций макет был утвержден и нужно было готовить его к разработке. Маша сжала макет для планшетов, начала сжимать для телефонов и… не влезло. Она попробовала все втиснуть на одну страницу, но получилась очень длинная простыня. Тогда она выкинула ненужные элементы вроде списка фич, скриншотов и логотипов платформ. Получилось лаконично: хиро, краткий список фич и форма.
Разработчиков такие макеты устроили: меньше думать как ужимать на маленьких экранах элементы, а менеджер Вася был доволен более быстрым запуском проекта: «Как раз успеем к конференции!».
На конференции команда маркетологов упорно пиарила новый продукт случайным участникам конфы. Участники открывали сайт на своих телефонах и видели… три абзаца текста и форму для заявки. По сути, от лендинга осталось 20%, которые смогли увидеть пользователи. Это был провал.
Маша забыла, что она готовит лендинг для конференции и сайт должен хорошо работать именно там, а значит мобильная версия точно должна главенствовать над настольной, потому что у прохожих вряд ли будут ноутбуки.
Маша в этой истории не подумала о задаче: нужно не просто нарисовать лендос, а сделать так, чтобы он помог людям на конференции узнать о продукте и оставить заявку.
Большую часть решений на работе мы принимаем неосознанно: сразу понятно, в какой цвет красить кнопку, верно? Только если задача оказывается незнакомой или очевидно сложной, мы подключаем сознание и в реальном времени пытаемся придумать решение.
Не всегда наше подсознание выдает по-настоящему правильный ответ. Обычно это удобное решение, к которому мы привыкли или которое легко воспроизвести.
Хорошее упражнение — попробовать проследить от начала задачи до решения (понимание, гипотезы, переход от житейских проблем к абстракциям интерфейса, экраны, прототипы, чистовой дизайн). Подумать, почему выбираются те или иные размеры, цвета, компоненты, паттерны и так далее.
«Автопилот» в решениях не всегда работает, потому что он выдает удобные и простые решения, которые редко бывают оптимальными.
Нет:
Плыву по течению и реализую то, что только что пришло в голову.Да:
Думаю, как проблема стоит за задачей, что может сработать, а что нет, как повлияет мое решение на бизнес и пользователей.
Читайте статью Даши Почекуевой:
В общем, 🌀 зрите в корень задачи.
Что нужно запомнить
- ⚖️ Балансируйте между целями пользователей, бизнеса и возможностями разработчиков.
- 🧐 Не будьте категоричными: люди иррациональны, не всегда синий цвет будет цветом денег.
- 🌀 Осознавайте свои решения: почему надо сделать так, на что это повлияет в перспективе, какие будут проблемы у решения.
Мой телеграм-канал, где я делюсь мыслями про работу, дизайн, и продуктивность: Task → Solution.
