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

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

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

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

1. อาเบล บียาแวร์เด

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

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

2. อิยาชิ

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

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

3. พิคคาดิลลี วิปปี้

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

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

4. เซนติโด โคมูนิกาเคา

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

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

5. เห็นแบรนด์เอเจนซี่

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

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

6. Carola Staudinger

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

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

7. เสือหมอบ MTB

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

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

8. ยูเกอร์

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

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

9. โรปมาสเตอร์

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

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

10. แว่นตา Henrik Stenson

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

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

บทสรุป

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

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

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

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