Дизайн мобильного интерфейса и авторское сопровождение

У заказчика уже был сайт. К нам он пришел разработать приложение.

Помогли Деду Морозу запустить мобильное приложение с поздравлениями

Контекст

2019
~ 950 000 ₽

Бюджет

Результат

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

Дед Мороз старый, но вовсе не отсталый. Откуда мы это знаем? А мы помогали ему сделать мобильное приложение для видеопоздравлений. Сайт, между прочим, у него уже есть.
Сам Дед Мороз классный — детям нравится (и вообще, вы посмотрите на эту бороду!) И поздравления настолько хороши, что дети их даже летом пересматривают. Дед и по имени ребенка назовет, и за школьные и прочие успехи похвалит, и куча всего еще.
Чтобы сделать подарок настолько детальным, на сайте есть конструктор поздравлений. Родители заполняют подробную анкету, загружают фото с комментариями и т. д. — и получают ролик с поздравлениями, в котором все эти детали учтены. Даже в бесплатной демо-версии.
Интерфейс этого конструктора нам нужно было перенести на другую платформу — адаптировать для мобильного приложения. По крайней мере, с этого все началось.
Дизайн приложения для Деда Мороза | SobakaPav.ru
Из пожеланий клиента: новогоднее настроение круглый год

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

В первую очередь нужно продумать логику интерфейса. Мы начали с вайрфреймов, низкодетализированных монохромных картинок.
Так мы могли показывать заказчику не отдельные картинки, а целые сценарии в действии.
Концепт приложения для Деда Мороза
Начало сценария «Создать поздравление»
Продумав и утвердив логику интерфейса, мы занялись визуальными решениями.
Концепт приложения для Деда Мороза
Ищем визуальное решение
Предложили заказчику несколько дизайн-концептов, он выбрал один. Доработали концепт, начали детализировать интерфейс и делать прототип.
Концепт приложения для Деда Мороза
Уточняем визуальное решение

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

Основной родительский сценарий — создать поздравление в конструкторе.
Если это первое поздравление, нужно заполнить анкету ребенка. Выбрать имя из списка или добавить новое, если нужного нет. Если пол не очевиден по имени — уточнить. Если указать день рождения, Дед Мороз потом сможет поздравить ребенка еще и с ним.
Сценарий приложения для Деда Мороза
Анкета ребенка
В анкете — постоянная информация о ребенке. Конкретное поздравление можно детализировать еще сильнее.
Загрузить несколько фото с комментариями, письмо к Деду Морозу, рассказать, за что нужно похвалить ребенка и что ему пожелать на следующий год.
Сценарий приложения для Деда Мороза
Можно добавить детали, которые сделают подарок личным
Все, можно сохранить поздравление и, если захочется, купить его платный вариант.
Сценарий приложения для Деда Мороза
Подарок готов, можно дарить
Что еще может понадобиться родителям от этого интерфейса? Выбрать поздравление в магазине. Подарить поздравление ребенку друзей. Удалить или восстановить видео.
Как видите, это уже не просто конструктор поздравлений, а чуть более сложная штука.
Но ведь приложением будут пользоваться не только родители, но и дети.
Нужен отдельный детский интерфейс.

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

Плохой детский интерфейс — как фальшивая елочная игрушка. Разобраться-то в нем ребенок разберется, но радости никакой.
Вместо неудобного интерфейса или непонятного, или унылого, — лучше уж рыбьего жиру ребенку предложить, честное слово. Радости столько же, но хотя бы полезно.
Детский интерфейс должен быть таким же, как для взрослых, только лучше, удобней и понятней.
Навигация — настолько простая, насколько это вообще возможно. У нас вот — только кнопки «Вперед» и «Назад» и свайп.
Еще, кстати, дети держат телефоны не так, как взрослые.
Как дети держат телефоны
Вот так. И надо убедиться, что до любого контрола при этом легко дотянуться
В первом релизе детский режим реализовать не успели. Но дизайн интерфейса для него мы уже сделали.
Онбординг в приложении для Деда Мороза
Детский интерфейс. Главный экран и онбординг
В детском режиме — личная комната ребенка.
В комнате ребенка хранятся поздравления. Детям нравится их пересматривать даже летом.
Сценарий приложения для Деда Мороза
Детский интерфейс. Комната ребенка, в которой хранятся видеопоздравления
Что за маленькая неинтересная кнопка в верхнем углу? А это для взрослых — переход в родительский интерфейс.

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

Мы передали этот проект в разработку, но до самого запуска будем продолжать авторское сопровождение.
К примеру, нужен дизайн страниц приложения в AppStore и GooglePlay — рисуем дизайн страниц.
Дизайн приложения для Деда Мороза
Страница приложения в AppStore
Или заказчик предлагает скорректировать логику интерфейса: убрать регистрацию «по умолчанию». Разумно — люди не любят регистрироваться без особой на то причины.
Сценарий авторизации в приложении для Деда Мороза
Пускай приложение предлагает пользователю не зарегистрироваться, а создать видео. А поскольку поздравления строго индивидуальны, регистрация и заполнение анкеты не раздражают. Для них есть ясная причина, а не «нам нужно больше, больше регистраций»
Реализуем новую логику в дизайне, корректируем макеты — и так пока приложение не выйдет.
Если бы все это происходило в рамках собственно проекта, а не авторского надзора, улучшайзинг бы затянулся приблизительно навечно и до разработки дело бы дошло нескоро.

Смысл

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

Ничего страшного, если концепция меняется на лету. Поймаем и сделаем.

~ 950 000 ₽
Бюджет
Результат
Другие кейсы