fbpx
วิกิพีเดีย

แฟลทดีไซน์

กันยายน 23, 2021

แฟลทดีไซน์ (อังกฤษ: Flat design) เป็นภาษาการออกแบบ (design language) หรือรูปแบบการออกแบบ (design style) รูปแบบที่มีความเป็นจุลนิยม (minimalist) วลีนี้ริเริ่มและทำให้เป็นที่นิยมโดย อัลลัน กรินชไตน์ (Allan Grinshtein) ใช้ทั่วไปในการออกแบบส่วนต่อประสานกราฟิกกับผู้ใช้ (Graphical User Interface; GUI) เช่นในการออกแบบเว็บแแอปพลิเคชันหรือแอปพลิเคชันมือถือ เช่นเดียวกันกับสื่อสิ่งพิมพ์ โปสเตอร์ งานศิลปะ เอกสารแนะนำ และสินค้ากลุ่มงานพิมพ์

ตัวอย่างภาพสัญลักษณ์ที่เป็นแฟลทดีไซน์

นิยามและเป้าหมาย

 
ภาพจับหน้าจอแอปพลิเคชันมือถือที่มีองค์ประกอบการออกแบบแบบแมทีเรียลดีไซน์ (Material Design) รูปแบบของแฟลทดีไซน์ที่พัฒนาโดยกูเกิล

แฟลทดีไซน์เป็นรูปแบบการออกแบบอินเตอร์เฟซที่เน้นการใช้จุลนิยม (Minimalism) ในการสร้างองค์ประกอบต่าง ๆ ที่ทำให้เกิดการลวงตาให้เหมือนเป็นสามมิติ (illusion of three dimensions) ซึ่งใช้เทคนิคต่าง ๆ เช่น

การออกแบบแบแฟลทดีไซน์มุ่งเน้นอยู่ที่การใช้องค์ประกอบอย่างง่าย การจัดวางอักษร (typography) แบบจุลนิยม และการใช้สีแฟลท (flat colours)

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

อ้างอิง

  1. "Flat Design: An In-Depth Look". www.awwwards.com (ภาษาอังกฤษ). สืบค้นเมื่อ 2019-12-23.
  2. Smith, Grace. "36 High-Quality Flat Design Resources". Mashable (ภาษาอังกฤษ). สืบค้นเมื่อ 2019-12-23.
  3. "Flat Design Rising: Bold Changes to the Modern Website". Hoppel Design (ภาษาอังกฤษ). 2013-04-15. สืบค้นเมื่อ 2019-12-23.
  4. "Everything You Wanted to Know About Flat Design". Source Digit (ภาษาอังกฤษ). 2014-02-28. สืบค้นเมื่อ 2019-12-23.
  5. อ้างอิงผิดพลาด: ป้ายระบุ <ref> ไม่ถูกต้อง ไม่มีการกำหนดข้อความสำหรับอ้างอิงชื่อ S4lollipop-settings
  6. Screenshot of Samsung Galaxy S4 telephone application with Android 4.4.2 (before update) and Android 5.0 (after update).
  7. Carrie Cousins (May 28, 2013). "Flat design principles". designmodo.com.
  8. ↑ Turner, Amber Leigh (March 19, 2014). "The history of flat design: How efficiency and minimalism turned the digital world flat". The Next Web. สืบค้นเมื่อ April 11, 2014.
  9. Clum, Luke (May 13, 2013). "A Look at Flat Design and Why It's Significant". UX Magazine. สืบค้นเมื่อ April 11, 2014.
  10. Yair Grinberg (September 11, 2013). "iOS 7, Windows 8, and flat design: In defense of skeuomorphism". VentureBeat. สืบค้นเมื่อ April 13, 2014.

กันยายน 23, 2021
แฟลทด, ไซน, งกฤษ, flat, design, เป, นภาษาการออกแบบ, design, language, หร, อร, ปแบบการออกแบบ, design, style, ปแบบท, ความเป, นจ, ลน, ยม, minimalist, วล, เร, มและทำให, เป, นท, ยมโดย, ลล, กร, นชไตน, allan, grinshtein, ใช, วไปในการออกแบบส, วนต, อประสานกราฟ, กก, บผ,. aeflthdiisn xngkvs Flat design epnphasakarxxkaebb design language hruxrupaebbkarxxkaebb design style rupaebbthimikhwamepnculniym minimalist wlinirierimaelathaihepnthiniymody xlln krinchitn Allan Grinshtein 1 2 3 4 ichthwipinkarxxkaebbswntxprasankrafikkbphuich Graphical User Interface GUI echninkarxxkaebbewbaeaexpphliekhchnhruxaexpphliekhchnmuxthux echnediywknkbsuxsingphimph opsetxr ngansilpa exksaraenana aelasinkhaklumnganphimphtwxyangphaphsylksnthiepnaeflthdiisnniyamaelaepahmay aekikh phaphcbhnacxaexpphliekhchnmuxthuxthimixngkhprakxbkarxxkaebbaebbaemthieriyldiisn Material Design rupaebbkhxngaeflthdiisnthiphthnaodykuekil aeflthdiisnepnrupaebbkarxxkaebbxinetxrefsthiennkarichculniym Minimalism inkarsrangxngkhprakxbtang thithaihekidkarlwngtaihehmuxnepnsammiti illusion of three dimensions sungichethkhnikhtang echn skiwoxmxrf Skeuomorph 5 drxpchaodw drop shadow khwamluksmmti depth perception karilsi colour gradient esnkhxb 6 khwamtangsi colour contrast kartxbklbphansmphs Haptic feedback kartxbklbphanesiyng Acoustic feedback karxxkaebbaebaeflthdiisnmungennxyuthikarichxngkhprakxbxyangngay karcdwangxksr typography aebbculniym aelakarichsiaeflth flat colours 7 nkxxkaebbxaceluxkichkarxxkaebbaebbaeflthdiisnephraamirupaebbxinetxrefsthiduephriyw Streamlined kwa aelamiprasiththiphaphkwa karxxkaebbaebbaeflthdiisnthaihepneruxngngaykhunthicasuxsarkhmultang xyangrwderw inkhnaediywknkyngkhngmiruplksnthidungdudaelaekhathungidngay 8 9 nxkcakniyngngthaihkarxxkaebbnnngaykhuninaengkhxngkarsrangxinetxrefsthimikarxxkaebbkarottxb Responsive design thiepliyninkhnadkhxngebrawesxrbnxupkrnthiaetktangknipkhxngphuich thisakhyxiprakarhnungkhuxdwyxngkhprakxbthiichmikhnadelklngaelanxylngtamaenwkhidaebbculniym thaihewbistaelaopraekrmsamarthdawnohldidxyangrwderwyingkhun aelathaihprbkhnadidxyangngayday inkhnaediywknkyngkhngdukhmchdbnhnacxthimikhwamlaexiydsung 8 aeflthdiisnthuxepnrupaebbkhutrngkhamkbkarxxkaebbaebbskiwoxmxrf Skeuomorphism 10 aela richdiisn rich design 8 thungaemwaaeflthdiisnxacmikarexaskiwoxmxrfmaprakxbdwykidxangxing aekikh Flat Design An In Depth Look www awwwards com phasaxngkvs subkhnemux 2019 12 23 Smith Grace 36 High Quality Flat Design Resources Mashable phasaxngkvs subkhnemux 2019 12 23 Flat Design Rising Bold Changes to the Modern Website Hoppel Design phasaxngkvs 2013 04 15 subkhnemux 2019 12 23 Everything You Wanted to Know About Flat Design Source Digit phasaxngkvs 2014 02 28 subkhnemux 2019 12 23 xangxingphidphlad payrabu lt ref gt imthuktxng immikarkahndkhxkhwamsahrbxangxingchux S4lollipop settings Screenshot of Samsung Galaxy S4 telephone application with Android 4 4 2 before update and Android 5 0 after update Carrie Cousins May 28 2013 Flat design principles designmodo com 8 0 8 1 8 2 Turner Amber Leigh March 19 2014 The history of flat design How efficiency and minimalism turned the digital world flat The Next Web subkhnemux April 11 2014 Clum Luke May 13 2013 A Look at Flat Design and Why It s Significant UX Magazine subkhnemux April 11 2014 Yair Grinberg September 11 2013 iOS 7 Windows 8 and flat design In defense of skeuomorphism VentureBeat subkhnemux April 13 2014 ekhathungcak https th wikipedia org w index php title aeflthdiisn amp oldid 8799690, wikipedia, วิกิ หนังสือ, หนังสือ, ห้องสมุด,

บทความ

, อ่าน, ดาวน์โหลด, ฟรี, ดาวน์โหลดฟรี, mp3, วิดีโอ, mp4, 3gp, jpg, jpeg, gif, png, รูปภาพ, เพลง, เพลง, หนัง, หนังสือ, เกม, เกม