8 Inspiring Web Design Trends 2022

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

สำหรับนักออกแบบ การอัปเดตเทรนด์การออกแบบนั้นถือเป็นสิ่งสำคัญในการทำงาน Commercial เพื่อสร้างสรรค์งานที่ทันสมัย สะดุดตา และอาจช่วยสร้างประสบการณ์ที่ดีให้กับผู้ใช้งาน

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

ในส่วนของ Visual ก็จะมีการยืมสไตล์การออกแบบมาจากยุคที่เว็บเพิ่งเกิดใหม่เช่นกัน ไม่ว่าจะเป็นการออกแบบโดยหลีกเลี่ยงการใช้รูปภาพเป็นคีย์หลักในการออกแบบ (ที่กลายมาเป็นสแตนดาร์ดในปัจจุบัน) และหันมาเล่นกับใช้ ฟอนต์หรือเส้นสายมาสร้างสรรค์การออกแบบแทน

1. ทำเอามันส์ (Playful, Fun, and Delight)

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

8 Inspiring Web Design Trends 2022
Guns 2 Swords - ส่งปืนมา แล้วเราจะหลอมดาบส่งกลับไปให้คุณ (Image by Webflow)


8 Inspiring Web Design Trends 2022
Blue Check Homes - ตราเครื่องหมายถูกสีฟ้า สำหรับติดหน้าบ้านอินฟลูเอนเซอร์ (Image by Webflow)


8 Inspiring Web Design Trends 2022
Light the Fire Within Us - เล่นใหญ่กับการบอกพนักงานว่าปีนี้จะพาไป Company Trip ที่ไหน (Image by Webflow)


8 Inspiring Web Design Trends 2022
Phillppe Neveu - เว็บพอร์ตส่วนตัวที่เล่นกับ Interaction ของ Shape (Image by Designmodo)

8 Inspiring Web Design Trends 2022
LegalSuper - ถึงจะเป็นเว็บบริษัทนักกฏหมาย ก็ยังแอบมีความอารมณ์ดี ที่ใช้ Font ดูสบายๆ กับรอยยิ้มในรูปภาพ (Image by Designmodo)
8 Inspiring Web Design Trends 2022
Dunk.biz - ทำเอามันส์จริง (Image by VIRT)

2. ลดการใช้รูปเป็นจุดโฟกัสหลักในการออกแบบ (Fewer images on heroes)

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

8 Inspiring Web Design Trends 2022
Humain (Image by Webflow)
8 Inspiring Web Design Trends 2022
Florian Wacker (Image by Designmodo)
8 Inspiring Web Design Trends 2022
Kirifuda (Image by Designmodo)
8 Inspiring Web Design Trends 2022
Dillinger (Image by Webflow)

3. ใช้ฟอนต์ขนาดใหญ่ (Oversized Typography)

เทรนด์การออกแบบตัวอักษรที่มีขนาดใหญ่เกินธรรมดา จนในบางครั้งทำให้คำกลายเป็นองค์ประกอบกราฟิก มากกว่าที่จะเป็นแค่ส่วนหนึ่งของข้อความโฆษณา เป็นเทคนิคอเนกประสงค์ที่สามารถใช้ได้ในการออกแบบทั้ง Minimalism หรือ Maximalism อย่างมีประสิทธิภาพและเข้ากับสไตล์ต่างๆ ได้หลากหลาย

8 Inspiring Web Design Trends 2022
Garcia Salmeron (Image by Designmodo)
8 Inspiring Web Design Trends 2022
The Flat Head (Image by Designmodo)
8 Inspiring Web Design Trends 2022
Eva Habermann (Image by Webflow)

4. เส้นกรอบ (Line work)

เป็นเทรนด์ที่ให้ความรู้สึกถึงความทันสมัยและความย้อนยุคได้ในเวลาเดียวกัน (ยิ่งถ้าเป็นเส้นหนาใช้คู่กับฟอนต์ Helvetica ยิ่งทำให้นึกถึงสไตล์ช่วงก่อนปี 2000 จริงๆ) และเราสามารถใช้เส้นเพื่อกำหนดส่วน และ Section ต่างๆ ได้ให้ดูเป๊ะและชัดเจน สิ่งสำคัญที่ดีไซน์เนอร์ควรคำนึงถึง ถ้าจะใช้เทรนด์การออกแบบเว็บไซต์ Linework คือขนาดความหนาของเส้น (line weight)

8 Inspiring Web Design Trends 2022
Appart (Image by Webflow)
8 Inspiring Web Design Trends 2022
Consumer Packaged Goods Directory (Image by Webflow)
8 Inspiring Web Design Trends 2022

5. แบ่งหน้าจอ (Split Screen)

เทรนด์การออกแบบเว็บไซต์แบบแบ่งหน้าจอ เริ่มถูกนำกลับมาให้เห็นบ่อยขึ้น เมื่อก่อนอาจจะมากจากเหตุผลในแง่ของการใช้งานหรือการทำ Responsive แต่ครั้งนี้อาจจะกลับมาด้วยเหตุผลทางด้าน Design มากกว่า

8 Inspiring Web Design Trends 2022
Better Me (Image by Designmodo)
8 Inspiring Web Design Trends 2022
Var But (Image by Webflow)

6. มีอารมณ์ของความเป็น 3 มิติ (3-Dimensional Elements)

3 มิติในที่นี้ ไม่ใช่แค่การใช้ภาพเรนเดอร์ 3 มิติในงานออกแบบ แต่เป็นการสร้างอารมณ์ 3 มิติในงาน ด้วยการใช้องค์ประกอบ เช่น เงา การเคลื่อนไหว หรือการใช้เลย์เยอร์ในการออกแบบ ก็เป็นอีกหนึ่งเทรนด์การออกแบบเว็บไซต์ที่น่าจับตามอง

8 Inspiring Web Design Trends 2022
Sennep (Image by Designmodo)
8 Inspiring Web Design Trends 2022
F’in Sweet (Image by VIRT)

7. Footer ขนาดยักษ์ (Mega Footer)

คงไม่มีใครคิดว่า Footer จะกลายมาเป็นเทรนด์ในการออกแบบได้ ดีไซน์เนอร์หันมาจัดเต็มกับการออกแบบ Footer สำหรับเว็บไซ์ที่มีข้อมูลเยอะ และมีความซับซ้อนในโครงสร้าง ไม่ต้องเป็น Section ที่โลกลืมเหมือนที่ผ่านมา

8 Inspiring Web Design Trends 2022
Wild Souls (Image by Designmodo)
8 Inspiring Web Design Trends 2022
Bluenkopf (Image by Designmodo)

8. การออกแบบที่ครอบคลุม (Inclusive Design and Copy Writing)

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

สรุปบทความ

และยังมีเทรนด์การออกแบบเว็บไซต์ที่แอบแทรกๆ อยู่ในหลายๆ งานด้านบนที่ไม่ได้แยกมาเป็นหัวข้อคือ พอยเตอร์ขนาดใหญ่  (Oversized Pointer), เอฟเฟกต์ข้อความเลื่อน (Scrolling Text), การออกแบบประสบการณ์ให้คล้ายแอพ (App-Like Experience) โดยรวมของเทรนด์การออกแบบเว็บไซต์ในปีใหม่นี้ น่าจะมีทั้งความสนุก และความสร้างสรรค์ในแบบที่แตกต่างจากการออกแบบในปีสองปีที่ผ่านมานี้ อย่างไรก็ตามก็อยากให้ดีไซน์เนอร์ลองนำองค์ประกอบเหล่านี้ ไปประยุกต์ใช้ในโปรเจคที่ตัวเองทั้งในตอนนี้และอนาคตกันดู เพื่อที่มันจะได้มันส์และสนุกกันอย่างเต็มที่

Source :

https://webflow.com

https://designmodo.com

Writer
Tumavait Vijakkhana
Director of Design & Technology

As a creative agency, we believe in the power of imagination and innovation. We are constantly pushing the boundaries of what is possible, and strive to create work that is not only beautiful and effective, but also meaningful and impactful.

เริ่มโปรเจคร่วมกัน

contact@neumerlin.com
การใช้เว็บไซต์นี้แสดงว่าคุณตกลงที่จะจัดเก็บคุกกี้บนอุปกรณ์ของคุณเพื่อปรับปรุง และ วิเคราะห์การใช้งานของเว็บไซต์ ดู นโยบายความเป็นส่วนตัว ของเราสําหรับข้อมูลเพิ่มเติม Privacy Policy