8 Апр 2021

Дизайн приложения для Деда Мороза

Заказчик
Компания продает индивидуальные поздравления от Деда Мороза
Задача
Разработать дизайн приложения с раздельными интерфейсам для взрослых и детей

Белая борода, мешок подарков и мобильное приложение

Дед Мороз старый, но вовсе не отсталый. Откуда мы это знаем? А мы помогали ему сделать мобильное приложение для видеопоздравлений. Сайт, между прочим, у него уже есть.

Сам Дед Мороз классный — детям нравится (и вообще, вы посмотрите на эту бороду!) И поздравления настолько хороши, что дети их даже летом пересматривают. Дед и по имени ребенка назовет, и за школьные и прочие успехи похвалит, и куча всего еще.

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

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

Из пожеланий клиента: новогоднее настроение круглый год

Как мы интерфейс для дедушки рисовали

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

Так мы могли показывать заказчику не отдельные картинки, а целые сценарии в действии.

Начало сценария «Создать поздравление»

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

Ищем визуальное решение

Предложили заказчику несколько дизайн-концептов, он выбрал один. Доработали концепт, начали детализировать интерфейс и делать прототип.

Уточняем визуальное решение

И вот что получилось. Интерфейс для родителей

Основной родительский сценарий — создать поздравление в конструкторе.

Если это первое поздравление, нужно заполнить анкету ребенка. Выбрать имя из списка или добавить новое, если нужного нет. Если пол не очевиден по имени — уточнить. Если указать день рождения, Дед Мороз потом сможет поздравить ребенка еще и с ним.

Анкета ребенка

В анкете — постоянная информация о ребенке. Конкретное поздравление можно детализировать еще сильнее.

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

Можно добавить детали, которые сделают подарок личным

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

Подарок готов, можно дарить

Что еще может понадобиться родителям от этого интерфейса? Выбрать поздравление в магазине. Подарить поздравление ребенку друзей. Удалить или восстановить видео.

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

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

Нужен отдельный детский интерфейс.

И вот что получилось. Интерфейс для детей

Плохой детский интерфейс — как фальшивая елочная игрушка. Разобраться-то в нем ребенок разберется, но радости никакой.

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

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

Навигация — настолько простая, насколько это вообще возможно. У нас вот — только кнопки «Вперед» и «Назад» и свайп.

Еще, кстати, дети держат телефоны не так, как взрослые.

Вот так. И надо убедиться, что до любого контрола при этом легко дотянуться

В первом релизе детский режим реализовать не успели. Но дизайн интерфейса для него мы уже сделали.

Детский интерфейс. Главный экран и онбординг

В детском режиме — личная комната ребенка.

В комнате ребенка хранятся поздравления. Детям нравится их пересматривать даже летом.

Детский интерфейс. Комната ребенка, в которой хранятся видеопоздравления

Что за маленькая неинтересная кнопка в верхнем углу? А это для взрослых — переход в родительский интерфейс.

Погодите, это еще все

Мы передали этот проект в разработку, но до самого запуска будем продолжать авторское сопровождение.

К примеру, нужен дизайн страниц приложения в AppStore и GooglePlay — рисуем дизайн страниц.

Страница приложения в AppStore

Или заказчик предлагает скорректировать логику интерфейса: убрать регистрацию «по умолчанию». Разумно — люди не любят регистрироваться без особой на то причины.

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

Реализуем новую логику в дизайне, корректируем макеты — и так пока приложение не выйдет.

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

Смысл

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

Перейти на сайт

В карточку агентства
Пользуйтесь реальным опытом в IT и следите за успехами потенциальных подрядчиков и конкурентов

Кейсы по этой теме

Не трать деньги на ошибки —
используй чужой опыт

Разработка и продвижение сайтов, SEO, SMM, брендинг и многое другое – вооружайтесь свежими IT — решениями из рассылки кейсов Рейтинга Рунета

Подписаться на кейсы