Дизайн мобильного приложения MobilAssistance

О проекте

Перед нами стояла задача создать дизайн мобильного приложения для компании MobilAssistance. Она оказывает услуги помощи автомобилистам. Имеет многолетний опыт работы в области автоперевозок, эвакуации, технической и юридической поддержки клиентов на всей территории РФ, СНГ и стран Евросоюза.

Предпроектная работа

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

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

Сначала был Mind map

На основе mind map собрали 50+ экранов прототипа со всеми возможными функциональными состояниями. В качестве инструмента для прототипирования использовали сервис proto.io. Он заточен специально под мобильные приложения и обладает широким функционалом, позволяющим сделать прототип интерактивным и максимально похожим на «живое» приложение.

Дизайн

Первая стадия дизайна

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

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

Ребрендинг

Пример паттерна

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

Итоговый дизайн приложения

Было отрисовано 26 экранов приложения. Создан подробный GUI-файл с подробным описанием поведения всех элементов интерфейса: выпадающих списков, поп-апов, кнопок, полей ввода и т.д.