Глава 4: Паттерны

Друзья, искренне надеюсь, что ваш бесценный мозг не расплавился и вы всё ещё с нами 😘. Мы узнали кто такой UI-дизайнер, что человек управляет цифровым интерфейсом при помощи интерфейсов из физического мира, сломали голову о зоопарк контролов и познакомились с навигационными паттернами.

Кстати, а что такое паттерн?

Ой, сложно объяснить, но я попробую. Для начала приведу ряд примеров:

1. Чтобы включить устройство, нужно нажать на кнопку ВКЛ.

2. Чтобы вызвать список программ в Windows, нужно кликнуть на иконку Start в нижней панельке.

3. Чтобы в iPhone 8 попасть на главный экран iOS, нужно нажать на большую круглую кнопку под экраном.

4. Чтобы в OS X и Windows закрыть окно/программу, нужно нажать на одну из трёх иконок, на «крестик» в верхней панели.

5. Чтобы переключиться между разделами в мобильном приложении, вам нужно тапнуть в tab bar на нужный вам раздел.

6. Чтобы воспользоваться поиском, нужно найти на экране иконку «лупа» и тапнуть/кликнуть на неё либо в input рядом с ней.

7. Чтобы создать новое email-сообщение, нужно тапнуть/кликнуть на иконку «плюсик».

8. Чтобы обновить контент на экране, нужно потянуть экран вниз. Появится spinner (крутящееся иконка или типа того), а когда она исчезнет — контент на экране обновится.


Уверен, вы догадались, что такое паттерны. Тем не менее, давайте посмотрим на объяснение:

Паттерн — набор действий, приводящих к определённому результату в рамках ОС, внутри аппов iOS и Android, при общении с физическими интерфейсами. Паттерны почти везде устроены и работают одинаково, поэтому пользователь заранее знает что произойдёт, если он воспользуется этим паттерном (он его уже сто раз видел). 

Например, процесс вызова лифта плюс-минус одинаков во всём мире. Светофор, за редким исключением, устроен одинаково и люди трактуют разные цвета одинаково: красный — стой, жёлтый — низкий старт, зелёный — вперёд!

— — —

Как паттерны применять?

Допустим, вы хотите сделать поиск по контенту экрана в мобильном приложении. Этот паттерн можно подсмотреть в аппе «Контакты», например, в iOS и скопировать весь процесс, перекрасив контролы на свой вкус. И все ваши пользователи, знающие паттерн поиска, точно будут знать, как им пользоваться!

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

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

Я не то чтобы вас отговариваю, нет. Я хочу, чтобы вы понимали риски, связанные с изобретением чего-то нового. Если есть устоявшийся паттерн работы с поиском, знакомый миллиарду людей, то изобретать новый жест для вызова поиска не стоит. Но если вы делаете революционный апп, паттерны в котором ещё никто не видел, но без них никуда — будьте любезны сделать туториал (объяснение) для пользователей.

— Воу-воу! Я всё понял, теперь я дизайнер интерфейсов и могу сделать всё!

— А, собственно, что всё?