การออกแบบ UX ที่น่าดึงดูดใจ: ใครทำถูกต้อง

เผยแพร่แล้ว: 2017-03-01
หมวดหมู่
ประสบการณ์ผู้ใช้

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

1. Duo Lingo

ศัพท์แสง Duo เป็นความสุขอย่างแท้จริงที่จะใช้ หากแพลตฟอร์มใดสามารถอ้างว่า "ทำให้การเรียนรู้เป็นเรื่องสนุก" ได้ Duo Lingo คือคำตอบ บริการนี้ช่วยให้ผู้ใช้เรียนรู้ภาษาใหม่และอินเทอร์เฟซนั้นเรียบง่าย เป็นมิตร และเข้าถึงได้ ซึ่งดูเหมือนว่าจะเป็นแนวทางที่ถูกต้องในการทำให้กระบวนการที่น่ากลัวในการเรียนรู้ภาษาใหม่ดูเหมือนเข้าถึงได้ ไซต์นี้ทำให้ผู้ใช้เริ่มใช้บริการได้ดีเยี่ยมภายในเวลาไม่กี่วินาที โดยไม่ต้องบังคับให้สร้างบัญชี ซึ่งช่วยให้ผู้ใช้สามารถสัมผัสกับแพลตฟอร์มได้ด้วยตนเองก่อนที่จะทำตามขั้นตอนต่างๆ ในการสร้างล็อกอินและรหัสผ่าน คุณสามารถจินตนาการได้ว่าเมื่อผู้ใช้สัมผัสประสบการณ์การใช้งานแพลตฟอร์มที่ง่ายและสนุก พวกเขาจะมีโอกาสสร้างบัญชีและกลายเป็นผู้ใช้เฉพาะทางมากขึ้น
duo-lingo
duo-lingo-2
Duo Lingo นำเสนอคำถามแก่ผู้ใช้ในรูปแบบที่เข้าใจง่ายและโต้ตอบได้อย่างไม่น่าเชื่อ แถบแสดงความคืบหน้าระบุว่าผู้ใช้อยู่ในโมดูลนี้มากเพียงใด คำตอบ - ถูกหรือผิด - เสริมด้วยสีและเสียง
duo-lingo-3

2. Virgin America

การจองตั๋วเครื่องบินไม่ใช่ประสบการณ์ที่สนุกสนานเสมอไป สายการบินหลักหลายแห่งมีเว็บไซต์ที่ยุ่งยากซึ่งทำให้การค้นหาและจองเที่ยวบินเป็นกระบวนการที่ทรหดโดยสิ้นเชิง บางทีนั่นอาจเป็นเหตุผลว่าทำไมการเข้าสู่เว็บไซต์ Virgin America จึงรู้สึกเหมือนเป็นประสบการณ์ที่รุนแรง เว็บไซต์นี้สะอาดและทันสมัย ​​และทำให้เป้าหมายหลักของผู้ใช้ คือ การจองเที่ยวบิน ทั้งด้านหน้าและตรงกลาง ข้อความมีขนาดใหญ่และสามารถอ่านได้ และราคาเที่ยวบินและเวลาจะแสดงล่วงหน้า หนึ่งในคุณสมบัติที่ดีที่สุดของเว็บไซต์ Virgin America คือความสามารถในการเลือกวันที่ตามราคาเที่ยวบิน ซึ่งเป็นโบนัสหลักสำหรับผู้ใช้ที่มีความยืดหยุ่นบางประการในวันเดินทางและกำลังค้นหาข้อเสนอที่ดีที่สุด
เวอร์จิ้น-อเมริกา
รายละเอียดการเดินทางของผู้ใช้จะถูกบันทึกและแสดงตลอดทั้งกระบวนการ และสามารถเปลี่ยนแปลงหรืออัปเดตได้ทุกเมื่อโดยไม่ต้องถูกบังคับให้เริ่มการค้นหาใหม่อีกครั้ง
เวอร์จิ้น-อเมริกา-2

3. ผ้ากันเปื้อนสีน้ำเงิน

Blue Apron มีโฮมเพจที่น่าทึ่ง เต็มไปด้วยเนื้อหาที่มีประโยชน์ที่นำเสนอในรูปแบบที่น่าสนใจ หน้าแบบเลื่อนยาวมีภาพเคลื่อนไหวขนาดเล็กที่ดึงดูดความสนใจของผู้ใช้และกระตุ้นให้มีการโต้ตอบกับเนื้อหาไซต์ แต่ละส่วนของหน้ามีคำกระตุ้นการตัดสินใจที่ชัดเจน ซึ่งช่วยให้ผู้ใช้สามารถไปยังขั้นตอนถัดไปของกระบวนการได้
ผ้ากันเปื้อนสีน้ำเงิน1
ขั้นตอนการสมัครของ Blue Apron ก็เป็นสิ่งที่ต้องดูเช่นกัน เป็นกระบวนการง่ายๆ สามขั้นตอนที่ทำให้การเลือกความชอบของผู้ใช้เป็นเรื่องสนุก ผ่านการเน้นที่ภาพและการเสริมแรงในเชิงบวกเมื่อทำการเลือก
blue-apron2

4. แอปเปิ้ล

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

5. มหาสมุทรแอตแลนติก

หน้าแรกที่เลื่อนได้ลึกแทบจะรับประกันได้ว่าคุณไม่สามารถเข้าสู่ไซต์และไม่พบสิ่งที่คุณสนใจที่จะอ่าน เนื้อหาถูกจัดเรียงอย่างประณีตตามหมวดหมู่กว้างๆ และแต่ละหมวดหมู่มีการแบ่งแยกอย่างชัดเจน มีลำดับชั้นที่สวยงามในวิธีการออกแบบข้อความแจ้งความบทความ - รูปภาพที่มีชื่อบทความขนาดใหญ่ที่อ่านได้ ข้อความนำเสนอที่เล็กกว่า (แต่ยังคงอ่านได้!) และชื่อผู้แต่งด้วยสีเน้นสีแดงของ The Atlantic สัมผัสเล็กๆ น้อยๆ เหล่านี้ทำให้ง่ายต่อการโฟกัสและตีความเนื้อหา ซึ่งไม่ใช่กรณีของเว็บไซต์ข่าวและผู้ให้บริการเนื้อหาเสมอไป
แอตแลนติก1
หน้าบทความเองก็ได้รับการออกแบบมาอย่างดีเช่นกัน มีส่วนท้ายแบบติดหนึบที่ช่วยให้ผู้ใช้สามารถกลับไปที่หน้าแรก แชร์บน Facebook หรือ Twitter หรือไปที่บทความถัดไปในหมวดหมู่เนื้อหาใดก็ตามที่พวกเขากำลังอ่านอยู่ การปรับขนาดข้อความในหน้าบทความก็เป็นเรื่องที่ดีเช่นกัน

6. Warby Parker

ไซต์ Warby Parker ทำให้การซื้อแว่นตาออนไลน์เป็นหนึ่งในสิ่งที่ง่ายที่สุดที่คุณเคยทำ แต่ส่วนที่ดีที่สุดของเว็บไซต์ (อย่างน้อยในมุมมองของ UX) คือกระบวนการเช็คเอาต์ ขั้นตอนการชำระเงินของ Warby Parker ได้รับการออกแบบมาอย่างพิถีพิถันอย่างชัดเจน เพื่อลดอุปสรรคในการทำให้เสร็จให้ได้มากที่สุด แบบฟอร์มมีน้อยและมีฟิลด์เพียงไม่กี่ฟิลด์ แต่ละหมวดหมู่จะขยายออกไปเมื่อผู้ใช้เข้าถึง ซึ่งทำให้แบบฟอร์มไม่รู้สึกล้นหลามในแวบแรก
warby-parker-1
warby-parker-2
การซื้อผลิตภัณฑ์หรือผลิตภัณฑ์ทางออนไลน์ด้วยอุปกรณ์พกพา (เช่น ดำเนินการชำระเงินให้เสร็จสิ้น ไม่ใช่แค่การค้นหาและเรียกดูผลิตภัณฑ์) เป็นงานที่เราคุ้นเคยมากขึ้นเรื่อยๆ แต่ก็ยังคงประสบปัญหาหรือพลาดอยู่มาก บ่อยครั้งที่ประสบการณ์ใช้งานนั้นน่ารำคาญหรือยากโดยไม่จำเป็น และการซื้อบนเดสก์ท็อปในภายหลังจะง่ายกว่า แต่กระบวนการเช็คเอาต์บนมือถือของ Warby Parker นั้นค่อนข้างไร้ที่ติ โดยจะลดช่องต่างๆ ที่เป็นไปได้ คาดการณ์และป้อนที่อยู่ของคุณโดยอัตโนมัติขณะที่คุณพิมพ์ และแบบฟอร์มจะเรียงซ้อนกันในแนวตั้งเพื่อการใช้งานบนมือถือที่ดีที่สุด
warby-parker-3

7. อาสนะ

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