Как я делал редизайн загрузчика для поиска по фото в Яндекс.Картинках

В 2020 году я был мидлом, работал в Алисе и Поиске. Опыт и навыки в продуктовом дизайне у меня только формировались

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

Поиск по фото — это когда можно загрузить фото в Яндекс и увидеть, где купить те крутые кроссы, как у чувака из метро, сумку или кота. Окно для загрузки фото морально устарело и отстало от стилей Яндекса. Мы хотели обновить UI и увеличить количество загрузок изображений

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

Вот мой топ-3, чему я тогда научился благодаря этому редизайну

1. За маленьким окошком — много кода
В загрузчике устарел не только UI, но и код. Уверен, о том как наш разработчик переписывал код, можно написать целую статью на хабре. Для меня это было неожиданно и неочевидно, как интерфейс работает под капотом и что об этом тоже нужно подумать заранее — чтобы точнее оценить сколько времени уйдет на дизайн. И как можно меньше делать в стол

2. Важно посмотреть как у других
Если у конкурентов есть похожие интерфейсы — наверняка пользователи уже привыкли пользоваться ими. Анализ конкурентов поможет понять сильные и слабые стороны уже сделанных интерфейсов. Хорошее нужно сохранить, а непонятное — улучшить. Так я добавил в загрузчик кнопку «Вставить из буфера», чтобы можно было скопировать картинку правой кнопкой мыши и вставить уже в браузере, а не тащить иконку изображения через весь рабочий стол. Такой кнопки до сих пор нет ни у одного из поисковиков

3. Даже 4 пикселя имеют значение
Когда делал эту задачу, на себе испытал насколько чувствительными к мелочам могут быть многомиллионные продукты. Отступы между объектами в 12 пикселей вместо 8 могут напрямую влиять на то, как пользоватлели будет использовать интерфейс

Что в итоге
Цифры — за 2020 год. После релиза нового загрузчика количество пользователей поиска по фото увеличилось на 13%, а люди стали искать по фото чаще на 4%. В опросах 95% пользователей проголосовали за новый UI, а за счет нового кода скорость загрузки увеличилась в 10 раз. В масштабах аудитории Яндекс.Картинок, эти цифры — колоссальные

Редизайн сделали втроем — менеджер, разработчик и я в роли дизайнера. Заменеджерила наш проект Лена Бондарь. Сейчас Лена руководит созданием умной камеры — теперь это уже огромная команда. Рекомендую посмотреть видео, в котором Лена рассказала как работает компьютерное зрение и нейросети

Подробности с дизайнами загрузчика, фигмой и картинками — на закрепленном видео в этом сообщении