Превращаем скучные задачи в увлекательную игру: дизайн интерфейса геймификации на примере Gemini 2

Gemini — это утилита для macOS, которая с помощью умного алгоритма помогает находить и удалять идентичные и похожие файлы, включая фотографии и аудио.

Утилита была создана компанией MacPaw, а ее последняя версия Gemini 2 в 2017 году получила престижную награду Red Dot Award в области пользовательских интерфейсов.

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

Для каждого пользователя ввели ранг, который бы соответствовал его опыту. Так, при удалении файлов пользователь стал получать не только дополнительное свободное место в памяти, но и награды за свои усилия. Все должно было происходить как в игре: прохождение новых уровней, достижения и азарт от побед.

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

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

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

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

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

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

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

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