Как прокачивать насмотренность в UX для дизайнера интерфейсов (личный опыт)
Хочу поделиться своим опытом и рассказать, как я прокачиваю насмотренность в ux (не ui). Надеюсь, это кому-нибудь поможет)
Вопросы
Представим, что, мне нужно нарисовать экран авторизации. Хороших, красивых, современных референсов много. Но как понять, что тот или иной референс не только красивый, но и юзер-френдли? По скриншотам — непонятно.
В связи с этим возникают вопросы:
— Если мы с помощью насмотренности качаем ui, как с ее помощью качать ux?
— Алгоритм анализа ux такой же, как и для ui?
— Где находить ux-референсы?
— Где и в каком формате хранить понравившееся, чтобы быстро вернуться к этому решению?
Поиск решения
Из миллиона вариантов, которые я получил, больше всего «зашел» поиск лучших практик на «живых» продуктах:
— Каждый день ищу лучшие решения (элементы интерфейса или флоу). Считаю, что даже в самом простом элементе может быть заложена сложная логика.
— Как «горит» ищу референсы под определенную задачу. Нужен календарь (и его нет в сохраненных рефах) — ищу!
— Стараюсь следить за новыми продуктами — сохраняю и анализирую.
Где и как ищу
Уже есть ресурсы, где можно найти нужный юикс:
— pageflows. com;
— pttrns. com;
— uxarchive.com;
— mobbin.com.
Но лично мне такой способ не зашел по двум причинам:
1) В основном там только скрины флоу (как говорил ранее, по скрину мне непонятно взаимодействие);
2) Я заметил, что лучше анализирую и запоминаю, когда ищу сам, а не получаю готовое.
Чтобы каждый раз не вспоминать продукт, флоу или элемент, я создал таблицу. Она помогает не забыть, какой дорогой иду. Продукты — по вертикали, флоу и элементы — по горизонтали.
Как анализирую
1) Перебираю текущие решения. Например, «смена города». Затем иду вниз по списку сайтов. Стараюсь не обращать внимание на ui, бренд или продукт;
2) Оставляю лучшие решения и разбираю их;
3) Испытываю флоу/элемент разными сценариями и каждый раз задаю вопросы:
- Что тут крутого и почему?
Как это можно докрутить? - Что тут не очень хорошо и почему?
Как это можно улучшить?
Сохраняю видео
— Очень важно видеть анимацию, переход, состояния элементов и ответ системы. На «скринах» этого не понять;
— На видео лучше видны моменты, которые можно «докрутить». Ведь я прохожу не только идеальный путь, но и испытываю разные сценарии.
Но скриншоты я ставлю на обложку видео. Это помогает быстро «пробегаться». Нужны детали — тыкаю play (Андрей, спасибо за совет!).
Где храню
В телеграм-канале:
— Удобно фильтровать (по хештегам);
— Самый быстрый и дешевый способ для старта и поддержки (особенно под видеоформат);
— Всегда под рукой.
Завершение
Поиск, анализ и отбор референса — «грязная работа», которую за вас делают сторонние хранилища (и я тоже). Но это самый важный этап!
Эти хранилища могут выручить, когда прямо сейчас «горит». Но как постоянную тренировку я выбираю для себя (и рекомендую) «грязную работу».
Пожалуйста, поделитесь в комментариях своими способами «прокачки» в ux и продуктами из личного ux-топа. Также делитесь идеями, как можно улучшить мои рекомендации.
Спасибо!)
Телеграм-канал с референсами — @ux_ref