Книга: Мобильное приложение как инструмент бизнеса

Пользовательский интерфейс

Пользовательский интерфейс

Непосредственная разработка мобильного приложения обычно начинается с создания интерфейса. Интерфейс пользователя (User Interface) – это все, что вы видите в своем приложении, все элементы управления приложением, а также все способы уведомления о происходящем в приложении. Некоторые могут называть интерфейс дизайном, но это неверно, так как дизайн слишком обширное понятие. А вот интерфейс – это как раз все то, что позволяет вам получать информацию из приложения и передавать ее в приложение. Сюда относятся все «кнопочки» на экране, клавиатура, голосовое управление, управление жестами, вывод информации на экран, вибрирование, звуки и голосовые уведомления.

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

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

Нужно учитывать пользовательский опыт. Когда сотрудники компании Visualead создавали рисунки для сканирования в качестве кода, они поняли, что в обычной картинке пользователь не распознает код для сканирования, в результате чего родилась идея объединить картинку с QR-кодом. Так появился визуализированный QR-код. По-другому сделать было невозможно, ведь без QR-кода даже сам разработчик не догадается, какая картинка содержит код, а какая нет.

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

1. Какую главную задачу необходимо решить с помощью приложения?

2. Для кого создается приложение?

В каждом приложении все вертится вокруг одной самой главной задачи – той, которую оно должно решать: и внешний вид, и режим управления; второстепенные задачи при этом отодвигаются на второй план. Только так можно сделать популярное приложение, выполняющее свои функции.

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

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

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

Если не учесть такие детали, то целевая аудитория не сможет пользоваться приложением, поэтому в ИТ появилось понятие «юзабилити» – оценка удобства использования программы. Весь смысл приложения заключается в том, насколько оно удобнее, чем другой способ решения задачи. Например, если будет проще поручить дело помощнику, то вы не будете пользоваться приложением, а привлечете помощника.

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

Вначале визуальный интерфейс создается в виде каркаса, без оформления (wireframes). Все, что должно быть в приложении, рисуется в виде прямоугольных областей и подписывается. Таким образом становится понятно, какие элементы и где лучше всего разместить. Это можно делать как в специальных веб-сервисах, специально для этого предназначенных, так и просто на бумаге. Существуют даже специальные трафареты для упрощения рисования элементов интерфейса. Можно использовать готовый макет смартфона и специальные листочки, на которых рисуется интерфейс, а затем вставляется в макет, чтобы лучше понять, как все будет выглядеть.

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

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

Не стоит при первом запуске приложения предлагать пользователю зарегистрироваться или уходить прочь. Это очень плохая практика. Крупные и известные компании могут себе позволить так поступать, потому что, если пользователь скачивает их приложение, он точно начнет им пользоваться. Они напомнят ему об этом. Можете ли вы себе это позволить?

В Creators большинству заказчиков мы советовали сделать все возможное, чтобы пользователь мог работать с приложением без необходимости регистрироваться или хотя бы имел возможность опробовать его, а затем уже зарегистрироваться – это помогает удержать пользователей. Хотя процесс регистрации выглядит простым, на самом деле он требует от пользователя дополнительных действий. Пользователь как минимум должен заполнить два поля: имя пользователя и пароль. И тут начинаются проблемы, потому что пользователи вообще не хотят ничего делать. Они хотят получить все и сразу, ничего не заполняя, не нажимая, даже не скачивая. Также типичный пользователь очень не любит, когда от него чего-то требуют и указывают, что он должен делать и как. Он считает себя владельцем смартфона, не обязанным выполнять требования какого-то очередного приложения. При первом запуске на первом экране ваше приложение должно быть готово к использованию без необходимости дополнительных манипуляций со стороны пользователя.

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

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

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

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

Оглавление книги