Обучайся бесплатно с WAYUP Premiere сегодня вечером

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

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

Впрочем, новое мини-правило сочетания, казалось бы, несовместимого способно немного преобразить и обновить дизайн и даже интернет в целом. Что ж посмотрим на самые знаковые сайты лета 2017.

Use All Five

Дизайн сайта Use All Five – яркий представитель современной эстетики веб-дизайна и потому можно увидеть много панелей, разделяющих  страницу на секции и в то же время красиво перетекающих одна в другую. Цветовая гамма выбрана пастельной, но от этого сайт визуально только выигрывает. Можно, конечно, говорить о том, что он необычен, что на нем очень мало текста, анимационный логотип и многое другое. Но можно сказать, что он просто очень красивый и определенно выделяется своей уникальность и имеет ярко выраженную личность. Да, даже так.

Oui WIll

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

Pavel Kedzich

Дизайнер Павел Кедич обладает одним из тех типов сайтов (по дизайну), которые являются яркими представителями классического постминимализма. Почти… ну, да, фотографии выложены коллажем, но в целом-то использован именно постмодернизм. Кроме того, у него есть анимационный логотип, навигационная панель справа. А вот вся остальная информация сосредоточена в колонке слева, да еще и разбита столбцом. Это просто, ненавязчиво, до безобразия оригинально и удобно. Но никаких изяществ, изворотов нет. Минимализм во всем своем проявлении.

Standing By

Standing By сосредоточен, главным образом, на типографике и фотографиях. Причем на фотографиях с героями, образами. И эти два компонента дизайна сочетаются друг с другом с помощью эклектичного макета модульной сетки. Эклектика сама по себе предполагает смешение разнородных стилей. И в дизайне данного сайта это хорошо прослеживается. Это также и классический минимализм. Задавались иногда вопросом: что есть классика? Вот он яркий пример тому.

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

Negative Labs

Помните время, когда тонна минималистических сайтов использовала всевозможные шрифты семейства Sans-Serif и очень много черных толстых границ и рамок? Именно они были предшественниками брутализма. Сейчас на них смотрят, как на нечто ужасное, но тогда-то благодаря им стилистика веб-дизайна развивалась и очень недурно. Дополнительно еще применялась различные текстовые эффекты.

Представьте, как бы это могло измениться в нынешнее время? Ярким тому примером служит дизайн Negative Labs. Сложно сказать нравится ли он нам, вызывает ли он негативные эмоции, но он удобен, понятен, быстр в работе. Да, нет как таковых эффектов, привычных «вау и ноу-хау». Но почему-то с ним удобно и хочется возвращаться. Он выделяется и нет, это не шутка, но он способен вдохновить своим видом на создание чего-то похожего, но чуточку лучшего.

All Boats Rise

All Boats Rise имеет довольно обычный макет с достойной типографикой и целую массу персонализаций. Это один из первых сайтов, где так много используется синего цвета в разных вариантах. До голубоватого и фиолетового оттенка в шрифте, градиенте, логотипе. Как будто реально находишься на сайте крупной корпорации и буквально погружаешься в их атмосферу. Отдельно хочется заметить то, как создали они галерею работ и рассказ об услугах. Настолько тонко, воздушно, скромно, что сказать о дизайне: «обычный» не получается.

Flavien Guilbaud

Портфолио сайт Flavien Guilbaud – как раз тот самый, еще один, что сочетает в себе стиль коллажа в портфолио с асимметрией и профессиональной эстетикой. Акцент же здесь сделан на анимации, параллаксе, на игре цвета (из черно-белого в цветное). Выглядит фантастически. И во всем обилии анимации, мелкого шрифта, который будто бы теряется на странице, заплутать на сайте невозможно. Рано или поздно, даже если бездумно кликать, все равно тебя перебрасывает на главную страницу или страницу портфолио.

L'Eloi

Сайт агентства L'Eloi в своем дизайне сочетает асимметрию и минимализм. И именно про него хочется сказать: «шик, блеск, красота». Ну, иногда хочется где-то собрать все эти определения, а этот сайт подходит, как нельзя лучше. Что же здесь нас привлекает? Крупный, четкий, жирный шрифт, что хорошо читаем и визуально быстро воспринимается, и огромные метры (буквально) белого пустого пространства.

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

Amber Eve Anderson

Еще один пример минимализма с большим количеством рамок и границ. Речь идет о портфолио-сайте фотографа и дизайнера Amber Eve Anderson. Специфика дизайна сайта в сочетании классической эстетики с большими шрифтами, которые мы использовали ещё в начале 2000-х годов. И этот сайт мог бы выглядеть устаревшим и слегка недоделанным, если бы не фон. Едва уловимое изображение преобразовывает дизайн, делая его интересным и необычным. И кстати, мы рассказывали  вам об идеях стрит-арта в веб-дизайне. Так вот этот проект хороший тому пример, когда пространство страницы используется и изменяется по смыслу. Также очень нравится и разбивка по годам её работ и достижений.

Any Studio

Самое интересное на любом сайте и на Any Studio в том числе – портфолио работ. Ну, почти самое интересное. Во всяком случае, они решили похвастаться десятью своими работами сразу же на главной станице и превратили это в мини-игру. Вот только игра это может и не у каждого получится. От посетителя требуется смахнуть изображение влево или вправо. Но если зажать ЛКМ, то изображение прилипает к курсору и двигается вместе с ним. Таким образом, его можно двигать по всему пространству сайта. Поэтому, именно что и нужно – смахнуть, сдвинуть курсором мышки изображения. Если смахивать вправо – то нравится работа, если влево – нет. В конце вам даже посчитается, сколько работ и как вы оценили.

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

Проблема же у такого дизайна есть. Кроме курсора и движения картинки нет никаких уведомлений о том, что сайт живой. И пока вы не начнете двигать картинку, вы не узнаете, куда её двигать и меняется ли что-то. Если у людей слабый интернет или если у них открыто много вкладок в браузере, отчего загрузка заметено тормозится, то они не смогут и этой игры-то толком увидеть. На наш взгляд, хорошо было бы создать небольшую альтернативу, коллаж, например. И дать посетителям выбор: хотите – играйте, хотите – нет.

Тирон Хейман

Личный сайт Tyron Hayman очень прост, но это работает и его реально хочется «поизучать». В фоне страниц использовались небольшие видео, синемаграфы. Едва заметные и затонированные для того, чтобы не привлекать к себе основное внимание. Дополнительно можно видеть яркие градиенты и весьма красивую типографику. Здесь нет ничего революционного, как в предыдущих проектах, но выглядит довольно занятно и удобно.

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

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

Zurb

Самый большой проект компании Zurb, создавших платформу Foundation for Sites 6, в очередной раз обновили свой сайт и ориентировали его на информацию о деятельности и услугах. Они все также используют талисман – астронавта, но на сайте его умело скрыли и оставили только намек и ассоциацию. Первая же запись гласит: «Привет, землянин.», но гарнитура шрифта буквально повторяет то самое написание из старинных книг по научной фантастике.

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

Впрочем, один занятный нюанс, эдакая изюминка, все же есть. Если пройтись по всем страницам сайта, то можно найти 42 иллюстрированные коровы. Да-да, имеено 42. Те самые, 42... Разные. Если нажать на изображение такой коровы внизу станицы, то можно увидеть небольшую статистику по тому, сколько коров вы уже нашли. Мелочь, конечно, но забавно.

Заключение

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

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

Как вам материал?