10-oshibok-v-razrabotke-prilozheniya (2)

10 распространенных ошибок в разработке мобильного приложения

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

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

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

1. Не приступайте к созданию макета или дизайна без предварительной отрисовки блок-схемы

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

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

2. Не забывайте о бюджете

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

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

3. Не начинайте с низкого разрешения, избегайте растровых изображений

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

4. Не занижайте размеры области касания

Ширина указательного пальца составляет в среднем 1,6–2 см. Не забывайте, что во время работы палец движется быстро, поэтому пользователю трудно управлять мелкими элементами. Избегайте тесной компоновки кнопок и ссылок. Сделайте кнопки достаточно крупными, а расстояние между кликабельными областями не должно затруднять прикосновение.

5. Не используйте анимационные заставки

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

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

6. Не оставляйте пользователей в неизвестности

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

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

7. Не стоит слепо копировать стиль других операционных систем

ошибки при разработке приложения

Неожиданный переход от одной мобильной ОС к другой приводит в замешательство и раздражает пользователя. Каждая мобильная операционка имеет собственный стиль. Создатели ОС выпускают руководства по проектированию пользовательских инструментов (HIG), в которых систематизируется уникальный внешний вид операционной системы. iPhone, Android и Windows Phone 7 обладают разными интерфейсами взаимодействия с пользователями, поэтому приложение для iPhone, в котором применяется блочный интерфейс и стиль навигации WP7, покажется пользователю непривычным и запутанным.

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

8. Не перегружайте элементами экраны высокого разрешения

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

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

9. Не думайте, что все будут работать с приложением одинаково

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

Еще один простой способ получить неплохой результат при минимальных расходах – набрать бета-тестировщиков на профильных ресурсах. Присмотритесь к студентам, которые с удовольствием разложат по полочкам ваше приложение буквально за копейки.

10. Не забывайте о жестах, но не злоупотребляйте ими

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

Ярким примером является процесс удаления писем в почтовом приложении для iPhone. В режиме просмотра входящих сообщений пользователь может просто смахнуть письмо для его удаления. Это действие избавляет от лишних операций: нажатия кнопки «Редактировать», выбора письма и нажатия «Удалить». Жест применяется для быстрого удаления, однако, специально сохранена опция «Редактировать» для тех пользователей, которые не знают об ускоренном способе или хотят выполнить расширенное действие, например, удалить или пометить галочкой несколько сообщений одновременно.

Помните о жестах, но не переусердствуйте с ними. Жесты не должны быть единственным способом войти в меню или выполнить какое-либо действие.

Заключение

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