ПЕРЕХОД ОТ СКЕВОМОРФИЗМА К ПЛОСКОМУ ДИЗАЙНУ

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

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

Стив Джобс, придумавший iPhone, считал, что отображение элементов интерфейса похожими на то, как они выглядят в реальной жизни, сделает взаимодействие пользователя и устройства наиболее эффективным. Такой принцип называется – скевоморфизм.  Благодаря ему, он пытался сделать пользование компьютером и другими электронными устройствами максимально простым. Настолько, чтобы даже люди, никогда в жизни не державшие ни iPhone, ни другие устройства Apple, смогли за несколько минут привыкнуть и понять, как работать с таким устройством [1].

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

Рисунок 1. Интерфейс приложения «Калькулятор»

Можно видеть, что кнопки оформлены с градиентом, что придает им объем и делает их похожими, на кнопки реального калькулятора. Подобное оформление относится к основным особенностям скевоморфизма, таким как:

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

Рисунок 2. Отображение кнопок и переключателей

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

Рисунок 3. Интерфейс приложения

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

Рисунок 4. Интерфейс приложения

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

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

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

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

Рисунок 5. Переход к плоскому дизайну

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

Список литературы:

1. Д. Петренко. В чем был главный дизайнерский принцип Стива Джобса. // 23 октября 2014
2. URL: http://style.rbc.ru/objects/gadgets/571639b29a79472acdb3555f (дата обращения 23.12.2017)