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

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

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

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

1. Престон Смайлс

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

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

2. WebDevXd

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

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

3. Муни

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

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

4. САМКАРА

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

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

5. Страхование буфера

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

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

6. Кёрли

Этот сайт был представлен Антеей А. Анкаладом. В разделе героев отображается полноэкранное фоновое изображение с полем поиска в центре, которое позволяет вам выбрать местоположение или использовать ваше текущее местоположение. Службы отображаются с изображениями, которые включают заголовки и оверлеи рядом с призывом к действию. Рекомендуемые стили отображаются в слайдере с 6 столбцами и включают изображение, заголовок, рейтинг в звездах и местоположение. Ползунок включает как стрелочную, так и точечную навигацию. Щелкнув один из стилей, вы попадете на страницу его продукта. Новые стили отображаются в 6 столбцах, но без ползунка. В разделе блога отображаются два последних сообщения и помещается строка под сообщениями со ссылкой, чтобы увидеть больше под строкой. Учебники из блога размещены в трех столбцах и построены по одному дизайну. Он также включает в себя канал Instagram с 6 столбцами и 2 строками и нижний колонтитул со стилизованной формой электронной почты.

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

7. Типогения

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

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

8. Бушкрафтер

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

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

9. KWALT Digital

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

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

10. Exploruns

Этот сайт был представлен Авой Шарпантье. Для фирменных цветов используется множество оттенков загара. Верхняя панель исчезает при прокрутке, логотип перекрывает заголовок и раздел героя, а заголовок включает анимацию наведения. Основное изображение отображает заголовок, описание и кнопку для размещения заказа. Другое изображение помещается в виде окна на изображение героя с истинным параллаксом. Информация отображается в виде размытых изображений с настраиваемой графикой. Продукты показаны с цветом фона за верхней частью изображения продукта. Аналогичное оформление фона используется для раздела блога. CTA читать о компании отображает текст с одной стороны и изображение с другой. Отзывы представлены в виде карточек с цитатой вверху на белом фоне и именем внизу на коричневом фоне. Сайт также включает в себя ленту Instagram и настраиваемый нижний колонтитул с анимацией наведения.

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

В заключение

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

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

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

Избранные изображения через domonku / shutterstock.com