Одно из самых важных качеств специалиста в сфере визуальной коммуникации – насмотренность. То есть быть в курсе последних проектов и трендов, а также уметь проанализировать, за счет чего проект стал успешным. Другими словами, опытный профессионал должен понимать, где потенциально провальный или отличный дизайн до того, как его раскритикуют или же, наоборот, высоко оценят.
Чтобы развить насмотренность, необходимо обладать обширными знаниями и следить за первоклассными проектами. Например, вы можете посмотреть подборку лучших дизайнов сайтов 2020 года по версии Awwwards и получить вдохновение для создания собственного креативного проекта.
1. Stock Photography Then and Now
Сайт представляет историю стоковой фотографии, кардинальные перемены в эстетике за последние 10 лет и взгляд в будущее этой сферы. Он был создан креативным агентством Advanced Team в сотрудничестве с ведущим мировым фотобанком Depositphotos.
Красивый и ПРОДУМАННЫЙ дизайн сайта | Разбор и мышление дизайнера | UI/UX дизайн
2. Swab The World
Титулованное диджитал-агентство Locomotive разработало привлекательный сайт для платформы поиска доноров Swab The World, где каждый пациент может найти необходимую помощь.
3. The Year of Greta
В 2019 году журнал TIME назвал Грету Тунберг человеком года. Она попала на обложку издания и вдохновила бутик-студию Superhero Cheesecake на создание платформы, которая хронологически иллюстрирует, как Грета Тунберг стала лидером международного движения.
4. Pioneer — Corn Revolutionized
Благодаря студии цифрового дизайна Resn вы можете увидеть увлекательный процесс производства семян кукурузы от компании Pioneer.
5. Alan Menken
Креативная студия Hello Monday создала потрясающее портфолио для Алана Менкена – титулованного американского композитора и автора песен из всемирно известных мультфильмов “Русалочка”, “Красавица и чудовище”, “Аладдин” и многих других.
6. Sweet Punk
Новый сайт французского креативного агентства Sweet Punk представляет интересные проекты и мотивирует посетителей провести больше времени, изучая платформу.
7. Vide Infra
Агентство Vide Infra, которое специализируется на дизайнерских и технологических решениях для брендов, создало для себя увлекательной сайт, ставший одним из лучших в 2020 году по версии Awwwards.
8. Ali Ali
Еще одно вдохновляющее портфолио, достойное вашего внимания, – работа агентства цифрового дизайна Exo Ape для режиссера из Каира Ali Ali.
9. Mav Farm
Оцените потрясающий дизайн сайта для приложения Mav Farm. Компания Geex Arts, занимающаяся дизайном и веб-разработкой, вне конкуренции, когда необходимы трендовые и инновационные решения.
10. Altermind
Чтобы показать ценности и непобедимый дух консалтинговой фирмы Altermind, креативная студия Purée Maison создала сайт, который предлагает захватывающий пользовательский опыт.
11. Shape Studio
Shape Studio специализируется на пространственном дизайне для коммерческих клиентов. Их лаконичный и в то же время трендовый сайт создала титулованная студия из Бристоля – Green Chameleon (GC).
12. Acura: Beat That
Ищите вдохновение в геймдизайне? Посмотрите на гоночную игру Acura для мобильных устройств и компьютеров от Active Theory – агентства, которое создает потрясающие сайты, приложения, инсталляции и XR-проекты.
13. Nova Smart Home
Nova Smart Home – 3D-микросайт с увлекательным пользовательским опытом для тех, кто хочет больше узнать о продуктах для умного дома. Он был создан креативным агентством Ueno в рамках праздничной маркетинговой кампании.
14. Pest Stop Boys
Этот яркий интерактивный сайт от Herdl для службы дезинсекции Pest Stop Boys – отличный пример того, как можно визуализировать нишевые темы и эффективно доносить информацию аудитории.
15. Helias Oils
В дизайне сайта Helias Oils от диджитал-студии Buzzworthy используются трендовые цвета, эстетичные изображения и минималистичный макет, которые привлекают внимание и мотивируют посетителей узнать больше о продуктах и компании.
16. Ultima Gstaad Switzerland
EWM – швейцарское агентство по дизайну и разработке, которое создало первоклассный сайт для 5-звездочного отеля и SPA Ultima в Гштааде (Швейцария).
17. The Virtual Economy
Чтобы показать и описать будущее виртуальной экономики, агентство цифровых инноваций Gladeye сотрудничало с L’Atelier BNP Paribas. Результат совместной работы получился потрясающим!
18. Next Big Thing
Интересно, как выглядит сайт венчурной студии? Это платформа, созданная креативным агентством Serious Business для компании, которая поддерживает развитие новых венчурных проектов.
19. KD Capital
Независимое диджитал-агентство Spring/Summer помогло KD Capital визуализировать ценности и увлекательно представить проекты.
20. Fleava
Вы можете почерпнуть вдохновение на сайте диджитал-агентства Fleava, который презентует работы компании и позволяет в считанные секунды найти всю необходимую информацию.
Попробуйте регулярно изучать лучшие примеры дизайна сайтов, смотреть эстетически красивые фильмы и следовать сезонным трендам, чтобы быстро развить вкус в дизайне. Также посмотрите наши предыдущие подборки стильных сайтов от Awwwards:
Related Articles
Что на самом деле происходит в Украине?
Не закрывайте глаза на события в Украине, не молчите! Скажите НЕТ войне и кровопролитию!
Admin Среда, 02 марта 2022 13:00
Дизайн
20 лучших дизайнов сайтов 2021 года по версии Awwwards
Посмотрите подборку лучших сайтов, чтобы узнать о последних трендах в дизайне.
Anastasiya Mozgovaya Пятница, 26 ноября 2021 16:30
Новости и события Фотография
Победители фотоконкурса Depositphotos 2020
Готовы узнать, кто победил в первом фотоконкурсе Depositphotos?
Maria Sibirtseva Четверг, 01 октября 2020 16:10
Дизайн
Лучшие дизайны сайтов по версии Awwwards (2019)
Вы когда-нибудь слышали о книге Остина Клеона «Кради как художник»? Этот бестселлер, который стоит почитать всем творческим людям,…
Maria Sibirtseva Понедельник, 08 апреля 2019 10:00
Дизайн
Лучшие дизайны сайтов по версии Awwwards (2018)
С приходом виртуального мира в нашу жизнь многие привычные вещи тоже стали цифровыми. Мы общаемся в соцсетях, учимся…
Maria Sibirtseva Понедельник, 12 ноября 2018 10:00
Дизайн
В копилку веб-проекта: 20 красивых цветовых палитр сайтов
Цвет — одно из самых важных дизайнерских решений в веб-дизайне. Учитывая, как быстро люди выносят суждение о сайтах,…
Christina Holovach Среда, 27 июня 2018 16:23
Дизайн
Лучшие дизайны сайтов по версии Awwwards
Дизайнер вы, фотограф, маркетолог или работаете в сфере онлайн-коммерции, вам стоит быть в курсе последних трендов веб-дизайна. Поэтому…
yul Четверг, 25 января 2018 10:00
Дайджест блога Depositphotos
Присоединяйтесь к сообществу из 160,000 читателей, которые раз в месяц
получают подборку креативных фото, полезных советов и интересных историй.
Источник: blog.depositphotos.com
Тренды в веб-дизайне: что будет актуально в 2023 году
Чтобы завоевать внимание и лояльность потенциального клиента, бизнесу нужен удобный сайт с актуальным дизайном. В статье расскажем, как в 2023 году должен выглядеть современный сайт и какие тренды веб-дизайна будут популярны в ближайшее время.
Как пользователи формируют тренды
Тренды в веб-дизайне не возникают стихийно — их формируют ведущие компании в индустрии и сами пользователи. Чаще всего тренды в дизайне появляются в результате того, что мировые компании внедряют технологические инновации. Например, когда Apple представила экран Retina с повышенной плотностью пикселей, эта технология запустила тренд на сверхтонкие шрифты. На новых экранах такие шрифты могли отображаться без искажений и быстро завоевали популярность во всем мире.
Официальный сайт Apple до и после запуска технологии Retina
Приживется ли новый тренд, зависит от того, как его воспримут пользователи. Чаще всего на пользовательский опыт влияют три фактора: визуальное оформление сайта, скорость работы и адаптивность. Внешний вид сайта.
Исследование маркетинговой компании Blue Corona показало, что 38% пользователей уйдут с сайта, если посчитают дизайн непривлекательным или контент слишком сложным или скучным. При этом по статистике 75% пользователей судят о компании по тому, как выглядит ее сайт. Скорость работы. 47% пользователей хотят, чтобы сайт загружался за 2 секунды и меньше. Адаптивность.
Пользователи совершают 31% онлайн-покупок с мобильных устройств, при этом 90% клиентов предпочтут уйти к конкурентам, если опыт пользования сайтом оказался неудачным. Создавая сайты с современным дизайном, качественным контентом и адаптивностью к мобильным устройствам, компании повышают лояльность клиентов и в результате увеличивают свою прибыль.
Что будет популярно в создании сайтов в 2023 году
Зачастую тренды быстро появляются и набирают популярность, но так же быстро исчезают. Ориентируясь на такие скоротечные тенденции, бизнес рискует запустить сайт, который будет выглядеть устаревшим. Мы сосредоточимся на устойчивых трендах, которые, по мнению множества дизайн-студий, сохранят актуальность в ближайшие 1–2 года.
Новый минимализм
Это один из наиболее устойчивых трендов, которому следуют многие технологичные и digital-компании, например Apple или Tesla. Главные принципы минимализма — лаконичность, много свободного пространства и контрастность элементов дизайна. Минималистичное оформление помогает направить внимание пользователя на главное — текст и изображения. Такие сайты удобны и понятны, при этом выглядят эстетично и дорого.
Официальный сайт Tesla
Скрытая навигация. В минималистичном веб-дизайне часто используется скрытая навигация. Для этого основные ссылки прячут под иконками или кнопками — пользователю нужно кликнуть на них, чтобы увидеть меню и другие необходимые элементы. Если на сайте есть скрытая навигация, его дизайн должен быть интуитивно понятен, иначе есть риск ухудшить пользовательский опыт. При этом такой дизайн отлично подходит для мобильных версий сайта, так как на смартфонах размер экрана ограничен.
Сайт канадской студии авторских предметов интерьера Collage
Использование пустого пространства. Свободное пространство между элементами дизайна сайта позволяет управлять вниманием пользователя. Вы можете направить фокус на значимый контент: текст, изображение или заголовок.
Сайт бренда дизайнерской одежды Lyna+
Минималистичный первый экран. На первом экране находятся только изображение и заголовок. Это довольно спорный прием, который противоречит принципу размещать призыв к действию на первом экране. Тем не менее это выглядит эстетично и все чаще встречается в дизайне коммерческих сайтов.
Сайт мультимедийной студии hptx
Сайт дизайнерского бюро Ananev Architects
Анимация
В современном веб-дизайне большое внимание уделяется интерактивной анимации. Это анимация, которая основана на взаимодействии с пользователем. К ней относятся анимация пунктов меню и других кликабельных элементов, появление текста с эффектом fade-in, плавный скролл и т. д. Такие приемы создают ощущение объема и глубины пространства и погружают пользователя в атмосферу проекта.
Кроме того, динамичный контент с анимированными элементами привлекает больше аудитории и в результате лучше и быстрее продвигается. Параллакс-скроллинг. Главная особенность такого скроллинга — его интерактивность. При прокрутке сайт постоянно взаимодействует с пользователем. Например, при пролистывании запускается анимация, постепенно появляется текст и изображения или фоновая картинка проскальзывает вниз относительно контента.
Сайт агентства бренд-коммуникации «Кирпич»
Использование видеофона. Видео в качестве обложки сайта сразу привлекает внимание пользователя. В нем можно сообщить человеку информацию о проекте, чтобы с первых секунд пользователь мог понять, чем занимается компания и что его ждет на сайте. Такой фон можно использовать, например, на сайте ресторана. Вместо текстового описания за несколько секунд можно показать новинки меню, как блюда готовят на кухне или какие мероприятия проводят в заведении.
Сайт ресторана La Rotonda
Креативная типографика
В последнее время тренд на эксперименты с типографикой все больше набирает популярность. Этот прием привлекает внимание пользователя и позволяет с помощью текстовых элементов передать характер и настроение бренда. Сочетание шрифтов. Сочетание двух разнохарактерных шрифтов в одной фразе все чаще встречается на сайтах разных брендов. Кроме локального вкрапления другой гарнитуры, символы могут растягиваться, сжиматься или искажаться.
Сайт фотовыставки Inspired by My Jeans
Нестандартное расположение текста. Нестандартное положение текста, когда фразы расположены не по сетке, под углом, подойдет для креативных проектов. Например, анонса мероприятий или творческих обучающих курсов. Такой прием затрудняет чтение текста, поэтому с ним следует быть осторожнее и точечно применять в проектах, когда хочется выделить один из блоков.
Сайт издательства «МИФ»
3D-элементы
Тренд на 3D-объекты остается популярным уже несколько лет. Часто объемные элементы используются в качестве иконок, кнопок, иллюстраций на сайтах и в приложениях. Они выглядят нестандартно и хорошо привлекают внимание.
Но если раньше достаточно было просто использовать объемные фигуры в дизайне, чтобы сайт выглядел современно, то сейчас нужно использовать более сложные решения, например создавать анимированные 3D-объекты. В 2023 году модным стилем в 3D-иллюстрациях будет новый тренд — глиноморфизм. Чаще всего этот стиль подразумевает изображения забавных фигурок людей или объектов.
Для глиноморфизма характерны светлые, пастельные и яркие цвета, простые округлые формы, в основном цилиндры и овалы. Глубина создается с помощью внутренних и внешних теней. Этот минималистичный графический прием помогает придать проекту интерактивность. Сайты с подобным дизайном легко воспринимаются пользователями и транслируют дружелюбный тон бренда.
Источник: www.nic.ru
Каким должен быть сайт в 2023 году – ТОП 12 трендов
В настоящее время веб-индустрия переживает бум. Бизнес уходит в онлайн. Конкурентная борьба в интернете набирает обороты. И ее главным инструментом стал веб-дизайн. Популярные тренды определяют, каким должен быть сайт в 2023 году, чтобы задержать внимание пользователей и обеспечить преимущества.
О них мы и поговорим.
ТОП 12 трендов веб-дизайна
Первое впечатление о сайте производит его внешний вид. Уже потом, пользователь начинает разбираться в интерфейсе.
Сделать вывод о возможности дальнейшего изучения сайта, можно по следующим признакам:
- Скорость загрузки страницы, которая зависит не только от работы сервера, но и перегруженности декоративными элементами;
- Дружественная для пользователя цветовая гамма,
- Удобная типографика ,
- Наличие мельтешащей анимации
- и другие.
Популярность разных способов оформления сайтов зависит от страны, для которой изготавливается контент. Например, в Швеции может быть популярен скандинавский стиль, в Великобритании — элементы английской школы дизайна и так далее.
ЧИТАЙТЕ ТАКЖЕ |
![]() |
Но есть мировые тренды, которые так или иначе влияют на внешний вид сайтов всех стран. Их задают крупные IT компании и результаты исследований, построенные на пользовательском опыте.
О них и поговорим подробнее.
1. Минимализм
Минимализм – это один из главных трендов современного веб дизайна, который еще не скоро покинет данную нишу, так как именно он ставит главной целью – удобство и простоту.
Если ваш сайт нацелен на решение конкретных задач пользователей, за которыми они пришли – лучше сосредоточиться на повышении качества UI , а не на каких-то декоративных элементах. Это в первую очередь подходит для сайтов банков, финансовых организаций, инвестиционных площадок, медицинских учреждений и т.д.
Люди все больше пользуются услугами онлайн-площадок, проводят много времени за монитором, поэтому условия минимализма должны распространяться и на цветовую гамму сайта.
Выбранная цветовая схема должна упрощать восприятие информации
Предпочтение лучше отдать мягким, естественным цветовым палитрам, таким как:
- природный зеленый
- спокойные пастельные оттенки коричневого и голубого
- нейтральные серые оттенки
- бежевый и пудровые цвета
2. Типографика — как центральный элемент дизайна
Многие стремятся сделать типографику центральным элементом современного дизайна, что в принципе является оправданным так как текст является главным средством общения в интернете и он дает большое пространство для творческого потенциала.
Особенно, когда нужно передать очень много информации, как на сайте – известного кинематографиста. Обязательно откройте его и посмотрите на интересные параллакс эффекты .
Сайт Стенли Кубрика
Или еще один интересный пример на dribble, в котором хорошо сочетается типографика и параллакс эффект.
Крупная типографика в современных сайтах — это новое, являющееся хорошо забытым старым. Действительно, когда скорость интернета была мала, передача изображений труднодоступной, именно креативный крупный текст играл главную роль в расставлении акцентов.
Более подробно читайте в статье « Крупная типография — новый тренд в креативном веб дизайне «, где приведено еще больше примеров.
Пример использования крупной типографики в шапке сайта ( Dribbble )
3. Креативный скроллинг
Прокрутка или скроллинг — это один из главных инструментов взаимодействия пользователя с интерфейсом. В современном дизайне он должен быть не только простым, но и запоминающимся — креативным.
Под простотой имеется ввиду не то, насколько вам физически будет сложно прокрутить страницу, а то насколько интуитивно понятно ваш взгляд будет следить за потоком информации на ней.
В дизайне веб страницы должны быть интуитивно понятные точки, якоря, которые будут вести ваш взгляд дальше или, наоборот, останавливать. Эта задача решается, например, созданием единого фонового пространства, где каждый следующий элемент будет сочетаться с предыдущим, подхватывать изгиб линий и т.д.
Легко прокручивать страницу и изучать ее контент, когда весь сайт выполнен в едином стиле, центральным элементом которого является фон.
Так же легкой прокрутки можно добиться с помощью анимации, когда каждый последующий элемент, который должен увидеть пользователь будет появляться после предыдущего. Все в необходимом порядке, как в следующем проекте
Landing — Lakes wealth Loch by Outcrowd
Одним из трендов скроллинга на современном сайте является его трансформация. Когда элементы дизайна меняют свое положение или форму при движении мыши.
Визуальная обратная связь — вот на чем акцентируют внимание многие дизайнеры.
Еще один удачный пример такого взаимодействия графики с пользователем можно видеть ниже.
Tbilisi Gardens by Ana Miminoshvili
4. Смещенная сетка макета
Данному тренду нужно время, чтобы окончательно прижиться в веб-дизайне, но уже сейчас многие активно экспериментируют со смещением сеток макетов, а не используют стандартные.
5. Полуплоский дизайн и неоморфизм
В тренд входит разбавление привычного для нас плоского дизайна ( flat design ) тенями, что создает дополнительный объем, но не нарушает концепции минимализма. Лично я очень рада этому. Можно сочетать плоские объекты (фон, графика) с реалистичными объемными (промо продукция), как это сделано в примере ниже.
ЧИТАЙТЕ ТАКЖЕ |
![]() |
Или пойти по пути неоморфизма, когда происходит частичная имитация объема, за счет выборочных теней.
Неморфизм — это слияние двух тенденций — flat-дизайна и 3d дизайна
Как видите, сочетание полуплоского дизайна с тенями и фотореалистичного объекта дает интересный эффект.
6. Анимация
Анимация – это неоспоримо яркий и приковывающий внимание тренд дизайна современного сайта. Если анимация выполнена профессионально, то, конечно это сформирует положительный отклик пользователей.
И сейчас мы говорим об анимации, не как о части параллакс эффекта , а как об отдельно выполненном элементе. Но тут есть минусы – большой вес анимации вкупе с плохим интернетом может отпугнуть пользователей, не желающих долго ждать.
Встроенная в дизайн сайта анимация имеет смысл когда вы разрабатываете демонстративную промо страничку или сайт портфолио, как, например, это сделал Остин Майер . Но тогда лучше встраивать на такой сайт предзагрузчик (прелоудер), что позволит странице сначала подгрузить полностью все необходимые элементы, а затем уже показывать контент.
Сайт портфолио. Остин Майер
Еще одним трендом в веб-дизайне, который относится к анимации является синемаграфия , о которой у меня так же есть статьи на сайте.
Уже несколько лет популярны анимированные логотипы и такая тенденция сохранится в будущем. Компании идут на разные ухищрения, что бы обратить внимание на свой бренд, а дизайнеры им в этом помогают. Так, например, сервис Canva подготовил шаблоны для анимации логотипов.
Использовать шаблон Canva
Чаще всего достаточно сделать анимацию при загрузке первого экрана, чтобы не перегружать пользователя.
Ниже можно увидеть пример сайта, сочетающий в себе крупную типографику, анимацию и дуплексные цвета, речь о которых пойдет ниже.
7. Дуплексные цвета
Современным в веб дизайне стало использование двух цветов во всем сайте, что делает его невероятно стильным.
Fashion by Giga Tamarashvili.
8. Яркие цвета и их сочетания
Данный тренд зародился достаточно давно и еще надолго останется в индустрии веб-дизайна. Цветовые решения и их смелые сочетания вкупе с психологическими аспектами использования тех или иных оттенков способны сформировать у пользователей необходимую реакцию. Это положительным образом скажется на конверсиях, продажах и восприятии бренда в целом.
Clothes Shop by Yana
9. Иллюстрации
Они повсюду и просто атакуют интернет пространство. Этот тренд в веб дизайне пришел вместе в flat дизайном и завоевывает свое пространство все больше и больше. И теперь это не просто иконки, а персонажи, фоны и полное оформление страниц сайта.
ЧИТАЙТЕ ТАКЖЕ |
![]() |
10. Фотография и иллюстрация
Совмещение иллюстрации и фотографии — популярный тренд сегодня. Такая фотография не останется незамеченной, а значит оправдано ее использование в качестве демонстративного материала на современных сайтах. Подробнее читайте об этом в статье « Иллюстрация и фотография в Photoshop» , которая так же не оставит вас равнодушным!
Веб-дизайн шагнул еще дальше. Популярными стали анимационные вставки с совмещением фотографии и иллюстрации.
Использовать шаблон Canva
Комбинирование — один из трендов в дизайне современных сайтов, который останется с нами надолго. Причем эксперименты будут проводиться не только с цветами и формами, но и техниками подачи информации.
11. Креативная геометрия
Геометрические фигуры и креативные композиции из них становятся отличной альтернативой фотографии. Анимация с подобными объектами смотрится ярко и приковывает внимание пользователей. Огромный плюс — уменьшение веса изображений на сайте и как следствие ускорение его загрузки.
Примеры современного дизайна, основой которого являются геометрические фигуры, можно видеть ниже.
Portfolio Concept Design by Matvey Dunuk
Такой стиль вполне можно назвать голландским , ведь именно данное направление так привязано к геометрии и формам.
12. Глассморфизм
Данная концепция предполагает использование полупрозрачных размытых фонов и объектов. Одним из главных ее последователей является Apple.
Создается ощущение полупрозрачного стекла, от сюда и название — «glass» — стекло. Такая техника очень удобна по нескольким причинам:
- Смягчается контраст между светлыми и темными участками
- Текст и объекты легко просматриваются на ярком фоне
Пример создания плашки для элементов интерфейса в стиле «Глассморфизм», можно видеть в следующем видео:
Заключение
И в заключении приведу немного статистики. Согласно исследованиям, регулярно проводящимся в интернет сообществе, можно сделать вывод, что:
- 40% опрошенных не будут пользоваться сайтом с неопрятным видом;
- 95% пользователей не доверяют сайтам с плохим дизайном;
- 60% пользователей закроют сайт, интерфейс которого не стал им понятен в течение первых 15 секунд после открытия.
- 72% компаний в онлайн-пространстве собираются расширять штат веб-дизайнеров
ЧИТАЙТЕ ТАКЖЕ |
![]() |
Из вышесказанного можно сделать вывод, что…
Современный сайт для пользователей — это сочетание интуитивно-понятного интерфейса и дизайна, соответствующего популярным трендам
Задачей по созданию понятного интерфейса, занимаются UX/UI дизайнеры. Мы рассматривали данную тему в статье « Принципы UI успешного сайта. Часть 1 .» и будем далее раскрывать на страницах нашего блога.
Предлагаю посмотреть видео на тему трендов Ux/Ui дизайна в 2023 году от практикующего веб-мастера: