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

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

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

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

1. Боты против минусов

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

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

2. Матч-дизайн СМИ

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

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

3. Свойство Pop

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

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

4. Родина

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

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

5. ChangeUp на благотворительность

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

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

6. Реббл

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

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

7. Молодежь, говорите!

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

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

8. AWEOS

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

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

9. Марси Анхелес

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

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

10. ATG Europe

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

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

Заключение

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

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

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

Изображение функции через ProStockStudio / shutterstock.com