Эффект дымчатого перехода: начало нового тренда?

 

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

 

Сайт компании Sevenhills Wholefoods

Sevenhills Wholefoods – это рынок фермерских продуктов питания, который предлагает своим клиентам изменить пищевые привычки и перейти на здоровое питание. И в качестве самого лучшего варианта презентации своего продукта они выбрали формат рассказа истории. Они создали серию рассказов о продуктах, которые наглядно демонстрируют, как покупатель сможет приготовить каждый продукт. Но нас привлекло то, как они реализовали свою задумку. Каждый раз, когда вы переходите на ссылку «Начать путешествие», включается эффект дымчатого перехода, который запускает два варианта рассказа истории на ваш выбор.

 

Создатели сайта выиграли награду Сайт Дня (Site of the Day) и награду Разработчикам (Developer Award) от Awwwards.com, награды Сайт Дня (Site of the Day) от theFWA.com и Сайт Дня (Site of the Day) от cssdesignawards.com.

 

Робин Мастромарино

Robin Mastromarino – это UX/UI-дизайнер из Франции, у которого просто отличный сайт, презентующий его работы. Это наш любимый сайт не только потому, что у него очень целенаправленный дизайн, но и потому, что он доказал одну вещь: эффект дымчатого перехода просто отличная находка в дизайне, и Робин профессионал в его применении.
Робин Мастромарино выиграл награды Сайт Дня (Site of the Day) от awwwards.com, Мобильный сайт недели (Mobile of the Day) от theFWA.com, Сайт Дня (Site of the Day) от cssdesignawards.com, Сайт Дня (Site of the Day) от cssawds.com.

 

Trainrobber

Можно сказать, что здесь использованы «дымчатые переходы на стероидах»: параллакс-навигация и много-много дыма.
Создатели сайта выиграли награды Сайт Дня (Site of the Day) от awwwards.com и Сайт Дня (Site of the Day) от theFWA.com.

 

Cavalier

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

 

Для особо интересующихся, приводим список того, что они использовали для создания этого эффекта: HTML5, CSS3, WebGL, Pixi, JavaScript, three.js, SVG animation, bodymovin.js, howler.js, 3D audio, WebAudio, GSAP.

 

Они обладатели премий Сайт Дня (Site of the Day) от awwwards.com, Сайт Дня (Site of the Day) от theFWA.com и Сайт Дня (Site of the Day) от cssdesignawards.com.

 

National Geographic

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

 
И что же объединяет все веб-сайты, которые мы перечислили? Правильно! Все они выиграли кучу наград.

 
Понравилась наша статья, поделитесь с друзьями!

 

Удачи в бизнесе, ваш Mindrepublic.ru
 

Comments

comments

Text_2Бывают ли хорошие сайты по низкой цене
Text_2Создание сайта от планирования до запуска. Что скрывается за удобным сайтом?
Text_2Веб студия или фрилансер. Выбираем где заказать сайт.
Text_2Заказать лендинг Составляющие идеальной лендинг пейдж.