Divi Design Showcase: ผลงานใหม่ตั้งแต่เดือนเมษายน 2019

ถึงเวลาอีกครั้งสำหรับ Divi Showcase รายเดือนของเราที่เรามาดูเว็บไซต์ Divi ที่น่าทึ่ง 10 แห่งที่สร้างโดยสมาชิกชุมชนของเรา ในแต่ละเดือน เราแสดงเว็บไซต์ Divi ที่ดีที่สุดที่ส่งมาจากชุมชนของเรา และวันนี้เราต้องการแบ่งปันเว็บไซต์สิบอันดับแรกในเดือนเมษายนกับคุณ ตลอดทั้งโพสต์ ฉันจะชี้ให้เห็นคุณสมบัติการออกแบบที่ฉันโปรดปรานซึ่งดึงดูดฉันให้ไปที่แต่ละเว็บไซต์

ฉันหวังว่าคุณจะชอบพวกเขา!

Divi Design Showcase: ผลงานใหม่ตั้งแต่เดือนเมษายน 2019

1. มหาวิทยาลัยโมชั่น

ไซต์นี้ส่งโดย Andrew Bartlett เว็บไซต์ใช้พื้นหลังสีเข้มพร้อมข้อความสีขาวที่มีไฮไลท์สีเหลืองและสีส้ม (ในทางเทคนิคแล้วจะเป็นสีน้ำตาลสกปรก) ภาพพื้นหลังทั้งหมดมืด ส่วนฮีโร่แสดงภาพพื้นหลังที่อธิบายไซต์ ข้อความในโอเวอร์เลย์มีสโลแกนและ CTA ทางด้านซ้ายและปุ่มเล่นทางด้านขวา ปุ่มเล่นจะเปลี่ยนเมื่อวางเมาส์เหนือและเปิดวิดีโอในป๊อปอัปเมื่อคลิก ส่วนอื่นๆ แสดงข้อมูลในสองคอลัมน์พร้อมข้อความและรูปภาพ เค้าโครงจะสลับกันเมื่อคุณเลื่อน ระหว่างส่วนต่างๆ มีภาพขนาดย่อขนาดเล็กพร้อมบอลลูนคำพูดสำหรับคำรับรอง CTA แบบเต็มความกว้างให้รูปภาพพร้อมแบบฟอร์มการสมัครสมาชิก ลูกโป่งคำพูดรับรองเพิ่มเติมจะสร้างส่วนท้ายที่เปิดเผย

เข้าไปดูในเว็บไซต์

2. เจดี ดีไซน์

เว็บไซต์นี้ถูกส่งโดย James Dawson จะแสดงแถบเลื่อนแบบเต็มหน้าจอพร้อมภาพพื้นหลังและภาพซ้อนทับที่มืด โอเวอร์เลย์ใช้ข้อความขนาดใหญ่เพื่ออธิบายไซต์และจัดทำ CTA การเลื่อนเผยให้เห็นส่วนอื่นที่มีข้อความขนาดใหญ่บนพื้นหลังสีขาวที่อธิบายถึงบริษัท บริการจะแสดงเป็นข้อความโดยมีจุดคั่นระหว่างชื่อและคำอธิบายที่น่าสนใจ ส่วนพอร์ตโฟลิโอแสดงภาพที่มีการซ้อนทับ ส่วนนี้ใช้ตัวแบ่งส่วนหยักและพื้นหลังสีเทาที่โดดเด่นพอจากส่วนที่เหลือของเลย์เอาต์ ส่วนอื่นๆ อีกหลายส่วนใช้การออกแบบนี้แต่มีพื้นหลังสีน้ำเงิน ฉันชอบส่วนที่มีโลโก้ลูกค้าขนาดใหญ่เป็นพิเศษ พวกเขากำลังแสดงเป็นสีเทาเข้มในสี่คอลัมน์

เข้าไปดูในเว็บไซต์

3. สวอช

เว็บไซต์นี้ส่งโดย Daniel Neumann ไซต์แสดงพื้นหลังแบบเต็มหน้าจอโดยมีภาพซ้อนทับสีน้ำเงินเข้มและ CTA เป็นข้อความสีขาวที่ด้านหนึ่ง บริการจะแสดงเป็นข้อความพร้อมกล่องเงาและไอคอนเคลื่อนไหว รูปแบบพื้นหลังสามารถมองเห็นได้ผ่านการนำเสนอ การโฮเวอร์จะเพิ่มเอฟเฟกต์เงาของกล่องเพื่อให้โดดเด่นและทำให้เบลออย่างสมบูรณ์ ส่วนแบบสองคอลัมน์หลายส่วนสลับเลย์เอาต์ด้วยข้อความด้านหนึ่งและรูปภาพอีกด้านหนึ่ง ข้อความในส่วนเหล่านี้จะแสดงไอคอนเคลื่อนไหวและข้อความที่เน้นสี หน้าการกำหนดราคาใช้ประโยชน์จากการออกแบบสีน้ำเงินและสีขาวที่เรียบง่ายพร้อมตารางราคาสีขาวได้อย่างดีเยี่ยม ฉันชอบแสงสีแดงจากปุ่มของตารางราคา ไฮไลท์สีแดงให้สีเพียงพอและโดดเด่นอย่างสมบูรณ์แบบ

เข้าไปดูในเว็บไซต์

4. เครื่องมือ HH

เว็บไซต์นี้ส่งโดย Mathias Rue ไซต์ใช้พื้นหลังไล่ระดับสีส้มถึงแดงพร้อมไอคอนเพื่อสร้างการออกแบบทางวิศวกรรม โอเวอร์เลย์จะแสดงข้อมูลบริษัท ปุ่ม และคุณลักษณะการค้นหาที่ด้านหนึ่งและแบบฟอร์มการติดต่ออีกด้านหนึ่ง เมนูแบบเลื่อนลงมีปุ่มเต็มความกว้างในหน้าติดต่อ โลโก้พันธมิตรจะแสดงในแถบเลื่อนพร้อมลิงก์ไปยังหน้าของซัพพลายเออร์ Blurbs ใช้สำหรับลิงก์ไปยังบริการและข้อมูล ประกอบด้วยรูปภาพ 2 สีเป็นไอคอน และมีเส้นขอบที่น่าสนใจเพื่อทำให้ข้อความแจ้งความโดดเด่น ส่วนสำหรับการอ้างอิงใช้การออกแบบที่คล้ายกัน แต่มีขนาดใหญ่กว่ามากและมีโลโก้ลูกค้าสำหรับรูปภาพ การออกแบบนี้ยังใช้สำหรับส่วนบล็อก เลย์เอาต์ยังรวมบทความที่ฝังไว้จาก LinkedIn บนพื้นหลังเดียวกันกับส่วนฮีโร่

เข้าไปดูในเว็บไซต์

5. IQ Animation Studio

เว็บไซต์นี้ถูกส่งโดย Saurabh Patil ส่วนฮีโร่แสดงสโลแกน ข้อมูล และ CTA ที่ด้านหนึ่งและกราฟิกแบบเคลื่อนไหวที่อีกด้านหนึ่งเหนือการไล่ระดับสีพื้นหลังสีน้ำเงินเข้ม กราฟิคแอนิเมชั่นดูสนุก ฉันต้องการเครื่องจ่ายกาแฟอย่างใดอย่างหนึ่งเหล่านี้ สีน้ำเงินเข้มยิ่งขึ้นไปอีกสำหรับพื้นหลังที่เหลือและสำหรับปุ่มต่างๆ คำประกาศสี่คอลัมน์แสดงไอคอนเคลื่อนไหวพร้อมชื่อ พวกเขาใช้พื้นหลังสีน้ำเงินเข้มและเส้นขอบสีเทาที่สว่างพอที่จะแยกจากกัน การวางเมาส์เหนือข้อความแจ้งจะเปลี่ยนพื้นหลังเป็นสีส้ม การออกแบบที่คล้ายกันนี้ใช้สำหรับการนำเสนออื่นๆ ที่ให้ข้อมูล ส่วนที่น่าสนใจเกี่ยวกับการแสดงแอนิเมชั่นเหนืออาร์ตเวิร์กสุดเจ๋งในรูปแบบพารัลแลกซ์ หน้าดังกล่าวยังแสดงแอนิเมชั่นการโหลดที่ยอดเยี่ยมอีกด้วย

เข้าไปดูในเว็บไซต์

6. นางสาวอนุบาล

เว็บไซต์นี้ถูกส่งโดย Chris Cadalzo เว็บไซต์จะแสดงโลโก้ขนาดใหญ่พิเศษตรงกลางใต้เมนู ส่วนถัดไปใช้ตัวคั่นส่วนที่เป็นคลื่นสำหรับด้านบนและด้านล่าง โดยแต่ละส่วนมีการออกแบบที่แตกต่างกันและมีสีพื้นหลังหลายเฉด ส่วนนี้ยังแสดงหัวข้อเป็นภาพสี่เหลี่ยมจัตุรัสที่ซูมออกและเปลี่ยนเส้นขอบเมื่อวางเมาส์เหนือ ส่วนสำหรับทรัพยากรและส่วนบล็อก (แต่มีรูปภาพที่สูงกว่า) ใช้การออกแบบเดียวกันนี้ ส่วนเกี่ยวกับจะแสดงเจ้าของไซต์ในรูปวงกลมและรูปแบบแบบอักษรสคริปต์เดียวกันกับโลโก้ แบบฟอร์มลงทะเบียนจะแสดง freebie พร้อมฟอนต์สคริปต์สำหรับชื่อเรื่อง บล็อกและแถบด้านข้างยังได้รับการออกแบบให้เข้ากับการออกแบบตราสินค้าของเว็บไซต์อีกด้วย

เข้าไปดูในเว็บไซต์

7. เดลเมน

เว็บไซต์นี้ส่งโดย Jake Braaught พื้นหลังวิดีโอเล่นหลังโอเวอร์เลย์ด้วยสโลแกน การเลื่อนจะแสดงไอคอนหลากสีสำหรับบริการสำหรับลูกค้าบางประเภท ส่วนบริการที่คล้ายกันจะแสดงที่ด้านล่างของหน้า ข้อความรับรองจะแสดงแบบเต็มความกว้างบนพื้นหลังสีเขียวพร้อมตัวแบ่งส่วนที่ทำมุม ส่วนนี้โดดเด่นอย่างสมบูรณ์แบบ ข้อความรับรองส่วนใหญ่จะปรากฏที่ด้านล่างของเลย์เอาต์ในหลายคอลัมน์โดยสลับสีและรูปภาพที่มีสไตล์ หลายส่วนแสดงเรื่องราวของลูกค้าด้วยวิดีโอและสถิติที่ฝังอยู่ในข้อความขนาดใหญ่และลิงก์สำหรับข้อมูลเพิ่มเติม รูปภาพสำหรับวิดีโอแสดงเว็บไซต์บนอุปกรณ์หลายเครื่อง ใกล้ส่วนท้ายเริ่มต้นด้วยภูเขาในพารัลแลกซ์หลังคัตเอาท์ภูเขา แบบฟอร์มการติดต่อที่มีตัวแบ่งส่วนที่ทำมุม และส่วนที่แสดงโลโก้ของไซต์ตรวจสอบพร้อมตัวนับสถิติ

เข้าไปดูในเว็บไซต์

8. สุภาอินเตอร์เนชั่นแนล

เว็บไซต์นี้ถูกส่งโดย Ben Dale นี่คือการออกแบบ 2 หน้า ป้ายกำกับสำหรับผลิตภัณฑ์จะแสดงเป็นพื้นหลังแบบพารัลแลกซ์โดยมีสโลแกนและ CTA อยู่ในโอเวอร์เลย์ ส่วนถัดไปจะแสดงข้อมูลโดยละเอียดที่ด้านหนึ่งด้วยฟอนต์ที่เล็กกว่า และข้อความที่สั้นกว่าในข้อความขนาดใหญ่อีกด้านหนึ่ง สองสามส่วนถัดไปจะแสดงรูปภาพของผลิตภัณฑ์ที่มีชื่อและข้อความ รูปภาพต่างๆ จะตัดกันในแนวตั้งจากกัน ทำให้การออกแบบมีรูปแบบภาพที่น่าสนใจ บริการต่างๆ จะแสดงด้วยรูปภาพที่มีการซ้อนทับที่มีชื่อเรื่องและข้อความที่มีตัวเลข สินค้าอื่นๆ แสดงในแกลเลอรีขนาดใหญ่ 4 คอลัมน์ ไซต์นี้ใช้ข้อความและรูปภาพขนาดใหญ่ของชื่อเรื่องได้อย่างดีเยี่ยม

เข้าไปดูในเว็บไซต์

9. ฮีโร่สำหรับคุณ

เว็บไซต์นี้ถูกส่งโดย Bram Chauvin ไซต์นี้ใช้กราฟิกที่น่าสนใจ ส่วนฮีโร่ใช้ตัวแบ่งส่วนบนสุดที่กำหนดสไตล์ของส่วนหัว ข้อความชื่อเรื่องมีขนาดใหญ่และแสดงสโลแกนและปุ่มหลายปุ่ม พื้นหลังจะแสดงเป็นพารัลแลกซ์จริงและรวมถึงเมฆที่ทับซ้อนกันโดยตัวแบ่งส่วนคลาวด์ของส่วนถัดไป Blurbs แสดงบริการโดยใช้กราฟิกแบบวงกลม ปุ่มในการนำเสนอซ้อนทับกับการนำเสนอ ฉันชอบ CTA ที่แสดงกราฟิกขนาดใหญ่ของสมาร์ทโฟนในดวงใจ ส่วนท้ายก็น่าสนใจเช่นกัน มันแสดงพื้นหลังกราฟิกในแบบพารัลแลกซ์จริงพร้อมตัวแบ่งส่วนมุมและ CTA ผู้ติดต่อในโอเวอร์เลย์ บล็อกใช้การออกแบบเดียวกันและใช้องค์ประกอบส่วนหัวและส่วนท้าย

เข้าไปดูในเว็บไซต์

10. VS & ประกอบ

เว็บไซต์นี้ถูกส่งโดย MJ Swart ไซต์นี้ใช้ประโยชน์จากองค์ประกอบกราฟิกและบล็อกขนาดใหญ่เพื่อสร้างเลย์เอาต์ ส่วนฮีโร่ใช้พื้นหลังสีเข้มพร้อมบล็อก จุด และข้อความแนวตั้งสีต่างๆ เพื่อสร้างรูปแบบภาพ รูปแบบเหล่านี้เป็นไปตามส่วนที่เหลือของเค้าโครง ส่วนถัดไปใช้เลย์เอาต์แบบหลายคอลัมน์พร้อมบล็อกสีสำหรับพื้นหลัง ชื่อที่มีสไตล์ ชื่อขนาดใหญ่พิเศษ และแถบเลื่อนเพื่อแสดงบริการ ข้อมูลเกี่ยวกับบริษัท ประสบการณ์ วัฒนธรรม สำนักงาน และอื่นๆ การคลิกลิงก์ผู้ติดต่อในเมนูจะเปิดแบบฟอร์มการติดต่อในเมนู ฉันชอบการใช้สี ข้อความ และตัวเลื่อนในเว็บไซต์นี้

เข้าไปดูในเว็บไซต์

ในการปิด

นั่นคือ 10 การส่งเว็บไซต์ Divi ชุมชนที่ดีที่สุดของเราในเดือนเมษายน ไซต์เหล่านี้ดูน่าทึ่ง และเช่นเคย เราอยากจะขอบคุณทุกคนสำหรับการส่งของคุณ!

หากคุณต้องการพิจารณาการออกแบบของคุณเอง โปรดส่งอีเมลถึงบรรณาธิการของเราที่ nathan at elegant themes dot com ตรวจสอบให้แน่ใจว่าได้กำหนดหัวเรื่องของอีเมลว่า "การส่งเว็บไซต์ DIVI"

เราอยากได้ยินจากคุณในความคิดเห็นด้วย! บอกเราว่าคุณชอบอะไรเกี่ยวกับเว็บไซต์เหล่านี้ และหากมีสิ่งใดที่พวกเขาทำ คุณต้องการให้เราสอนในบล็อก

ภาพเด่นผ่าน MSSA / shutterstock.com