Книга Как создать продукт, который полюбят, страница 54 – Скотт Херф

Рис. 7.24. Мобильное приложение банка USAA напоминает о доблести, чести и гарантирует безопасность

UBER

Uber — это прекрасный пример сочетания роскоши и эффективности.

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

Вот и все. На самом деле в приложении не так уж и много чего можно сделать, поскольку продукт — это автомобиль, который забирает вас по нажатию одной кнопки (рис. 7.25).

Рис. 7.25. Uber как сочетание роскоши и эффективности

Посыл Uber прост: мобильному приложению не нужно много говорить. Это суперсила, которая позволяет каждому клиенту вызвать машину, которая отвезет его куда он только пожелает.

EAT24

Этот сервис предлагает доставку продуктов. С другими аналогичными приложениями его роднит типичный красный цвет, но Eat24 отличается непосредственностью и чувством юмора. Статьи и истории, призванные привлечь внимание клиентов, позволяют ему выделиться из толпы. Как вот эта, например, прямо перед Днем независимости США (рис. 7.26).

Рис. 7.26. Уморительная рассылка Eat24 с купоном на скидку

Тон этой истории соответствует миссии приложения, которая проявляется даже в простых вещах, таких как, например, оповещение о пустой корзине (рис. 7.27).

Рис. 7.27. Тон Eat24 последователен и постоянен, даже в обыденных сообщениях.

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

«Я всегда чувствовал, что программное обеспечение должно не только эффективно решать задачу, оно должно быть приятным в использовании, — сказал Бадин о Tinder. — Многие упускают это из виду, особенно когда создают не потребительские продукты. Тем не менее у каждого приложения есть свой пользователь, и чем больше радости и удовольствия вы добавите в приложение, тем лучше и приятнее будет день».

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

АНИМАЦИЯ И ДВИЖЕНИЕ

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

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

Дам вам подсказку: ответ кроется в движении.

Движение очеловечивает. Это отражение того, как работает реальный мир. Но в области дизайна, если предположить, что мир движется со скоростью 60 кадров в секунду, «нужно разработать 58 кадров между Состоянием A и Состоянием Б», — напоминает Пол Стаматиу из Twitter ^[168].

Джош Брюер соглашается с ним: «Как продуктовый дизайнер вы несете ответственность за каждый момент между экранами так же, как и за сами экраны». Брюер называет это «интервал состояний».

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

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

В конце концов, мы живем в мире движения. Движение — это история о том, как существуют вещи, как они перемещаются из одного места в другое.

Джонатан Бадин говорит об этом так:

Рис. 7.28. Закрытая и открытая анимации Tinder превращают фотографию в карту с полным профилем, сообщая, что одним нажатием два вида просмотра доступны

Сравните этот пример с примером Паскуале ДаСилва из Elepath — безумно прекрасные «Переходные интерфейсы» (рис. 7.29).

Рис. 7.29. Паскуале ДаСилва из Elepath показывает, как анимация способна имитировать реальную жизнь и помочь понять, что происходит на экране

ДаСилва говорит: