Витрина дизайна Divi: новые заявки с января 2020 года

Опубликовано: 2020-01-31

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

Я надеюсь, они тебе нравятся!

Витрина дизайна Divi: новые заявки с января 2020 года

1. Альтмонде

Этот сайт был представлен Дэниелом Беренсом. Он отображает полноэкранное фоновое видео со слоганом и призывом к действию на переднем плане. После этого идет полноэкранный раздел с заголовком с эффектами наведения, чтобы представить следующий раздел, который отображается с параллаксом, когда вы прокручиваете заголовок. В этом разделе заголовки отображаются крупным текстом с эффектами наведения с одной стороны и призывом к действию с другой. В следующем разделе представлена ​​информация о том, как они работают с клиентами. Это включает белый фон с диагональным рисунком и пронумерованный текст, который расширяется при наведении курсора. Другой призыв к действию увеличивается и уменьшается при прокрутке. На странице «Службы» каждая служба отображается на разделенном экране с призывом к действию с одной стороны и фоновыми изображениями в параллаксе с другой. Мне нравится использование текста, цвета и изображений на этом сайте.

Посетить сайт

2. Вемель

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

Посетить сайт

3. Пругнера

Этот сайт был предоставлен RAPHAEL PRUGNER. Это одностраничный дизайн. Многослойное меню располагается отдельно от страницы и показывает интерактивный номер телефона над социальными кнопками рядом с призывом к действию. Раздел героев показывает полноэкранный фоновый узор, в то время как передний план показывает экран компьютера с примером работы и показывает еще больше при наведении курсора рядом с заголовком и слоганом. При прокрутке отображается вырез с текстом и графикой, которые прокручиваются по фоновому изображению с параллаксом. Преимущества отображаются в рекламных объявлениях в чередующемся макете по сравнению с несколькими разделами и включают эффекты масштабирования при наведении курсора. Примеры проектов отображаются в слайдере. Другие проекты отображаются во встроенной ленте Instagram. Он также показывает призыв к действию, масштабируемый при прокрутке, и стилизованную контактную форму.

Посетить сайт

4. Пурпурный лемур

Этот сайт был представлен Лиамом Педли. Название, слоган, CTA и пример изображения продукта с фирменным изображением лемура расположены на черном фоне, на котором есть разделитель с закругленными углами. Текст и кнопки имеют фиолетовый градиент, который соответствует графике на всем сайте. Ряд с тремя изображениями лемуров помещен над разделом, который показывает текст и аннотации. При нажатии на лемуров отображаются различные разделы информации со стрелкой, указывающей на раздел. Информация о компании отображается в разделе из двух столбцов, с одной стороны экрана компьютера, на котором отображается фоновое изображение с истинным параллаксом. Особенно мне нравится раздел портфолио. Он показывает изображения под углом. При наведении курсора на любой из них изображение поднимается вверх и к экрану, оставляя за собой цветные слайды. Ползунок с отзывами показывает одновременно три стороны: одна в центре плоская, а две другие расположены под углом. Он также включает стилизованные карточки блогов и рекламные объявления с анимацией наведения для каждой из служб.

Посетить сайт

5. Дшеммесид

Этот сайт был представлен Дэвидом Сильвестом. Он отображает фон с темно-синим оверлеем, закругленным разделителем раздела и большим заголовком в центре. Заголовок разместил меню в центре и включает стилизованный фон с градиентом и закругленными углами. Я люблю следующий спектакль. Показаны примеры работы с тремя наклоненными картами. Две по бокам расположены под углом внутрь. Они включают эффекты наведения. В следующем разделе показан призыв к действию с компьютерными мониторами под углом и узорчатым фоном. В разделе преимуществ показаны маркированные точки с большими размытыми точками рядом с изображением шестеренок. Сайт также включает в себя множество CTA со стилизованными значками и изображениями в кружках, изображение разработчика в кружке, раздел часто задаваемых вопросов с переключателями и стилизованную контактную форму. Макет отлично использует цвет, графику и изображения.

Посетить сайт

6. Карьера на Zipline

Этот сайт был представлен Николь Мари Зиннанти. На сайте используется много белого пространства с нужным количеством фиолетовой графики и выделений. Раздел героев показывает CTA с одной стороны и график людей, создающих резюме, с другой. В следующем разделе показаны сервисы внутри blubs, использующие фиолетовую и белую графику, а также фиолетовые границы и тени. Встроенное видео помещается поверх фонового рисунка, который показывает точки в верхней половине слева и в нижней половине справа. Размытые значки со стилизованными значками демонстрируют преимущества четкого макета из трех столбцов. Дизайн также включает призыв к действию с графикой, стилизованный раздел блога и призыв к действию с кнопками для создания настраиваемого нижнего колонтитула. Мне тоже нравится блог. Он отображает полную графику в заголовке с диагональным разделителем, а затем карточки блога в чистой сетке.

Посетить сайт

7. Центр поддержки усыновления в Саскачеване

Этот сайт был представлен Молли Ситон-Фаст. Он показывает полноразмерное изображение играющих детей и три текстовых модуля для создания больших кнопок для навигации. Каждая из кнопок имеет закругленные крышки, которые становятся выше и имеют квадратные углы при наведении курсора. Пятна с частичными границами создают ссылки на определенные темы. Информация представлена ​​в разделе буксирной колонки с аннотациями и призывом к действию с одной стороны и гармошкой с другой. CTA для пожертвований вписывается в раздел списка рассылки. В каждом из разделов используются соответствующие стилизованные цвета и фоновые рисунки. На странице событий есть встроенный календарь событий. На странице пожертвований есть встроенный ящик для пожертвований. На сайте есть много информации, которой можно поделиться, а меню позволяет максимально аккуратно перемещаться по ней.

Посетить сайт

8. Нанаймо-Хайтс

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

Посетить сайт

9. Больше, чем несколько слов

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

Посетить сайт

10. Институт молодых лидеров Негросанон

Этот сайт был представлен JR Galia. В разделе «Герой» отображается полноразмерное фоновое изображение с заголовком и призывом к действию в наложении. В меню навигации также отображается призыв к действию и меню в отдельном сегменте. В разделе программ отображаются карточки с кнопками пожертвований. Мне особенно нравится раздел «Участвуй». Он отображает большое изображение с одной стороны и размывает графику с другой. Макет также включает счетчики номеров и стилизованную форму обратной связи. Страницы «О нас», «Блог» и «Галерея» имеют схожий дизайн и добавляют сплошную тень к модулям текста, блога и галереи.

Посетить сайт

Заключение

Это наши 10 лучших материалов для веб-сайта Divi за январь. Эти сайты выглядят потрясающе, и, как всегда, мы хотим поблагодарить всех за ваши предложения!

Если вы хотите, чтобы ваш собственный дизайн был рассмотрен, пожалуйста, напишите нашему редактору Натан по адресу Elegant themes dot com. Убедитесь, что в теме письма указано «ПОДАЧА САЙТА ДИВИ».

Мы также хотели бы услышать ваше мнение в комментариях! Расскажите нам, что вам нравится в этих веб-сайтах, и если есть что-то, что они сделали, вы хотите, чтобы мы учили в этом блоге.

Лучшее изображение через ProStockStudio / shutterstock.com