5 ข้อคววรู้ วิธีจัดฟอนต์ให้ปังกับสาย UI มีโพยเครื่องมือดีๆ ใช้งานฟรี!
การจัดฟ้อนต์ถือเป็นอีกเรื่องที่สำคัญสำหรับการออกแบบ UI เช่นกันเพราะการจัดฟ้อนต์เป็นเหมือนการสื่อสารกับผู้ใช้งานโดยตรง
ถ้าเราไม่ใส่ใจในการจัดฟ้อนต์ให้ดี อาจจะทำให้สื่อสารได้ไม่ดีทำใหห้ผู้ใช้งานไม่เข้าใจ วันนี้เราเลยมี 5 ข้อควรรู้มาฝากกัน ว่าจัดฟ้อนต์ยังไงให้ปัง อ่านง่าย ดึงดูดผู้ใช้งาน!
Hierarchy
หนึ่งในเทคนิคที่สำคัญที่สุดสำหรับการสื่อสาร โดยการใช้ การวางตัวหนังสือนำจุดสายตัวเพื่อให้ผู้อ่านตามบริบท
เลือกฟ้อนต์แบบพื้นฐาน
เลือกจากตัวหนังสือที่เป็นที่นิยมอย่าง Sans-Serif หรือ Serif เป็นตัวเลือกที่ปลอดภัย ควรเลือกแบบฟ้อนต์ที่สามารถใช้งานได้ดีในหลายขนาด เหมาะกับงาน และอ่านง่าย
Kerning การเว้นระยะ
Kerning คือการเว้นช่องว่างระหว่างตัวหนังสือ โดยจะแตกต่างกันไป ตามแต่ละคำเพราะแต่ละตัวอักษรขนาดไม่เท่ากัน หากเราจัดระยะไม่ดี อาจจะทำให้ตัวหนังสือทับกัน หรือเกยกัน ทำให้ข้อความไม่น่าอ่านดูไม่เป็นระเบียบ
การเว้นบรรทัด
การเว้นช่องว่างระหว่างบรรทัดข้อความ หรือที่เรียกว่าระยะห่างบรรทัด ควรเว้นบรรทัดควรให้ข้อความของเราอ่านง่ายที่สุด จำกัดความยาวบรรทัด ไว้ที่ 70–80 ตัวอักษร และควรมีขนาดอย่างน้อย 16pt ขึ้นไป
การเลือกสี
เลือกสีให้เหมาะสมกับการใช้งาน บางหัวข้ออาจจะต้องใช้สีที่เด่นขึ้นมา แต่ไม่ควรใช้สีที่ทำให้รู้สึกแสบตาเกินไปสำหรับการอ่านสีตัวอักษรมีความสำคัญต่อการใช้งาน ดังนั้นให้เน้นสีที่สบายตามากกว่า
เครื่องมือที่น่าสนใจ
Archetypeapp
มาทดลองการจัดฟ้อนต์แต่ละหัวข้อ โดยเราสามารถเลือกแบบฟ้อนต์เองได้ อีกทั้งยังสามารถปรับขนาดบรรทัดได้ด้วย นอกจากนี้ยังมีหลายฟีเจอร์ให้ทดลองอีกด้วย มีให้เลือกออกแบบได้ทั้งเวอร์ชั่นสำหรับ Desktop และ มือถือ
WhatTheFont
อยากรู้ว่าเว็บนี้ใช้ฟ้อนต์อะไร หรือถูกใจฟ้อนต์จากที่ไหน สามารถแคปรูปแล้วนำมาหาที่นี้ได้เลย! สะดวกมาก!
Colorhunt
จะเลือกสีไหนดี สีไหนเข้ากันไม่เข้ากัน อยากหาไอเดียดีๆ ลองดูที่เว็บนี้ มีการจับคู่สีต่างๆ ให้เราดู โดยเราสามารถเลือกแนวสีที่เราต้องการได้ด้วย
Google Fonts
เมื่อเจอฟ้อนที่ถูกใจ สามารถมาลองหาดาวน์โหลดที่นี้ได้เลย สะดวก และยังฟรีอีกด้วย!
หากใครที่เป็นสาย UI รับรองว่าถูกใจอย่างแน่นอนหรือใครทำกำลังมองหาทีมงานทำ UI เพื่อพัฒนาแบรนด์ของตัวเองทาง Astra Studio ก็มีรองรับเช่นเดียวกัน เรามีทีมงานมืออาชีพ ที่สามารถให้บริการ และให้คำปรึกษากับคุณได้ หากใครสนใจสามารถติดต่อเพิ่มได้เลย
อย่าลืมกดติดตามช่องทางต่างๆ ของเราเพื่อรับข้อมูลข่าวสารเพิ่มเติมกันนะ
บริการของเรา >> บริการ Astra studio
Medium: Medium Astra Studio
Website: Astra Studio