Eng

Проектирование и дизайн

Проектирование и дизайн

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

Фотография програмиста
01

Задачи

Какие задачи решает MobileUp

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

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

    Исследуем бизнес, аудиторию, конкурентов

  • Фейслифтинг

    Освежаем стиль, когда ограничены в ресурсах

  • Брендинг

    Упаковываем смыслы, создаем фирменный стиль и лого

  • Дизайн интерфейсов и сервисов

    Помогаем запускать новые сервисы, берем на себя разработку дизайна мобильного приложения под ключ в Москве и Санкт‑Петербурге

02

Процесс дизайна

Три кита идеального интерфейса

Процесс дизайна включает в себя три больших блока: аналитика, проектирование и сам дизайн. Расскажем о каждом из них подробнее.

Аналитика

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

  • Анализ продукта

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

    Цель: погрузиться в бизнес заказчика, заложить фундамент для дальнейшего дизайн-решения.

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

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

    Цель: исследовать пользователей, рынок и конкурентов. Получить инсайты и идеи для развития продукта.

  • Подготовка технического задания

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

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

Фотография програмиста

Благодаря работе аналитиков мы дважды выигрывали чемпионат Pioneum — с кейсами Anna Money и Самокат

Проектирование

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

  • Пользовательские сценарии

    Создаем список пользовательских сценариев, которые можно выполнить в рамках интерфейса.

    Цель: максимально подробно расписать каждый сценарий, чтобы ничего не упустить в интерфейсе.

  • Структура интерфейса

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

    Цель: создать карту экранов и поместить туда все пользовательские сценарии.

  • Прототипи­ро­ва­ние

    Уточняем функциональность каждого экрана, схематично отрисовываем.

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

  • Юзабилити-тестирование

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

    Цель: собрать первую обратную связь от пользователей.

Фотография програмиста

У MobileUp 30 наград в портфолио. Самые значимые из них — Effie, Forbes и Webby. Больше всего статуэток с конкурса «Золотое приложение»

Дизайн

На этом этапе творится магия дизайна. Интерфейс приобретает завершенный вид и отправляется на разработку.

  • Дизайн-концепция

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

    Цель: создать дизайн-концепцию приложения, которая ляжет в основу дальнейшей работы.

  • Дизайн массива экранов

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

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

  • Анимация интерфейса

    Анимируем всякое при необходимости. Иногда не анимируем, в зависимости от задач. Обычно на онбординге пригождается.

    Цель: оживить интерфейс с помощью небольших, но приятных штрихов.

  • Передача макетов

    Готовим макеты и передаем их разработчикам.

    Цель: подготовить макет для дальнейшей разработки.

Фотография програмиста

Наш разработчик Денис Сушков придумал курс по iOS-разработке, который помог дизайнерам и программистам заговорить на одном языке

Методология

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

  • CJM

    Customer Journey Map. История взаимодействия клиента с компанией от момента осознания потребности до повторных коммуникаций.

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

  • JTBD

    Jobs to be Done — теория о поведении пользователей.

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

  • CustDev

    СustDev — процесс получения инсайтов от пользователей, обычно с помощью интервью.

    Цель: создание, проверка и оптимизация идей для развития продукта.

  • Дизайн-мышление

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

    Цель: выйти за пределы существующих стереотипов и привычных способов решения задачи.

Книги на полке

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

Опыт

  • Инструменты

    Раньше тут была куча иконок, но они все исчезли после появления Figma. Она закрывает все задачи по созданию, хранению и передаче макетов.

  • Подход

    В работе придерживаемся подхода Minimum Viable Product. Это значит, что в первый релиз выпускаем продукт с минимально-необходимым количеством функций. Быстрый запуск помогает оперативно собрать обратную связь и наращивать функциональность, основываясь на исследованиях живых пользователей. А еще это экономит деньги и время.

  • Экспертиза

    Обучаем дизайнеров основам разработки. Наш разработчик придумал и реализовал экспресс‑курс по iOS‑разработке, на который мог записаться любой сотрудник MobileUp. Представьте уровень мощи дизайнера, прослушавшего курс по основам Swift.

    По ссылке ниже вы можете прочитать статью про наш проект «Нашкодим» на vc.ru.

    Проект «Нашкодим», или как мы обучали сотрудников iOS-разработке

03

Портфолио

Самокат

2022

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

2022

DMV Genie

2022

Редизайн проекта, который мы дизайнили шесть лет назад! Пересобрали дизайн-систему и полностью изменили стиль продукта, создав новый стандарт для отрасли и приложений образовательной тематики в Канаде.

2022

CoinRoad

2022

Фирменный стиль и дизайн интерфейса для проекта, рожденного в MobileUp. Особенность проекта — интерактивные пуш-уведомления, всплывающие на заблокированном экране. И очень красивые графики внутри.

2022

Tele2 Платеж

2021

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

2021

Необанк

2021

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

2021

ANNA Money

2021

Зарплатное решение для британского сервиса ANNA Money. Исследовали рынок Великобритании и продумали стратегию внедрения payrolls. Придумали простое и удобное payroll-решение, которое будет помогать бизнесу каждый день. И выиграли чемпионат в категории Финтех.

2021
04

Руководитель отдела

Александр Юдин — арт-директор MobileUp

Саша преподавал в ВШЭ, вел интенсив на Design Prosmotr и БВШД, читал авторский курс в школе Epic Skills. Он будет следить, чтобы на этом этапе все прошло идеально.

арт-директор MobileUp

Александр Юдин

06

Отзывы

  • Отличная презентация и структурирование решения, предложены хорошие решения и их реализация.

    Сергей КоролевCEO, Justfood
  • Нам удалось повысить эффективность сервиса

    Тима СергеевYami Yami
  • Комбо из опыта
    и коммуникаций сделало эту команду идеальной для работы

    Роман СоколовCarporate
07

Сотрудничество

Мы всегда рады сотрудничеству и новым проектам.

Опишите задачу, и мы с вами свяжемся.
Или напишите в Телеграм.

Давайте знакомиться!

Откуда вы о нас узнали
  • Рейтинги
  • Рекомендации
  • Конференции
  • Публикации
  • Соцсети
  • Другое

Нажимая «Отправить», вы даете согласие на обработку персональных данных и соглашаетесь c политикой конфиденциальности

Ваша заявка успешно отправлена

Мы все изучим и скоро выйдем на связь