การออกแบบที่เรียบง่าย: สิ่งที่ควรทำและไม่ควรทำ

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

เช่นเดียวกับงานศิลปะและการออกแบบหลายๆ อย่าง การใช้สายตาที่เฉียบแหลมในการบอกความแตกต่างระหว่างสิ่งที่จะได้ ผล กับสิ่งที่ใช้ ไม่ได้ นั้นต้องใช้สายตาที่เฉียบแหลม

และเป็นสิ่งที่ใช้ งานไม่ได้ที่ คุณต้องการหลีกเลี่ยงในการออกแบบเว็บของคุณ หากคุณกำลังทำงานเพื่อความเรียบง่ายและคุณต้องการให้ไซต์ของคุณเรียก ooh จากผู้เยี่ยมชมแทนที่จะเป็น eww ฉันได้ครอบคลุมสิ่งที่คุณควรทำ (และสิ่งที่คุณไม่ควรทำมากมาย) .

ทำ: ใช้สี!

ผู้คนมักคิดว่าการออกแบบมินิมัลลิสต์เป็นแบบสีเดียวหรือแย่กว่านั้น—ขาวดำและ/หรือระดับสีเทา

ไม่ไม่ไม่. เลขที่.

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

นั่นหมายความว่าเมื่อพูดถึงสี คุณควร...ใช้สี ดูตัวอย่างนี้จาก Epoch Design:

การใช้สีที่นี่มีน้อย แต่นักออกแบบได้ใช้ประโยชน์สูงสุดเพื่อให้แน่ใจว่าคุณจะเห็นมัน

และจาก Boorbool:

พื้นหลังดูโอโทนโดดเด่นและน่าจดจำ แต่ไม่ตบหน้าคุณ

อย่า: ใช้ทุกสี!

ในอีกด้านหนึ่งของการออกแบบที่น่ารื่นรมย์เหล่านั้น กลุ่มมินิมัลลิสต์มีแรงกระตุ้นที่มืดมากในการใช้สีทั้งหมด เพียงแทนที่ความสะอาดของการออกแบบด้วยเฉดสีทุกสีบนสเปกตรัม

โอเค มันอาจจะไม่ได้แย่ขนาดนั้น แต่การใช้สีมากเกินไปกับความงามแบบมินิมอลลิสต์อื่นๆ อาจทำให้เสียสมาธิและเอาชนะใจตัวเองได้อย่างไม่น่าเชื่อ

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

ตรงกันข้ามกับการออกแบบที่เรียบง่ายนั่นคือ

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

นั่นไม่ใช่ขั้นต่ำแล้วใช่ไหม

ทำ: ใช้แอนิเมชั่น

คุณเห็นไหมว่าแอนิเมชั่นด้านบน…ไม่สำคัญ พวกเขาไม่ได้ เพิ่ม อะไรในเว็บไซต์ แต่กราฟภาพยนตร์อย่าง Rogue & Co use ก็ใช้ได้ พวกเขาเพียงแค่ต้องปรับปรุงไซต์ ไม่เกะกะ

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

อุปสรรคที่ใหญ่ที่สุดคือการทำให้แอนิเมชั่นเหมาะกับการออกแบบของคุณ อย่าเพิ่งเพิ่มพวกเขาในที่ที่พวกเขาไม่ได้อยู่ ดูว่าส่วนท้ายที่ขยายในหน้า Divi ของเราดึงความสนใจของคุณอย่างไรในขณะที่คุณเลื่อน แต่จะไม่เบี่ยงเบนจากวิธีที่คุณใช้หน้านั้น

ไม่น่าแปลกใจเลยที่ Divi มีคุณสมบัติในตัวเพื่อบรรลุการโต้ตอบแบบไมโครประเภทนี้

ทำ: ใช้ช่องว่าง

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

และดูว่ามีการใช้สีเดียวเพื่อดึงดูดความสนใจของคุณไปยังปุ่มและลิงก์ที่คุณต้องการจริงๆ ได้อย่างไร

การใช้ช่องว่างอย่างมีประสิทธิภาพมีความสมดุล คุณต้องการสร้างสมดุลระหว่างความสามารถในการอ่านและอรรถประโยชน์กับความสวยงาม เมื่อใช้อย่างมีประสิทธิภาพ ช่องว่างจะมีประสิทธิภาพอย่างไม่น่าเชื่อในการทำให้การออกแบบที่เรียบง่ายของคุณน่าจดจำ ไอ Google ไอ ไอ

ห้าม: ใช้เฉพาะช่องว่าง

อีกด้านหนึ่งของสเปกตรัม การใช้ช่องว่างมากเกินไปทำให้ผู้เข้าชมใช้งานไซต์ของคุณแทบไม่ได้ คุณเห็นไหมว่าการใช้ช่องว่างของ Google เน้นว่าพวกเขาต้องการให้คุณใช้ไซต์อย่างไร: พิมพ์บางอย่างลงในช่อง

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

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

ทำ: ใช้แบบอักษรที่ยอดเยี่ยมอย่างเหมาะสม

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

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

ดูที่ Squarespace เป็นต้น คุณทราบดีว่าจะคาดหวังอะไรจากบริษัทของพวกเขาได้เพียงแค่ดูแบบฟอร์มลงทะเบียนและแบบอักษรที่ใช้ สะอาด เรียบง่าย และชัดเจน แสดงออกถึงความโฉบเฉี่ยวที่พวกเขาโฆษณา ส่วนใหญ่ผ่านแบบอักษรที่พวกเขาเลือก (เพราะนั่นเป็นองค์ประกอบการออกแบบเพียงอย่างเดียวที่คุณสามารถมองเห็นได้ที่นี่)

และผู้คนที่ Folks ต่างก็มีความรู้สึกแบบชาวบ้าน ดังนั้นพวกเขาจึงพบแบบอักษรที่รู้สึกดีอย่างแน่นอน ผู้ชมของพวกเขาชัดเจน เช่นเดียวกับที่พวกเขาใช้ผลิตภัณฑ์ของตน และไม่ได้ระบุไว้อย่างชัดเจน

อย่าใช้ฟอนต์เจ๋งๆ อย่างไม่เหมาะสม

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

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

แล้วหมอคนไหนที่ต้องการให้แน่ใจว่าคุณรู้ว่าเธอเป็นตัวเลือกที่ดีที่สุดในการช่วยชีวิตคุณล่ะ

หรือถ้าคุณกำลังมองหานักออกแบบเว็บไซต์ที่ยอดเยี่ยมและร่วมสมัย สิ่งที่คุณเห็นคือ:

โอเค ฉันเลยอดไม่ได้กับการขุดของ Comic Sans ฟ้องฉัน. แต่คุณได้รับประเด็นของฉัน: การเลือกแบบอักษรมีความสำคัญ โดยเฉพาะอย่างยิ่งเมื่อคุณใช้การออกแบบที่เรียบง่ายเพราะการเลือกแบบอักษรอาจเป็นส่วนที่ใหญ่ที่สุดของการออกแบบ

ออกไปและลดขนาด!

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

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

แนวทางของคุณเมื่อคุณออกแบบไซต์ที่เรียบง่ายมีอะไรบ้าง

ภาพขนาดย่อของบทความโดย Boo-Tique / shutterstock.com