// //
интервью

«Продукты надо делать с душой»: дизайнеры MacPaw о создании программы Gemini 2

17 ноября, 2017
avatar
Катя Павлевич
Редактор в Telegraf.design
Мы любим тексты без ошибок. Если вы все же их обнаружили, выделите фрагмент и нажмите Ctrl+Enter.

27 октября Gemini 2 — программа украинской IT-компании MacPaw — получила Red Dot Award в категории Communication Design. Это первая награда за лучший дизайн интерфейса на Red Dot среди продуктов, разработанных исключительно для macOS. Мы решили пообщаться с арт-директором и продуктовым дизайнером Gemini 2 Дмитрием Новиковым, а также иллюстратором и графическим дизайнером, Александром Агеевым, о процессе создания программы, особенностях продуктового дизайна в MacPaw и, собственно, о самом конкурсе.


Расскажите пару слов о продукте — Gemini 2.

Дима: это программа для поиска дубликатов на Маке. Она освобождает место и упорядочивает старые забытые документы, указывает, где они продублированы на компьютере. Очень простая задача. Наша программа играючи изящно с ней справляется.

Играючи? Это значит вы элемент геймефикации туда ввели?

Да, и не только. Эта программа — системная утилита. Но она воспринимается, скорей, как развлечение. Ты просто играешься, а за удаление лишних файлов получаешь награды. Их, кстати, рисовал Саша.

Александр Агеев, иллюстратор

Насколько дизайн отдел вовлечен в создание продукта?

Вообще во всех продуктах дизайн является одним из ключевых факторов. Мы ориентируемся на такие компании, как Apple, Bang&Olufsen, старый Braun, где дизайн определял, как продукт работает и воспринимается.

Чаще всего, до того, как продукт отдан в разработку, у нас есть некий финальный вид дизайна. Чтобы разработчики тоже имели представление не только о том, как продукт будет выглядеть, но и как он будет ощущаться, какая за ним история, атмосфера.

Чаще всего на 1 продукт выделяется 1 продуктовый дизайнер. Он не занимается рисованием, а завязан на проектировании. Продумывает подачу продукта с точки зрения бизнеса, пытается понять, как юзер должен воспринимать программу. И сам же это потом отрисовывает. В случае с Gemini 2, я еще и звуки делал.

Дмитрий Новиков, арт-директор, продакт дизайнер

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

Почему именно вы занимались саунд дизайном?

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

Сколько дизайнеров было вовлечено в создание Gemini 2?

Мы стараемся максимально делать все сами. Звуки, иллюстрации, фото. Вот даже на интро моя фотография моста. Единственное, что шрифты пока сами не разрабатываем, приходится покупать.

Если брать дизайн продукта в широком смысле, то, наверное, вся команда была над ним сосредоточена. Всем важно, чтобы программа работала плавно, быстро. Чтобы весь workflow – от скачивания до покупки и последующих запусков — был понятный и прозрачный. Для этого, помимо основной команды (приблизительно 10 человек), привлекались отдельно люди в компании, которые давали фидбек. Многие сотрудники, которые напрямую не связаны с продуктом, были заинтересованы в его развитии. Нам важно, чтобы программа ощущались, как продукт MacPaw Иначе с ней что-то не так.

Продукты должны быть с душой. Люди все понимают и хотят быть частью этого. Круто.

С командой — хорошо. А как насчет тестирования на пользователях?

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

И какой-то фидбек повлиял на продукт?

Конечно. Сначала у нас была 1-я версия, которая сильно повлияла на индустрию системных утилит в принципе. До этого все утилиты просто убивали любой эстетический вкус и угрожали потерей данных. И никакие wallpaper с красивой девушкой или шикарным пейзажем не могли это скрыть, потому что внутри все оставалось непонятным.

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

И если ты пришел к классному решению, начинай думать, а можно ли пойти еще дальше.

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

Юзеры к этому относятся подозрительно и начинают мыслить категориями «Найду ли я здесь косяки?». С таким отношением всегда можно найти что-то. Результаты таких тестов можно послушать, но не всегда прислушиваться. А вот в саппорт обращаются непосредственные пользователи. Либо те, кто очень благодарен (единицы), либо те, кто совсем недоволен. Здесь тоже все мнения за чистую монету принимать не стоит. Нужно брать соотношение купленного продукта к отзывам: если продано значительно больше, чем пришло фидбека, значит все хорошо.

Иногда пользователь может быть недовольным. Но, возможно, то, что ему не нравится, и продает ему продукт?

А какие тогда критерии к фидбеку, который принимается во внимание?

Есть категория ощущений как: «Наверное, мы где-то здесь лажу сделали. Может, ее не заметят? Тебе не кажется это решение странным?». И когда люди подтверждают эти сомнения, мы исправляемся.

Работа с интерфейсами — это сложный моральный выбор. И он никогда не будет правильным.

У каждого есть позитивные и негативные стороны. Как правило, негативных гораздо больше. Например: grid view в папке, когда ты видишь фотографии крупными, и list view, когда они идут списком. В первом случае на странице мало фотографий, но они больше, в другом – их много, но в малом размере. Хороший выбор зависит от твоих потребностей.

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

Да. Если ты делаешь интерфейсы под Mac и iPhone, желательно делать решения вместо юзера, как это делают Apple.

К каким же решениям вы пришли?

Мы перевернули все с ног на голову. И сделали интерфейс в виде … Ничего. Там ничего нет. Надо просто добавить папку.

В первой версии еще была волшебная палочка, ты ее клацаешь и все — программа дальше все понимает.

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

Вордингом занимались копирайтеры или дизайнеры?

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

Мы стараемся вокруг программы создать особенную атмосферу, будто она создавалась не для Mac’ов, а как реальная вещь.

В первой версии мы обратились к идее ретрофутуризма: как бы сделали программу в 60-х годах, если бы думали, как бы программа выглядела в будущем, то есть сегодня? Звучит запутанно, но мы визуализировали. В 60-х. проходила космическая гонка между странами, снимались фильмы типа «Одиссея 2001». Что самое важное, Америка в это время запустила космическую программу Gemini. Так интегрировалась идея с космосом.

Откуда идея с яйцами.

Нам нужно было обозначить как-то дубликаты файлов. Были идеи о штурмовиках, ведь это были 60-е года. Но мы поняли, что если дубликаты будут символизировать какие-то живые существа, то убивать их (удалять файлы) пользователю будет стремно. У нас есть конкурент, который использует двух близнецов. Что это? Зачем? Ты смотришь на этих близнецов, их разлучать не хочется, а здесь убивать. Потом думали, использовать капли с отсылкой на «Две капли воды», но не смогли с космосом связать идею. Я вспомнил, что в 60-х годах был снят фильм «Чужой». Мы нарисовали космические яйца, стальные. Привязали немного тематику фильма «Трон», добавили светящиеся эффекты. Подумали, что яйца уничтожать никому не жалко. Разбил-съел-доволен. Я лично рассчитывал на некую инфантильность пользователя, которые над яйцами будут смущенно хихикать. Мы даже ролик делали, как прилетает невидимая космическая тарелка, забирает яйца эти.

А могли ведь просто 2 файла показать, как все и делают.

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

В секции “About”  мы всегда пишем, что продукт сделан в Украине. Еще есть пасхалка, где мы вписываем благодарность всей команде, а в конце добавляем имя пользователя с сердечком. Тоже внимание.

 Почему стали делать вторую версию?

Первая получилась революционная. Мы сами того не ожидали. Но быстро нагенерировалась тьма клонов. Вдруг все поняли «Ой, а так можно было?» и бросились копировать.

Кажется, что это решение очевидное: велосипед должен выглядеть так, машина — так, программа – так. Но до тебя кто-то проделал огромную инженерную работу и придумал этот велосипед. Казалось бы, молния для одежды. Что тут думать? Но на ее разработку ушло около 15 лет. Сейчас кажется, что она всегда такой была.

Так же получилось с Gemini. Идея оказалась простой и понятной, все на нее набросились. Начали копировать и продавать дешевле.

На момент запуска второй версии мы насчитали 280 дубликатов Gemini 1.

В предыдущей версии мы удаляли дубликаты файлов. Казалось бы, что еще можно сделать: программа есть, она работает. Единственная проблема — конкуренты, которые демпингуют цены. Мы решили, что надо save more space — сделать удаление похожих файлов. Например, 100 млн. фотографий одного заката. Зачем они тебе? Мы можем их определить и выкосить ненужные. И если дубликаты удаляли 20% мусора из 100%, то с помощью удаления похожих файлов мы перепрыгнули рынок, привнесли value в продукт, и люди стали упорядочивать свое рабочее место.

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

Я подумал, что от ретрофутуризма надо отходить и уйти в будущее. Мне пришло в голову, что в будущем все будут заморачиваться над новыми материалами, для костюмов и технологий, которые помогут улететь с Илоном на Марс. Поэтому для интерфейса мы сделали «материал», состоящий из дубликатов — много концентрических кругов. Звучит замудрено, люди этого не понимают, зато чувствуют, что здесь вот ребята заморочились. Я придумываю любой фишке историю, по которой едва ли не фильм можно снять.

Можно сказать, что вы используете сторителлинг для дизайна?

Это больше мудборд, создание настроения вокруг продукта. Ощущения, будто продукт привезли из будущего.

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

Яйца теперь сделали разного цвета. Но это уже отдельная история.

Плюс мы подумали было бы хорошо замотивировать людей больше чистить и рассказывать об этом в соцсетях. Но просто попросить затвитить то, как ты удалил свои порнофайлы, неинтересно. Но программа наша выглядит fancy, с юмором. На сообщения у нас иногда вываливается вот такое эмодзи🖖🏻  или «Дай пять, бро» в App Store. И мы решили интегрировать геймефикацию.

Нам повезло с продакт менеджером, Алексеем Чирвой, который сейчас основал свой стартап. Он раньше работал дизайнером и доверял моим решениям. А в сырых прототипах видел потенциал. Он поддержал идею геймификации, которую мы внедрили через систему ачивок (от англ. achievement — достижение, прим. ред). Она сработала даже на таком продукте, как системная утилита, что обеспечило нам большой возврат пользователей. Люди просто развлекались удалением файлов, хотя обычно это рутинная скучная работа.

Концепт и реализация системы ачивок и наград.

У нас уже есть пользователи, который собрали весь комплект наград. И уже даже получили за это ачивку. Если ты ставишь другой наш продукт на Mac, тоже получаешь награду. Чтобы получить все, нужно приобрести все продукты. Но никто, естественно, тебя не заставляет этого делать.

Не опасались, что юзер будет бояться удалить что-то лишнее, ту самую драгоценную фотографию заката?

Мы сделали так, чтобы юзеру казалось, что у него есть выбор. Да, у него есть контроль: мы показываем все фотографии, какие-то можно оставить, другие убрать. Но правда в том, что юзер обычно просто одним кликом удаляет все. Без раздумий. У нас в этом вопросе достаточно экспертизы еще с работы над CleanMyMac. Пользователи особо не заморачиваются и просто все «грохают».

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

Сколько по времени длилась работа?

Около года. И это разработка из всего 2 концепций. Было много мыслей, как это должно выглядеть. Но мы должны были придумать все сами. Если подглядываешь на Dribbble и Behance, то возникает ощущение, что ты идешь в магазин, покупаешь пиццу из полуфабрикатов, а потом говоришь всем, что ты ее приготовил. На вкус она не очень. Ты ее не делал. Зато все произошло быстро.

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

Всегда надо придумывать, как сделать по-другому, иначе ты не двигаешь индустрию вперед.

Концепт, общий вид, подход к дизайну — это лично твои идеи, которые ты презентуешь команде?  Или у вас бывают брейн-шториминги?

Зависит от продукта. В случае с Gemini, это было практически полностью мое решение с корректировками от команды. В более крупных проектах идет подготовка концепта → фидбек → доработка → фидбек.  Как правило, концептом и разработкой идеи занимается 2 человека: продакт менеджер и дизайнер. Иногда подключаются маркетолог и копирайтер.

Бизнес составляющая в продуктовом дизайне имеет огромное значение. Есть такое понятие как качество. И у каждого свое понятие качества. Мой подход: делай продукт так, будто он стоит 1000 $. Юзер видит продукт, думает, что он дорогой. Потом понимает, что цена — всего 10$.  В будущем, даже если в продукте будут огрехи, у пользователя останется ощущение, что ему его подарили. Что за очень мало он получил очень много.

Какие инструменты использовали при разработке Gemini 2?

Мы первые, кто выпустил коммерческий продукт, полностью сделанный в Sketch. Sketch и Xcode. Для создания звуков — Logic. При создании первой версии еще брали Macromedia Flash для создания интерактивных прототипов. Сейчас я использую Origami и Principle для этого. Потихоньку пробуем Figma.

Почему подавались на Red Dot? Чья была инициатива?

Мы подаемся не первый раз. Идея моя. Мотивация простая: хотелось получить Red Dot.

Это субьективная оценка, но я обратил внимание, что все вещи, которыми я пользуюсь в быту – фотоаппарат, автомобиль, соковыжималка — так или иначе получали Red Dot. Я подумал, что у меня есть свои критерии касательно этой премии. Возможно, эстетика Red Dot мне очень близка.

Расскажите о церемонии награждения. Поездка оказалась полезной?

Я не ездил на церемонию, так как я не украинец и не могу просто сесть в самолет и улететь. Мне пришлось 2 недели ездить в визовый центр, где меня завалили документами. Я их принес позже. В итоге мне сказали, что за 2 дня мне никто ничего не сделает. Ребята съездили и забрали дипломы.

Представители MacPaw на церемонии награждения Red Dot Award 2017

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

Представители MacPaw на церемонии награждения Red Dot Award 2017 с основателем конкурса Петером Зеком.

Какой-то конкретный фидбек получили от жюри?

Дима: Конкретный, нет. Но пишут, что присуждают за инновацию и эталонное качество.

Саша: Мы основной акцент делаем на геймификацию. Стараемся развлечь пользователя и мотивируем к шерингу и продолжению процесса. Это было важным критерием.

Какие затруднения при разработке возникали?

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

 

Особая благодарность за содействие при подготовке материала Ксении Растворовой и Юлии Петрик. 

Изображения предоставлены MacPaw.

avatar
Катя Павлевич
Редактор в Telegraf.design
Колонка

У нас есть еще кое-что для вас

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: