Развитие команды через мини-хакатоны: опыт Noknok Digital

Привет! Я Женя Жуланова, дизайн-директор Noknok Digital. В этой статье поделюсь методом, который используем для развития команды.

Развитие команды через мини-хакатоны: опыт Noknok Digital

Мы проводим мини-хакатоны, на которых выполняем задания в течение 40-60 минут. Какие-то из них мы проводим в эфире в телеграм-канала, и периодически собираемся сами или с командами клиентов.

Задачи бывают разными: от создания концепций AR-приложений до дизайна плакатов для случайных мест на Google Street View. На последнем хакатоне взяли интерфейсную задачу и провели эфир вместе с дизайнером интерфейсов Лёшей Белик.

Задача

В Telegram-каналах с интерфейсными фичами публиковалась визуализация вкусов в приложении Simple Wine. Решение показалось интересным и дискуссионным. У нас появились вопросы: как будут смотреться визуализации вкусов чернозема или нефти? Или как делать их для большого количества наименований в каталоге? Мы хотели погрузиться в тему, разобрать плюсы и минусы и набросать свои варианты.

Развитие команды через мини-хакатоны: опыт Noknok Digital

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

  • Заранее исследовать тему;
  • Разобрать плюсы и минусы реализации;
  • На мини-хакатоне сделать свои варианты визуализации.

Исследование

Согласно исследованию, предпочтения дизайнеров сильно отличаются от пользовательских, поэтому важно проводить ресерч и синхронизироваться с реальностью. Для этого мы подготовили вопросы для экспертов и пользователей. Было предположение, что экспертом не нужны визуализации и чтобы проверить гипотезу, подготовили 3 вопроса и попросили ответить на них людей профессионально занимающихся вином.

Вопросы:

1. Какая информация для вас самая важная при выборе вина в приложении? На что обращаете внимание в первую очередь?

2. Что вы можете сказать по поводу визуализации «вкусов» вина в карточке товара? Насколько такая визуализация понятна и эстетична для вас?

3. Как вы оцениваете полноту информации, представленную на карточке? Хотели бы вы видеть больше информации или ее наоборот слишком много? Чего не хватает или что является лишним, на ваш взгляд?

Развитие команды через мини-хакатоны: опыт Noknok Digital

Несколько человек откликнулись на наш запрос и прислали развернутые ответы:

Я могу ответить на эти вопросы с профессиональной точки зрения и с точки зрения потребителя.

1) про внимание.

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

Как любитель, я обращаю внимание на цену, потом на этикетку, и если они меня увлекли, то сканирую этикетку в вивино, и смотрю, что пишут люди.

2) про визуализацию

Как профессионал, я это обычно воспринимаю, как белый шум. Раньше обращал больше внимания на это, но сейчас стараюсь ориентироваться на собственные дескрипторы.

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

3) про информацию

С профессиональной точки зрения важны тактико-технические характеристики, типа % алкоголя, срока выдержки, типа ёмкостей, особенностей виноградника и т.д. Иногда этого в достатке, иногда немного не хватает, но чаще нужную инфу не приходится гуглить дополнительно.

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

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

Анатолий Лобачев
Cомелье

1. Боюсь, что тут мой ответ будет не самый релевантный для исследования, так как я, как правило, уже четко знаю, что мне надо: сорт, страна, производитель. Ну это профдеформация.

Поэтому я смотрю на цену и на наличие/ в какой винотеке могу забрать если мне срочно прям понадобилось именно это вино.

2. Мне очень нравится, мне кажется так намного нагляднее, чем просто иконками или текстом. И хорошо, что подписали ибо мускус - не самая очевидная штука. А так я уже представляю как пью эту малинку в бокале)

3. Мне нравится, как представлена информация, мне все понятно и всего хватает) Но опять таки я хорошо знаю это вино, мне в целом про него все понятно.

Возможно, не хватает описания простого вина: легкое/плотное, какая кислотность, на что похоже, с чем пить (еда). Но там дальше у симпла хорошо это развернуто. Даже и не знаю, что и добавить.
Мария
Taste&Talk

Наша гипотеза подтвердилась. Эксперты смотрят совсем на другие параметры. Эти ответы показали нам, что нужно сосредоточиться на обычных покупателях, для которых визуализация может действительно оказаться полезной. Хотелось узнать, как они в целом оценивают визуализацию и как отнесутся к «несъедобным» объектам в бокале.

Для опросов мы используем pthwy — очень простой и быстрый способ провести исследования.

В закладки: сервис публикует обучающие материалы, например гайд по немодерируемым исследованиям

Опрос показал, что в целом визуализации находят симпатичными. Несколько человек заметили, что наличие камня выглядит странно:

  • «Инфографика удобная, но вот "мокрый камень" для неспециалиста (коих большинство) звучит странно»
  • «я не понимаю что за мокрый камень , это очень сбивает , если другие вкусы более менее понятны то не понятно что за камень»

Были интересные комментарии по поводу информативности визуализации:

  • «Состав букета для меня было бы удобнее видеть в виде столбца в порядке от наиболее яркой ноты к менее яркой»

Полный отчет:

Плюсы минусы решения

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

Минусы:

  • Создание коллажей — это длительный процесс. На большом количестве товаров потребуется много времени для их создания;
  • Визуализации с «несъедобными» объектами могут негативно повлиять на выбор;
  • Нет ощущения, что предметы действительно лежат в бокале;
  • Недостаточно информативно.

Плюсы:

  • Яркая картинка нравится пользователям;
  • Обогащение информации о продукте.

Решения

Просмотр опросов, комментариев специалистов и обсуждение плюсов и минусов заняло у нас около 15 минут. Для себя мы поставили задачу придумать решение, которое:

  • Легко масштабируется на большой каталог продукции;
  • Сохраняет яркое визуальное решение;
  • Более информативное, чем исходное.

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

К нам с Лёшей в Figma присоединились другие дизайнеры и мы за оставшееся время сделали несколько решений:

Вариант с коллажем по слоям<br />
Вариант с коллажем по слоям

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

Без визуализации бокала
Без визуализации бокала

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

Если инфографика для вас неудобна, то что бы вы изменили в ней?

  • «Оставил содержимое без бокала»
  • «Может бы добавил на всякий случай описание ингредиентов»

На что в карточке вы обратили внимание в первую очередь? Что успели запомнить?

  • «На бокал в котором ассортимент ягод и трав из него сделано вино»
Градиенты и фотки
Градиенты и фотки

Был интересный экспериментальный вариант с градиентами и подробными описаниями вкусов.

Иллюстрация с круговой диаграммой
Иллюстрация с круговой диаграммой

Часто кто-то находит классные референсы, которые потом забирают и другие. Один из участников нашел интересный референс, который можно адаптировать под эту задачу и вписать в айдентику Simple Wine.

Выводы

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

1010
1 комментарий

Я человек простой. Вижу годный лонгрид - ставлю лайк

2