course user interface — lesson 8

42
USER INTERFACE lesson №8

Upload: oleksandr-lisovskyi

Post on 18-Jul-2015

297 views

Category:

Design


0 download

TRANSCRIPT

USER INTERFACElesson №8

Alex LisovskyCo-Founder at ZZ Photo, UX/UI designer

[email protected]/alexlisovsky, pinterest.com/alexlisovsky,

twitter.com/lisovsky

Принципы создания интерфейсов для больших экранов

http://getpocket.com/a/read/752558457

Принципы создания интерфейсов для больших экранов

http://getpocket.com/a/read/752558457

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

http://getpocket.com/a/read/752558457

Amazon Music App

http://getpocket.com/a/read/752558457

Где решение?

Решения на уровне операционной системы

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

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

http://getpocket.com/a/read/752558457

Свайп в сторону

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

http://getpocket.com/a/read/752558457

Свайп в сторону

http://getpocket.com/a/read/752558457

Элементы управления внизу экрана

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

http://getpocket.com/a/read/752558457

Недавно Facebookпровела тестирование, которое показало, что перенос меню iOS-приложения в нижнюю часть экрана позволил повысить показатели вовлеченности и удовлетворенности, пользователям даже стало казаться, что приложение работает быстрее.

http://getpocket.com/a/read/752558457

Action button

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

http://getpocket.com/a/read/752558457

Action button

Cуществует решение, которое позволит облегчить работу с приложением на смартфоне с большим экраном и не запутает.

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

http://getpocket.com/a/read/752558457

Система оплатыпроезда в киевском метро

Практическое задание:

Создаем прототип терминала самообслуживания в метро.

Функционал позволяет:- Купить жетоны- Купить карточку- Пополнить карточку- (ваши предложения)

Проблема

Текущие решения

История

Get your travel information, accommodations, and tickets in an instant - electronically!

Imagine the ease...the simplicity! Trip-a-matic, activated by push buttons and your charge plate, checks accommodations, makes reservations, prints tickets and bills you later!

Jules Verne never imagined it this quick!

This is a 1956 ad for General Motors New Departure

Сценарий?

Сценарий

Ограничения

Вдохновение

Практическое задание:

Создаем прототип терминала самообслуживания в метро.

Функционал позволяет:- Купить жетоны- Купить карточку- Пополнить карточку- (ваши предложения)

Варианты решения: NFC

Система мобильных платежей (wireless-based payment system) —система мобильной коммерции, обрабатывающая операции электронной коммерции с поддержкой инфраструктуры беспроводных сетей и беспроводного Интернет. В отличие от систем интернет-платежей, использующих инфраструктуру сети Интернет и WWW, беспроводные платёжные системы обрабатывают запросы от мобильных устройств и привязанных к определйнному месту терминалов. Эти системы объединяют следующие особенности[1]:

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

обслуживания, географически привязанных транзакций.3. Безопасные протоколы беспроводных платежей.

Варианты решения: NFC

Варианты решения: NFC

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

Варианты решения: NFC

Варианты решения

Варианты решения

Варианты решения

Варианты решения

Варианты решения

Дополнение

Дополнение

Дополнение

Дополнение

Дополнение

Alex LisovskyCo-Founder at ZZ Photo

UX/UI designer

[email protected]/alexlisovsky, pinterest.com/alexlisovsky,

twitter.com/lisovsky