Привет, я Вероника — старший продуктовый дизайнер в Плитках. Сегодня хочу рассказать, как искать референсы и не утонуть в красивых картинках. Поиск референсов кажется одной из самых приятных частей работы дизайнера: открыл Dribbble или Behance — и можно часами листать красивые интерфейсы. Но красивый экран ещё не значит хороший референс. Если искать без понятного сценария, легко собрать десятки картинок, которые потом никак не помогают в работе.

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

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

То есть сначала формулируем вопрос, на который хотим ответить с помощью референсов. Ищем не экраны, а паттерны. Вместо «поищу красивые карточки товаров» лучше спросить: Как другие продукты показывают ключевые различия между похожими вариантами? Так поиск становится гораздо точнее.

Ищем не только у конкурентов. Если мы проектируем e-commerce, логично смотреть на другие магазины. Но так легко получить десять вариаций одного и того же решения. Гораздо интереснее искать по задаче, а не по индустрии. Нужно помочь выбрать один вариант из множества? Можно посмотреть на Airbnb, Spotify, карты, сервисы бронирования или даже игры. Проектируем поиск? Смотрим не только магазины, но и карты, библиотеки, медиасервисы. Делаем onboarding? Полезны финтех, игры, образование. Нам важен не сам экран, а способ решения пользовательской задачи.

Где искать? Page Flows — целые пользовательские сценарии: покупка, регистрация, отмена заказа и другие flows. Бесплатно можно посмотреть несколько экранов каждого приложения, есть трёхдневный пробный период за $2.95.

UXArchive — много примеров конкретных сценариев: поиск, бронирование, регистрация, редактирование. Есть бесплатый план, но с ограничениями.

Mobbin — удобно искать решения по продуктовым категориям и смотреть реальные продукты. Есть бесплатный план. В нём ограничены: количество просмотров приложений в день, число сохранений, доступ к коллекциям (до 3 шт.), фильтрация.

Плюс реальные продукты, Dribbble, Behance и обычный поиск.

Как понять, что референс хороший? Не спрашивать только «красиво ли?». Лучше посмотреть: — какую проблему здесь решают; — почему решение устроено именно так; — что пользователь должен понять; — какие здесь есть ограничения и компромиссы; — работает ли это в нашем сценарии. И я бы не останавливалась на одном варианте. Полезно собрать 3–5 разных решений и сравнить их. Так появляется понимание паттерна, а не коллекция скриншотов.

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

Привет, я Вероника — старший продуктовый дизайнер в Плитках. Сегодня хочу рассказать, как искать референсы и не утонуть в красивых картинках | Сетка — социальная сеть от hh.ru