Примеры дизайна сайтов с восприятием глубины

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

Существует несколько способов моделирования восприятия глубины, чаще всего используются:

  • Естественная глубина ландшафтов;
  • Полигональный арт, который создает выпуклые и вогнутые области;
  • Манипулирование фоновыми изображениями;
  • Сочетание теней и света;
  • Фокус;
  • Перспектива;
  • Цифровой коллаж;
  • Настройки скевоморфизма;
  • Несколько слоев;
  • Обработка типографии;
  • И конечно различные иллюстрации с 3-мерным видом;

Не стесняйтесь дополнить этот список в комментариях, поделитесь с нами своими методоми.

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

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

Oakley Airbrake MX разработан в виде земли с различными камнями, которые разбросаны по всему сайту.

Mokhtar SAGHAFI удивительно использует полигональный арт, который воссоздает ощущение выпуклости, благодаря этому фон выглядит 3-мерно.

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

Teapot представляет собой легкий веб-сайт с элегантным изысканным внешним видом, который использует реалистичные фоновые фотографии.

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

Flash vs HTML очаровывает зрителей великолепным космическим тематическим дизайном, который содержит простые, но действительно полезные фоновые анимации.

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

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

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

Handy Pick является еще одним успешным экспериментом с фокусировкой и размытием объектов, которые взаимодействуют друг с другом.

3magine содержит очаровательный слайдер изображений, который использует стиль сквевоморфизма - деревянная полка в качестве фона.

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

Brick Art демонстрирует аллеи с деревьями в стиле Lego. Несомненно, целевая страница имеет глубокий внешний вид, хотя чрезмерно заполненный фон выглядит несколько более тяжелым, что иногда влияет на восприятие глубины.

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

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

Outdoor Bergen красиво реализована природа на каждом фоновом изображении, используя размытие или фокус, чтобы добавить восприятие глубины.

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

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

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

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

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

 

Перевод статьи Website Designs with Depth Perception: Wonderful Examples

Вход

Уважаемый пользователь! Мы обнаружили, что вы используете AdBlock и вынуждены скрыть часть материалов на нашем сайте. Siteacademy существует и развивается за счет доходов от рекламы. Просим внести наш сайт в список исключений или отключить Блокировщик рекламы на нашем сайте.