Pull to refresh

Что такое качество в веб-дизайне: примеры и рекомендации. Часть 3

Reading time6 min
Views12K
Original author: Liam
Не забудьте почитать:
Что такое качество в веб-дизайне: примеры и рекомендации. Часть 1. (или здесь)
Что такое качество в веб-дизайне: примеры и рекомендации. Часть 2. (или здесь)

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

05. Сдержанность и деликатность


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


Примеры утонченных эффектов в веб-дизайне


Легкие градиенты на сайте “Things”

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

quality_15

Падающие тени на сайте Icon Dock

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

quality_16

Утонченные текстуры фона: сайт Scouting for Girls

Текстурный фон может решить судьбу вашего дизайна. Часто фон лишь отвлекает и сильно снижает качество дизайна. Поэтому обычно имеет смысл использовать легкие и утонченные текстуры. На сайте Scouting for Girls текстура фона удивительным образом сочетается с общим стилем и качеством дизайна.

quality_17

Следы времени: сайт Viget Advance

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

quality_18

Акварель на сайте WebDesignerWall

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

quality_19

Легкие цветочные орнаменты: сайт Dara’s Garden

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

quality_20

Советы по использованию утонченных средств дизайна


По-моему, утонченные детали помогают сделать шаг от хорошего дизайна к дизайну великолепному. Если вы думаете, как привнести в ваш дизайн нечто особенное, утонченные детали — ваш выбор. Вот несколько рекомендаций, о которых необходимо помнить, используя в дизайне утонченные детали.
  • Используйте многослойность
    Никогда не ограничивайтесь одним шаблоном или текстурой, делайте детали разнообразными.
  • Экспериментируйте с прозрачностью и цветом
    Иногда даже значение непрозрачности 3% может сыграть вам на руку.
  • Не парься, будь смелым
    Не бойтесь, что получится слишком утонченно или слишком размыто.

06. Используйте весь потенциал цвета


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

Превосходное использование цвета в веб-дизайне


Недвижимость может быть красочной: сайт Oypro

В сайте Oypro мне нравится то, что его создатели доказали — сайт, посвященный «скучной» теме, необязательно должен иметь скучный дизайн. Увы, слишком часто при создании корпоративных сайтов дизайнерам не разрешается использовать смелые и своеобразные решения. Кажется, заказчикам просто необходимо, чтобы их сайт был простым, плоским и серым. Но этот дизайн доказывает, что можно создать деловой корпоративный сайт, не сдерживая своих творческий порывов.

quality_21

Цвета должны быть уместными: сайт Tennessee Summertime

Summertime in Tennessee — это живой, яркий и очень теплый сайт. Что и требуется от сайта, рекламирующего летний отдых. Здесь играет много разных цветов, но все они «в тему». Качественные сайты имеют цветовую схему, где все цвета служат на пользу общей идее. Иногда дизайн становится лучше за счет очевидного выбора цветов, хороший тому пример — Hell Design, он бы не возымел должного эффекта, если бы там использовался иной цвет, чем огненно-красный.

quality_22

Разнообразные фоны: Saturized Studio

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

quality_23

Советы по использованию цвета в дизайне


Цвет — это всегда хорошая область для исследований и испытания различных возможностей и вариаций, но есть несколько вещей, о которых важно не забывать, выбирая цвета и цветовые схемы.
  • Экспериментируйте
    Сайт на «скучную» тему не должен иметь скучную цветовую схему.
  • Добавьте разнообразия
    Попробуйте использовать для создания красочных фонов градиенты, шаблоны и кисти. Фон не будет выглядеть хорошо только за счет цвета.
  • Придерживайтесь темы
    Старайтесь, чтобы цвета были уместны для продукции или услуг, которым будет посвящен сайт.

07. Делать нечто, чего никто раньше не делал


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

Из этой затеи может получиться создание чего-то бесподобно прекрасного, или чего-то, что не выдерживает никакой критики. Между успехом и провалом очень тонкая грань; я имею в виду, что есть причины, по которым что-либо никогда не создавалось, и обычно это потому что идея была вздорной. Дизайнер должен иметь смелость, чтобы отступить от того, что всем дорого и мило, и вот несколько примеров тому:

Уникальная навигация на сайте MB Dragan

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

quality_24

Сайт Visualbox и его Очень Визуальная Навигация

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

quality_25

Сразу к делу, сайт Nikola Mircic

Итак, вы дизайнер интерфейсов, и вы хотите, чтобы люди увидели ваши работы и наняли вас. Nikola Mircic показывает нам, как с прямолинейным подходом к делу можно сделать очень впечатляющий сайт. Входя, вы видите все разнообразие работ автора, его имя и профессию вверху страницы и контактные данные. Тут нет длинных текстов или тысячи слов, убеждающих вас воспользоваться услугами автора, он просто позволил работам говорить самим за себя. Конечно, вы можете кликать по картинкам, чтобы увидеть большие версии и какой-то текст, но сама схема сайта действительно уникальна, и мне нравится, как она работает.

quality_26

Советы по стремлению к чему-то новому


Примеры, приведенные выше, не задумывались как «источник вдохновения» для уникальных идей, это просто несколько сайтов, которые кажутся мне совершенно уникальными. Правда состоит в том, что невозможно просто смотреть вокруг в поиске новых идей, на самом деле, это порочная практика. Так что вы можете просто проигнорировать весь этот раздел, если вы стараетесь выдумать что-то новое!
  • Это должно быть уместным
    Если вы собираетесь сделать что-то совершенно новое и уникальное, сначала спросите себя: «А это вообще имеет смысл?» и «Это будет соответствовать назначению сайта?». Если ответом будет «Да», то вперед!
  • Забудьте все, что вы знали!
    Ну хорошо, может быть, не все — базовые принципы забывать не нужно, но нет смысла искать вдохновения для новых идей, возможно вы просто выбрали не то направление.
  • Держите марку
    Я думаю, если ваша новая идея выглядит и работает хорошо, то вам будет гораздо проще убедить всех, что она имеет право на существование.

Что для вас «качественный дизайн»?


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

Спасибо за внимание и ваши комментарии!
Tags:
Hubs:
Total votes 95: ↑88 and ↓7+81
Comments35

Articles