6 เคล็ดลับในการปรับปรุง UIs ของคุณให้ดีขึ้นอย่างรวดเร็ว

30-ต.ค.-20

คัมภีร์เทพ IT

การสร้าง User Interface ที่สวยงาม ใช้งานได้ และมีประสิทธิภาพนั้น ต้องใช้เวลาและมีการแก้ไข Design หลายครั้งกว่าจะได้ตามที่ต้องการ แต่การปรับเปลี่ยนอะไรง่าย ๆ บางอย่าง อาจช่วยคุณสามารถปรับปรุง Design ของคุณให้ดีขึ้นได้อย่างรวดเร็ว และบทความนี้จะมาบอก 6 เคล็ดลับในการปรับปรุง UIs ของคุณให้ดีขึ้นอย่างรวดเร็ว ซึ่งเป็นการช่วยเพิ่มประสบการณ์ของผู้ใช้งานได้อีกทางหนึ่ง

1. เลือกใช้สีในรูปภาพ จะช่วยทำให้ Product ดูมีชีวิตชีวา

เพียงแค่เลือกใช้สีกับรูป Products ของคุณ จากนั้นปรับแต่งสีที่คุณเลือกให้สว่างขึ้นและ/หรือทึบลง ลงบน Background, Text, Icon หรืออื่น ๆ ก็สามารถช่วยเพิ่มความน่าสนใจในการมองเห็นและสร้าง Character ให้กับ Design ของคุณได้

2. พยายามสร้าง Tappable Area ที่กว้างพอเหมาะบน Mobile

เมื่อคุณต้อง Design สิ่งที่จะต้องแสดงบน Mobile ให้พยายามสร้าง Tappable Area ให้ใหญ่เพียงพอสำหรับนิ้วที่จะสัมผัสได้

สิ่งนี้อาจเป็นเรื่องท้าทายสำหรับปุ่ม และ Links ที่มีเฉพาะ Text ดังนั้นพยายามหา Icon ที่มี Label ทุกครั้งเท่าที่สามารถทำได้

และนี่ก็คือ Tappable Area ขั้นต่ำที่แนะนำสำหรับทั้ง iOS และ Android:

  • 44 x 44 pt สำหรับ iOS
  • 48 x 48 dp สำหรับ Android

3. พยายามสร้าง Contrast Ratio ที่เหมาะสมระหว่าง Text ที่มีสีอ่อนกับรูปภาพ

ตรวจสอบให้แน่ใจเสมอว่า Text ที่มีสีอ่อน ยังสามารถอ่านได้ชัดเจนบนภาพ Background ที่มีสีโทนสว่าง

เพียงแค่ใช้ Background ที่มืดทึบเล็กน้อยที่ด้านหลัง Text ของคุณ ก็จะรักษา Contrast Ratio ที่เหมาะสมระหว่างองค์ประกอบเหล่านั้นได้

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

4. ลองดูรูปแบบ Fonts ที่เหมาะกับส่วนของ Headlines

นี่คือตัวอย่างของ Fonts ทั้ง Serif และ Sans-Serif ที่น่าลองใช้ และมันก็ใช้งานได้ดีสำหรับ Headlines ซึ่งน่ามองและจะช่วยทำให้ Design ดูมีลักษณะเฉพาะยิ่งขึ้น

หากคุณสนใจ Fonts เหล่านี้ สามารถดูได้ที่ fonts.adobe.com

5. ลองดูรูปแบบ Fonts ที่เหมาะกับส่วนของ Body

นี่คือตัวอย่างของ Fonts ทั้ง Serif และ Sans-Serif ที่เหมาะกับการใช้สำหรับ Body Text ที่ยาว ๆ ซึ่งขอแนะนำให้คุณลองใช้เป็นอย่างยิ่ง

หากคุณสนใจ Fonts เหล่านี้ สามารถดูได้ที่ fonts.adobe.com

6. พยายามให้ข้อมูลให้มากที่สุดสำหรับ Download Indicators

สิ่งที่คุณคงไม่อยากให้มันเป็นรูปแบบที่ ‘Minimal’ มากนัก ก็คือ เมื่อพูดถึง Download Indicators

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

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

ที่มา:  https://uxdesign.cc/

 

 

รับตำแหน่งงานไอทีใหม่ๆ ด้วยบริการ IT Job Alert

 

อัพเดทบทความจากคนวงในสายไอทีทาง LINE ก่อนใคร
อย่าลืมแอดไลน์ @techstarth เป็นเพื่อนนะคะ

เพิ่มเพื่อน

 

บทความล่าสุด