Мы знаем, что вы слышали эти два термина, плавающие вокруг: скевоморфизм и плоский дизайн. Что они означают? Это две современные тенденции дизайна, каждая из которых имеет свой собственный уникальный стиль и набор черт. Skeuomorphism создает чувство фамильярности путем подражать материалам, пока плоская конструкция остается поистине к своему средству, часто чувствуя минимальна и утилитарна.
Эти противоположные стили создают главную развилку на пути для дизайнеров (особенно в дизайне пользовательского интерфейса), и многие проекты начинаются с вопроса о том, в какой мир прыгать. К счастью, мы здесь, чтобы помочь ответить на этот вопрос с углубленным взглядом на каждый стиль дизайна. Мы также рассмотрим совершенно новый язык дизайна Google, Material Design, который сочетает в себе эстетику как скевоморфизм, так и плоского дизайна.
Скевоморфизм
—
Термин "skeuomorph “происходит от греческого:” skéuos “(что означает контейнер или инструмент) и” morphḗ" (что означает форму). Итак, что означает содержать форму? Давайте посмотрим на культуру, из которой произошел термин скеуоморф.
Обратите внимание на повторяющиеся Кубы, которые украшают швы этой греческой структуры. Эти кубы (известные как зубные протезы) были помещены туда, чтобы создать иллюзию деревянных стропил, которые использовались для поддержки крыши в старых зданиях.
Поскольку здания в Греции были сделаны из дерева до мрамора, мы можем предположить, что архитекторы, возможно, пытались содержать или имитировать форму, которая была знакома. Имитация древесины в мраморных конструкциях, возможно, помогла привлечь людей к использованию новой технологии.
Между Древней Грецией и сегодняшним днем во многих местах возник скевоморфизм. В 1950-х годах производство деревянных универсалов стало слишком дорогим, и Chevrolet начал изучать новые материалы и технологии. Поскольку была привязка к дереву, Chevrolet установил поддельные деревянные панели, чтобы облегчить покупателям в более новые материалы, захватывающие производство транспортных средств.
С электрическими чайниками чая, форма подобная к первоначально двойнику stovetop использована-как широкое основание, печк-как док-станция, и spout gooseneck. Это все помогает облегчить потребителей в новую технологию путем ностальгии! Тофу собака выполнена в форме классического хот-дога, чтобы обратиться к тем, кто комфортно с хот-догами. (Представьте себе, что этот вегетарианский продукт был размещен в сферической форме или иначе. - Нет уж, спасибо.)
С помощью этих примеров мы можем прийти к базовому определению: Скевоморфизм-это дизайн, который эмулирует знакомые материалы, чтобы вызвать чувство знакомства или комфорта у потребителей.
Противоречие и подлинность
Скевоморфизм весьма спорен. Недоброжелатели говорят, что он часто может чувствовать себя поддельным или неподлинным. Зачем заменять надежный кухонный чайник на один с дешевым пластиковым диском? Он также часто используется, чтобы сделать дешево сделанные продукты выглядят более дорогими. Этот Chevrolet Caprice, возможно, был труден для некоторых людей, чтобы наслаждаться, не чувствуя, что они притворяются! В случае с собакой тофу некоторые вегетарианцы утверждают, что они не должны приспосабливаться к хищникам (чьи ценности они ставят под сомнение).
Хотя скевоморфизм, безусловно, помог многим технологическим переходам, всегда есть две стороны этой истории.
Скевоморфизм в дизайне пользовательского интерфейса
Переход от аналогового к цифровому-это один из самых больших технологических переходов, с которыми когда-либо сталкивалась наша культура. По сравнению с предыдущими технологиями, компьютеры, телефоны и планшеты являются невероятно сложными машинами. Мы сконденсировали бесчисленные машины и их функции к небольшим, освещенным контржурным светом экранам заполненным с пикселами.
Разработка интуитивно понятных интерфейсов для такой обширной и абстрактной технологии является сложной задачей. Как бы вы сделали это царство сложных и мощных технологий привлекательным для среднего потребителя? Как вы, возможно, догадались, многие дизайнеры пользовательского интерфейса полагались на знакомство, или скевоморфов.
В iOS от Apple значок телефона имеет форму классического телефонного приемника (несмотря на то, что сотовые телефоны выглядят не так), а значок электронной почты выглядит как бумажный конверт (объект электронной почты не используется). Подобно собакам тофу, мы знаем, что объекты, с которыми мы взаимодействуем, не имеют той формы, которая отображается. Но эти знакомые очертания ... помогите пользователям iOS найти функцию, которая похожа на аналоговые аналоги. Кроме того, значки в iOS слегка блестят и скошены, чтобы выглядеть как настоящие кнопки, что помогает пользователям знать, что они могут нажимать эти фигуры на плоском экране точно так же, как они могут нажимать фактическую кнопку.
Creative Dash доводит кнопку skeuomorph до крайности в своей гиперреалистичной булочке с корицей. Этот пример настолько избыточен, что он почти саркастичен, возможно, насмехаясь над тем, как многие дизайнеры пользовательского интерфейса пытаются сделать значки похожими на высококачественную кожу или дорогие часы.
Логотип Top Secret Case отображает скевоморфные текстуры металла и тени. Этот дизайнер взял простой векторный дизайн и дал ему отношение, которое может показаться знакомым или привлекательным для людей, которые хотят чувствовать себя жесткими или сильными.
Наконец, дизайн приложения D. Jiang создает текстурный внешний вид деревянной игровой доски. Все кнопки имеют поддельную текстуру зерна древесины и визуальную глубину, чтобы вызвать классическое или винтажное чувство.
Плоский дизайн
—
Плоский дизайн берет свое влияние от швейцарского стиля дизайна, который начался в России, Нидерландах и Германии в 1920-х годах, а затем приобрел популярность благодаря его развитию в Швейцарии. Швейцарский стиль делает акцент на читабельности, чистоте и минимализме. Конструкции от этого движения утилитарны, делают эффективное использование космоса, и плоски.
Швейцарский дизайн стиля резонировал через много школ, большинство известное школа Bauhaus . Одним из известных дизайнеров этого направления является Йозеф Мюллер-Брокман, который произвел революцию в системах электросетей. Его работа использовала пространство самым эффективным образом-очень актуальная концепция в отношении дизайна пользовательского интерфейса.
Квартира в дизайне пользовательского интерфейса
Как в Windows 8 (2012), так и в iOS 7 (2013) мы видим смелый переход к плоскому дизайну. В Windows 8 3D-кнопки заменяются простыми прямоугольниками и квадратами в жидком макете, не так, как у Йозефа Мюллера-Брокмана. Каждый 2D блок имеет одно значение, насыщенность и оттенок, без градиентов. Аналогичным образом, iOS 7 также выровнялась. Некогда блестящие, скошенные кнопки потеряли свою глубину, значки больше не имеют тени, а формы используют градиенты очень минимально. Обе эти конструкции хорошо вписываются в определение плоской конструкции.
Подобно окнам, за окном также используются плоские и цветные прямоугольники. Тем не менее, приложение берет концепции из швейцарского дизайна и минимализма на один шаг дальше, представляя прямоугольники без какого-либо разделения. Фактически, единственными элементами, которые выводят эту конструкцию за рамки строгой геометрии, являются плоские значки. Этот плоский дизайн пользовательского интерфейса охватывает цифровой интерфейс и делает его выглядеть, ну, цифровой!
Это простое аналитическое приложение воплощает в себе суть плоского дизайна без каких-либо теней, реальных материалов или визуальных эффектов. Все цвета здесь сплошные и плоские, а диаграммы-не более чем простые геометрические фигуры. Это приложение полностью находится в контакте со своим цифровым носителем. Давайте не будем забывать, что он также чувствует себя интуитивно, что напрашивается вопрос: Является ли скевоморфизм необходимым в нашей повседневной цифровой практике?
Материал
—
В 2014 году Google запустила Material, проект, который направлен на " разработку единой базовой системы, которая позволяет обеспечить единый опыт работы на разных платформах и размерах устройств."Вдохновленный бумагой и чернилами, Google изобрел воображаемый дизайн "материал" и создал рекомендации по его использованию. Из-за его бумажных корней, вы можете назвать его скевоморфным. Однако он также прочно вписывается в мир плоского дизайна благодаря интеллектуальной компоновке, ограниченным теням и анимации.
Как язык дизайна, Material Design имеет набор строгих визуальных рекомендаций. Например:
Никакие две части материала не могут перекрываться.
Все материальные элементы непрозрачны.
Никакие материальные элементы не могут сложить или согнуть.
Правила на этом не заканчиваются. Они также включают в себя рекомендации для того, как пользователь может взаимодействовать с приложением. Google пытается предоставить инструментарий для разработчиков приложений, чтобы создать наиболее утилитарные и интуитивно понятные приложения. Похоже на швейцарский стиль мышления, да?
Несмотря на влияние бумаги и тонкие тени, материал Google очень много создан в духе плоского дизайна. Может быть, он одновременно скевоморфный и плоский? Возможно. Тем не менее, это, безусловно, будет интересно посмотреть, где разработчики приложений принимают этот инструментарий. Если у вас есть телефон на Android, используйте приложения Google, или просто поклонник дизайна пользовательского интерфейса, мы рекомендуем держать в курсе этой волны дизайна.
