Плоский дизайн и шейморфизм.

Если вы жили в том же мире, в котором я жил последние несколько лет, наверняка вы были свидетелями (возможно, неосознанно) «столкновения» между чипированием и плоским дизайном.

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

Что такое шейморфизм

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

Однако в еще более конкретном смысле шейморфизм почти всегда относится к эстетическим характеристикам прошлого или, во всяком случае, к «устаревшим» объектам.

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

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

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

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

Шейморфизм — это реализм?

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

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

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

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

Плюсы и минусы шейморфизма

Как и во всем, в скелете есть как положительные, так и отрицательные стороны.

При хорошем и правильном дизайне (он должен быть сделан хорошо) «плюсы» шейморфизма таковы:

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

Конечно, есть и минусы. Эти «минусы» , возможно, заставили очень быстро пройти моду на чипы (о которых я расскажу вам чуть позже, не беспокойтесь!), которая расцвела несколько лет назад в мире дизайна. Они здесь:

  • Это очень медленный и громоздкий творческий процесс . Создание фотореалистичных текстур совсем не просто и занимает много времени;
  • Файлы, сгенерированные шеуморфным способом, требуют много места на диске;
  • Он не очень подходит для Интернета и особенно для кодов программирования CSS и HTML5 , используемых для обеспечения адаптивности веб-сайтов, то есть подходит для любого носителя (компьютер, планшет, мобильный телефон);
  • Он слишком привязан к меняющейся моде, чтобы на него стоило тратить время и деньги. Текстура темно-коричневой кожи может быть модной сегодня и скучной завтра, знаете ли вы?

Я говорю об этом, потому что, во-первых, в некоторых случаях это все еще действующий инструмент дизайна. Тогда он также был одним из самых горячих трендов последних лет, даже если в 2014 году его вытеснил другой тренд в мире графики: плоский дизайн.

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

Flat vs Skeu — почему об этом говорят?

Все началось с ковки волшебных колец. Три были отданы эльфам…

Ах нет, извините, я ошибся историей, ага. Давай начнем сначала.

Все началось с iPhone . Ну да. Еще Эппл.

До выпуска первого iPhone в 2008 году скелетность и реализм в графических интерфейсах были крайне необычными, за исключением разве что видеоигр. На самом деле, шейморфизм часто использовался в игровом дизайне, особенно в ролевых играх, таких как War of Warcraft или подобных, для облегчения понимания различных игровых динамик.

Apple активно внедряла чипы в свои графические интерфейсы iOS по двум веским причинам:

1. Шейморфизм был привлекателен. Конечно, сейчас нам по плечу видеть эти поверхности с фактурой дерева, искусственной кожи или пожелтевшей бумаги, но в начале это было большим нововведением! Когда вышел iPhone, никто не привык к такому визуальному богатству на мобильном телефоне.

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

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

Таким образом, в период с 2008 по 2012 год в мире графики произошло почти неконтролируемое распространение сколов вслед за моделью Apple. Но не все согласились.

Появление плоского дизайна

Если появление шейморфизма можно связать с Apple, то появление плоского дизайна, безусловно, связано с ребрендингом Microsoft с 2010 года.

На самом деле, несколько лет назад, возможно, чтобы отличаться от дизайна Apple, а может быть, потому, что искренне считали этот новый стиль лучшим, Microsoft приняла совершенно новый стиль, который первоначально назывался Metro Style. Затем название было изменено из-за проблем с авторскими правами, но какая разница, теперь все помнят его как дизайн Metro.

Это знаменитый дизайн, который мы видим в Windows 8 и более ранних версиях Windows Phone, основанный на такой сетке:

Этот новый Metro Style от Microsoft избавился от всех тех полуреалистичных текстур, оттенков и теней, которые были в моде несколько лет назад благодаря Apple. Это было частью того, что называется плоским дизайном.

Что, черт возьми, за плоский дизайн?

Что такое плоский дизайн

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

Очевидно, дизайнеры Microsoft не изобрели его. Это то, что многие, в том числе Коул Питерс , восходят к голландскому дизайну De Stijl или швейцарскому дизайну 1950-х годов.

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

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

Плоский дизайн тоже может быть схемоморфным!

Плюсы и минусы плоского дизайна

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

Начнем с «плюсов»:

  • Плоский дизайн в моде. Люди привыкли его видеть и хорошо относятся к нему. Одним словом, квартира — это круто!
  • Это адаптируется. И я имею в виду чрезвычайно адаптивный. Плоскую графику можно легко адаптировать к любому типу графического интерфейса, возможно, просто изменив размеры базовой геометрической формы (например, квадрата значка);
  • Он идеально подходит для Интернета и мобильных телефонов, поскольку он легко адаптируется и потому, что его простота облегчает загрузку, например, веб-сайта;
  • Существует возможность сосредоточиться на классной типографике в дизайне, поскольку светлое изображение позволяет использовать не только классические шрифты, предпочитаемые дизайнерами, но также инновационные или визуально яркие шрифты.

Но успокойтесь, нет ничего идеального, даже плоского дизайна, клянусь! Вот "минусы":

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

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

Exit mobile version