Divi 디자인 쇼케이스: 2020년 12월의 새로운 제출물

월간 Divi 쇼케이스에서는 커뮤니티 회원이 만든 10개의 놀라운 Divi 웹사이트를 살펴봅니다. 매달 우리는 커뮤니티에서 제출된 최고의 Divi 웹사이트를 선보이며 오늘은 12월 한 달 동안의 상위 10개 웹사이트를 공유하고자 합니다. 게시물 전체에서 각 웹 사이트로 나를 끌어들이는 내가 가장 좋아하는 디자인 기능 중 일부를 지적할 것입니다.

나는 당신이 그들을 좋아하기를 바랍니다!

Divi 디자인 쇼케이스: 2020년 12월의 새로운 제출물

1. 스튜디오 리네티

이 사이트는 Nicola Toffali가 제출했습니다. 이 사이트는 흥미로운 분할 화면 디자인을 사용합니다. 영웅 섹션의 왼쪽 절반은 스크롤하거나 주소 표시줄로 커서를 이동할 때 색상이 변경되는 배경 위에 큰 텍스트로 사이트 제목을 표시합니다. 오른쪽에는 흰색 배경 위에 빨간색 텍스트가 있습니다. 이 열은 섹션 내에서 스크롤할 수 있습니다. 열의 끝을 읽으면 섹션이 스크롤됩니다. 다음 두 섹션에는 한 면에 검정색 배경이 있고 다른 면에 흰색 배경이 있는 거의 전체 화면인 열이 교대로 배치되고 글꼴이 반대 색상으로 되어 있습니다. 마지막 섹션은 색이 변하는 배경 위에 유머러스한 전체 화면 메시지입니다. 이 디자인은 단순하고 동시에 흥미롭습니다.

웹사이트 방문

2. 카사 로카 아키테큐라

이 사이트는 Freddy Maldonado가 제출했습니다. 이 사이트에는 상자 그림자, 호버 애니메이션 및 노란색 강조 표시가 있는 겹치는 요소가 많이 포함되어 있습니다. 분할 화면 영웅 섹션 아래에는 이미지가 겹치고 CTA가 겹치는 한 면에 색상 블록이 있습니다. Blurbs는 작업 유형에 대한 정보를 제공합니다. 노란색의 간단한 아이콘이 있고 광고 문구의 모양이 약간 바뀌고 호버링 시 두꺼운 노란색 테두리가 나타납니다. 너무 화려하지 않으면서도 눈에 띄게 만듭니다. 내가 가장 좋아하는 섹션에는 Instagram 피드와 겹치는 이미지가 표시됩니다. 마우스를 가져가면 이미지가 위로 올라가 파란색 오버레이가 있는 설명이 표시됩니다. 접촉 부분도 흥미롭다. 작은 연락처 양식과 겹치는 노란색 상자에 연락처 정보가 표시됩니다.

웹사이트 방문

3. 고객캠프

이 사이트는 Sarah Hart가 제출했습니다. 팟캐스트 플레이어는 최신 에피소드와 함께 화면 하단에 고정됩니다. 보라색과 노란색은 배경, 버튼, 아이콘에 대한 사이트 전체의 브랜드 색상으로 사용되며 텍스트를 강조 표시합니다. 많은 개별 그래픽 요소가 섹션과 독립적으로 스크롤되어 스크롤 효과를 잘 활용합니다. 각 섹션은 화면을 잘 활용하여 CTA와 정보를 표시합니다. 특히 이미지 주위에 평가가 표시되는 방식이 마음에 듭니다. 이것은 평가 섹션 레이아웃의 맨 아래에 함께 제공됩니다. GIF가 몇 개 있지만 산만해질 정도로 많지는 않습니다. 이 사이트는 색상, 스크롤 효과 및 겹치는 요소를 잘 활용합니다.

웹사이트 방문

4. 살아있는 서비스 GmbH

이 사이트는 Markus Behmann이 제출했습니다. 이 사이트는 아이콘, 버튼, 배경 및 호버 효과의 하이라이트로 파란색을 많이 사용합니다. 메뉴는 링크에 애니메이션 호버 효과를 사용합니다. 영웅 섹션에는 상단과 하단 모두에 스타일이 지정된 구분선이 있는 비디오가 표시됩니다. 이것은 특히 헤더에서 우아한 분리를 제공하고 눈에 띄는 데 도움이 됩니다. 내가 가장 좋아하는 섹션에는 서비스에 대한 흥미로운 문구가 표시됩니다. 광고 문구에는 이미지와 콘텐츠를 겹치는 버튼이 포함됩니다. 광고 문구 자체는 위에 있는 행과 겹치며 위 또는 아래로 스크롤할 때 가로로 이동합니다. 이 섹션에는 첫 번째 섹션과 일치하고 함께 묶는 물결 모양의 칸막이도 포함되어 있습니다. 레이아웃은 깨끗하고 우아합니다.

웹사이트 방문

5. 건축가 및 EMU 건설

이 사이트는 Abdy Designburo에 의해 제출되었습니다. 버튼의 로고, 배경 및 테두리를 포함하여 사이트 전체에 브랜드 색상으로 녹색을 사용합니다. 영웅 섹션은 스타일을 주기 위해 원형 패턴이 있는 한 면에 녹색 배경을 사용합니다. 탐색 메뉴의 배경은 투명하여 녹색이 한쪽으로 비쳐 보일 수 있습니다. 스크롤하면 메뉴의 텍스트와 배경색이 바뀝니다. 나는 흰색 배경과 떨어져 있고 원형 패턴을 포함하는 밝은 회색 배경 위에 버튼이 있는 정보를 배치하는 CTA를 좋아합니다. 눈에 띄도록 이미지가 겹쳐집니다. 회색 원 패턴은 배경에 질감을 주기 위해 여러 곳에서 사용됩니다.

웹사이트 방문

6. 디지털 스트라이드

이 사이트는 Douglas Henrique가 제출했습니다. 이것은 사이트 전체에 많은 공백이 있는 깨끗한 레이아웃을 사용합니다. 파란색과 노란색 하이라이트는 버튼, 아이콘, 글꼴, 배경 및 기타 그래픽 요소에 사용됩니다. 제목은 작고 버튼처럼 보이지만 제대로 눈에 띕니다. CTA는 한쪽에는 손으로 그린 ​​그래픽을 표시하고 다른 한쪽에는 텍스트를 표시합니다. 그래픽은 웹 사이트에 완벽하게 작동하는 만화 같은 디자인을 가지고 있습니다. 특히 파란색 배경에 정보와 함께 제목과 설명이 포함된 성공 사례와 다음 섹션이 겹치는 작업 이미지가 마음에 듭니다. 성공 사례에 대한 페이지는 유사한 디자인을 따릅니다. 레이아웃은 단순하지만 색상의 균형이 잘 잡혀 있습니다.

웹사이트 방문

7. 아침에 완두콩

이 사이트는 Monica Higgins가 제출했습니다. 이것은 배경, 텍스트 및 하이라이트에 분홍색, 짙은 녹색 및 금색을 많이 사용하고 사이트 전체에 스크롤 효과를 많이 사용합니다. 마우스 커서를 스타일이 지정된 펜 끝으로 변경합니다. 영웅 섹션은 다음 섹션과 겹치는 분홍색 행을 표시합니다. 나는 서비스를 보여주기 위해 이미지를 좋아합니다. 각 이미지는 화면에 텍스트가 있거나 인쇄되는 오래된 하드웨어입니다. 페이지를 아래로 스크롤하면 텍스트가 스크롤됩니다. 작업의 예는 금색 테두리가 있는 분홍색 배경을 포함하는 두 개의 열이 있는 섹션에 표시됩니다. 작품의 이미지는 오래된 TV 화면, 웹 브라우저 또는 그래픽으로 배치됩니다. 각 그래픽 요소는 스크롤 효과를 사용합니다. 이 사이트는 색상과 이미지를 잘 활용합니다.

웹사이트 방문

8. 헤이 프레스토!

이 사이트는 James Middleditch가 제출했습니다. 사이트 전체에 사진과 스크롤 효과가 많은 브랜드 색상으로 우아한 녹색을 사용합니다. 영웅 섹션은 흐리게 처리된 배경 비디오를 재생하지만 사이트가 무엇인지 이해하기에 충분합니다. 제목과 태그라인은 사이트를 소개합니다. 음식 이미지에는 스크롤할 때 페이드 아웃되는 오버레이가 포함됩니다. 이미지에 대한 태그는 동양 테마에 맞게 다양한 색상으로 되어 있습니다. 정보를 제공하는 문구는 스크롤할 때 측면에서 제자리로 이동하고 CTA가 있는 유사한 섹션이 뒤따릅니다. 많은 그림과 이미지가 사이트 가장자리를 구성하는 데 도움이 됩니다. 베스트셀러 섹션에는 여러 옵션이 있는 제품이 포함됩니다. 이 사이트에는 스타일이 지정된 스크롤 막대도 포함되어 있습니다. 이 사이트의 색상과 이미지가 마음에 듭니다.

웹사이트 방문

9. MVMNT

이 사이트는 Simon Frost가 제출했습니다. 영웅 섹션에는 재생 빈도와 필터가 있는 전체 화면 비디오가 표시되며, 내 눈에는 구형 디지털 영화 프로젝터처럼 보이지만 전경의 텍스트는 몇 초마다 메시지를 변경하기 위해 뒤집힙니다. 대체 레이아웃의 넓은 이미지가 있는 흥미로운 섹션은 회사에 대한 정보로 연결되는 이미지 위에 제목을 표시합니다. 이미지에는 호버 효과가 포함됩니다. 블로그 게시물에는 발췌문을 표시하는 여러 태그와 오버레이가 포함됩니다. 밝은 파란색과 분홍색은 브랜드 색상에 사용되며 제목에 밑줄을 긋는 데 자주 사용됩니다. 각 페이지는 유사한 디자인을 따르며 일부 제목 뒤에 검은색 배경을 포함합니다. 이 사이트는 색상과 배경을 세련되게 사용합니다.

웹사이트 방문

10. 르 콤부차

이 사이트는 Florent Noel이 제출했습니다. 이것은 사이트 전체에서 흥미로운 그래픽을 많이 사용합니다. 배경, 버튼 및 뒤로 가기 버튼에 나타나는 브랜드 색상에 대해 주로 밝은 노란색과 밝은 녹색을 사용합니다. 배경 그래픽은 거품으로 음료를 만들고 주변 섹션에서 돋보이도록 물결 모양의 가장자리를 포함합니다. 사이트 전체의 다른 그래픽과 이미지에는 잔과 물병에 담긴 음료가 표시됩니다. 그래픽이 있는 사용자는 한 면에 그래픽을 배치하고 다른 면에 텍스트를 배치하여 CTA를 만듭니다. 이들은 교대로 배치됩니다. 정보는 여러 색상의 아이콘으로 안내문 안에 표시됩니다. 스크롤하면 모든 이미지와 그래픽이 제자리로 미끄러지거나 뒤집힙니다.

웹사이트 방문

마감 중

12월 한 달 동안 최고의 커뮤니티 Divi 웹사이트 제출물 10개입니다. 이 사이트는 정말 멋져보이며 언제나처럼 제출해 주신 모든 분들께 감사드립니다!

자신만의 디자인을 고려하고 싶으시다면 언제든지 우아한 테마 닷컴의 nathan 편집자에게 이메일을 보내주십시오. 이메일 제목은 "DIVI SITE SUBMISSION"으로 하십시오.

우리는 또한 당신의 의견을 듣고 싶습니다! 이 웹사이트에 대해 마음에 드는 점과 웹사이트에서 수행한 작업이 있으면 블로그에서 가르치고 싶은 내용을 알려주십시오.

bellenixe/Shutterstock.com을 통한 추천 이미지