7 UX дизайн совета для мобильных приложений

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

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

1. Жирный текст « Суровая типографика»

weathercom

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

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

Главным в этой тенденции является то, что текст имеет смысл. Одна часть тенденции, это ограниченное использование количества заглавных букв в словах или фразах. В то же время, использование заглавных букв — хороший вариант для одного слова «SUNNY».

Для того, чтобы использовать эту тенденцию нужно иметь ввиду:

  1. Типографика и  речь должны быть простыми.

2. Контраст между фоном и надписями должен быть высоким для максимальной читаемости.

2. Слои и глубина

uber

Material дизайн выделен, в качестве лучшей дизайнерской тенденции. И для этого существуют  веские основания:

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

Во-вторых, это  интуитивное понятная концепция с использованием интерфейса, который прост в использовании.

Одной из самых ярких частей Material дизайна  является  создание слоев, которые помогают пользователям взаимодействовать с дизайном. Это  одна из частей Material, которая  появляется в интерфейсах, в том числе и в приложениях компании Apple.

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

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

3.Монотонные цветовые схемы

streaks

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

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

4. Фокус на микро-взаимодействиях

instagram

Если говорить о взаимодействиях — каждое хорошее приложение включает в себя плавные  сигналы микро-взаимодействий.  Микро-взаимодействия —  это  маленькие сигналы, которые остаются незамеченными, но являются неотъемлемой частью того, как пользователи работают с этими приложениями.

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

В самых простых терминах микро-взаимодействия используются следующие варианты:

  1. Обратная связь — например: нравится что-то в Instagram?

2. Это  действие означает, что пользователю понравилось ваше изображение.

5. Карты, карты и еще раз карты

soundcloud

Эстетическое  изменение карт началось и стало укрепляться с Рinterest, а так же благодаря принятию Material дизайна массивными веб-сайтами, такими как Facebook и SoundCloud.

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

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

6. Простая навигация

slack

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

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

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

7. Анимация при прикосновении

strava

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

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

автор: Carrie Cousins

26.05.2016


Предыдущий пост

Следующий пост