Кейс: Material design нового приложения VisaToHome для Android

Ольга Петрунина, сооснователь и руководитель сервиса для заказа виз через интернет VisaToHome, рассказала AD о создании нового мобильного приложения для Android, которое проектировалось с учетом основных принципов material design.

Материал написан при поддержке сервиса VIsaToHome

Android vs. iOS

Приложение VisaToHome для Android отличается от нашего приложения для iOS. В этот раз команда разработчиков изменила подход к дизайну, решив отойти от утилитарности. Мы пересмотрели наш стиль — он стал более эмоциональным и личным. Цветовая палитра приложения стала мягче, мы использовали карточки и иллюстрации папок в качестве привычных всем интерфейсные метафоры при работе с документами.

Еще одно изменение — это использование фотографий для создания образа каждой страны. Наш сервис предназначен для самостоятельных путешественников, а фото — это неотъемлемая часть впечатлений и опыта от каждой поездки. В дальнейшем наш новый подход будет более заметен: мы работаем над усовершенствованием дизайна приложения для iOS и веб-интерфейса. И там, и там скоро появятся нововведения, внесенные в приложение для Android.

Несмотря на некоторые отличия во внешнем виде, первая версия приложения для Android никак не отличается от приложения для iOS по функционалу. Мы сосредоточились на создании приложения под новую платформу в соответствии с руководством по Material design, и сделали наши продукты совместивыми— чтобы можно было начать делать заказ на одном устройстве, и закончить на другом.

Принципы Material design в действии

Material Design — набор принципов по проектировке интерфейсов, которые были разработаны компанией Google и активно ей продивгаются. Material design объединяет все продукты знаменитого технологического гиганта и основан на убеждении, что интерфейсами намного легче пользоваться, если свойства цифровых объектов (например, иконок на экране смартфона) напоминают свойства настоящих физических объектов.

Material design отлично вписался в наш фирменный стиль. В приложении мы использовали метафору цифровой бумаги для объектов нашего интерфейса, сделали упор на типографику и наши фирменные цвета (мятный, серый и оранжевый), и добавили фотографии для создания ярких образов стран из путешествий.

Мы аккуратно подошли к использованию FAB (Floating Action Button) — это круглая кнопка, которую Google предлагает для совершения ключевых действий в приложении. Мы добавили ее только в тех случаях, где это удобно пользователю и не наносит ущерб общему восприятию интерфейса. Слепо следовать руководству Material design не стоит.

Чтобы у пользователя было ощущение взаимодействия с реальными объектами в наших интерфейсах, мы использовали привычные карточки и папки документов. Кроме того, нам пригодилась метафора «цифровой бумаги» — она помогла правильно отобразить визуальную иерархию. Мы начинали с похожего подхода при дизайне всех наших продуктов, поэтому в приложении под Android продолжаем генеральную линию.

Продвижение

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

Мы хотим не столько нарастить долю продаж с мобильных устройств, сколько получить новых пользователей. Мы проведем серьезную работу, чтобы наше приложение попало в различные подборки в Google Play. Помимо этого, мы собираемся продолжать нашу рекламную кампанию с лидерами мнений — она сработала при запуске нашего iOS-приложения. Когда оно появилось, о нас написала Ксения Собчак и еще около пятидесяти популярных блогеров — это привело к тысячам новых устновок.

Трудности

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

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

Советы Android-разработчикам

Воспринимайте руководство Material design не как догму, а как рекомендации. Переосмысливайте ваш визуальный стиль в рамках нового подхода Google к дизайну, ищите новые интерфейсные решения, смотрите на наработки дизайнеров и разработчиков на всех платформах — и не бойтесь создавать что-то новое, особенно если это лучше работает именно для ваших пользователей.

P.S. Напомним, что скоро получение виз для россиян уже не будет таким простым и удобным процессом — с 14 сентября вводится обязательная процедура сдачи биометрии при получении шенгенских виз. Заявителям нужно будет лично являться в визовые центры для того, чтобы оставить отпечатки 10 пальцев и сделать специальные фотографии. Таким образом, не стоит откладывать получение виз на сентябрь. Скидка в 500 рублей для читателей «AD» доступна по промокоду silicon