การออกแบบประสบการณ์ของผู้ใช้

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

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

1. แสดงคุณค่าก่อน
2. เลี่ยงขั้นตอนที่ไม่จำเป็น
3. การออกแบบปุ่ม
4. สิทธิ์การอนุญาต
5. ให้ตัวเลือกในการออกจากระบบ
6. ทดสอบและวัดผล

1. แสดงคุณค่าก่อนขอให้ผู้ใช้เข้าสู่ระบบ

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

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

มาดูหลักการออกแบบที่กระตุ้นให้ผู้ใช้เข้าสู่ระบบมากขึ้น ดังนี้

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

อธิบายอย่างชัดเจนและสั้นกระชับถึงสิ่งที่แอพของคุณนำเสนอ

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

ให้ดูเนื้อหาคร่าวๆ ว่าผู้ใช้จะได้เห็นอะไรหลังจากเข้าสู่ระบบ

ให้ผู้ใช้ได้เห็นเนื้อหาคร่าวๆ ก่อนเข้าสู่ระบบ เช่น รูปภาพในพื้นหลังดังในตัวอย่างนี้ ไม่จำเป็นต้องลงรายละเอียดมาก แม้แต่กระดาน Pinterest ที่ทำภาพเบลอไว้ก็ช่วยให้ผู้ใช้เข้าสู่ระบบ Pinterest ได้มากขึ้น

มอบประสบการณ์ผู้ใช้ใหม่

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

ให้ผู้ใช้สัมผัสแอพของคุณก่อนเข้าสู่ระบบ

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

2. เลี่ยงขั้นตอนที่ไม่จำเป็น

การลดขั้นตอนที่ไม่จำเป็นเป็นวิธีที่มีประสิทธิภาพที่สุดในการเพิ่มอัตราคอนเวอร์ชั่น

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

นอกจากนี้ หลังจากผู้ใช้เข้าสู่ระบบ Facebook แล้ว อย่าขอให้สร้างชื่อผู้ใช้หรือรหัสผ่าน หนึ่งในเหตุผลยอดนิยมที่สุดที่ผู้ใช้เลือกเข้าสู่ระบบด้วย Facebook เพราะ "ง่ายและเร็ว และไม่ต้องกรอกรหัสผ่าน" หลังจากการเข้าสู่ระบบ Facebook แล้ว ผู้ใช้ไม่ต้องการสร้างชื่อผู้ใช้หรือรหัสผ่าน

3. ปุ่มเข้าสู่ระบบด้วย Facebook

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

หากต้องการเปิดใช้การสร้างบัญชีผู้ใช้และการเข้าสู่ระบบด้วย Facebook ป้ายกำกับที่แนะนำได้แก่ "ดำเนินการต่อด้วย Facebook" หรือ "เข้าสู่ระบบด้วย Facebook" โดยจะขึ้นอยู่กับบริบท

การใช้งาน "เข้าสู่ระบบด้วย Facebook" ที่อนุมัติแล้ว”

การใช้งาน "ดำเนินการต่อด้วย Facebook" ที่อนุมัติแล้ว”

การใช้งาน "ดำเนินการต่อในนาม [ชื่อ]" ที่อนุมัติแล้ว”

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

โลโก้

ใช้โลโก้ “f” ที่อนุมัติแล้ว ทุกครั้งเพื่อสร้างการจดจำและความน่าเชื่อถือ โดยโลโก้จะอยู่ในศูนย์แหล่งข้อมูลของแบรนด์ Facebook

เมื่อใช้โลโก้ “f” ในการออกแบบปุ่มเข้าสู่ระบบ โลโก้ดังกล่าวควรปรากฏให้เห็นก่อนการกระตุ้นให้ดำเนินการ อย่าใช้โลโก้เป็นส่วนหนึ่งของการกระตุ้นให้ดำเนินการโดยการระบุว่า "เข้าสู่ระบบด้วยโลโก้ "f"

สี

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

สีปุ่มจะเป็นสีขาวและสีน้ำเงินของ Facebook: 5890FF เมื่อผู้คนทั่วโลกพูดคุยกันเกี่ยวกับการเข้าสู่ระบบด้วย Facebook พวกเขามักกล่าวถึง "ปุ่มสีน้ำเงิน" หากคุณไม่สามารถใช้สีน้ำเงินของ Facebook ได้ ให้เปลี่ยนเป็นสีขาวและดำ

ค่าสีน้ำเงินของ FACEBOOK

• CMYK บนกระดาษเคลือบเงา: 83 / 52 / 00 / 00
• CMYK บนกระดาษที่ไม่เคลือบเงา: 77 / 36 / 00 / 00
• PMS 2727C
• PMS 2382U
• Hex #1877F2
• R = 24 G = 119 B = 242

ข้อความ

ป้ายกำกับที่แนะนำ ได้แก่ "ดำเนินการต่อด้วย Facebook" หรือ "เข้าสู่ระบบด้วย Facebook" ทั้งนี้ขึ้นอยู่กับบริบท เมื่อใช้โลโก้ “f” กับการกระตุ้นให้ดำเนินการ ให้ใช้เวอร์ชั่นทางการที่มีให้ดาวน์โหลดในศูนย์แหล่งข้อมูลของแบรนด์ Facebook บน Facebook

วางข้อความกระตุ้นให้ดำเนินการไว้ในปุ่มเข้าสู่ระบบ โดยข้อความดังกล่าวไม่ควรอยู่ด้านนอกปุ่ม

เลือกแบบอักษร น้ำหนักแบบอักษร และระยะห่างของตัวอักษรที่ดูดีที่สุดในแอพ แต่ปรับให้เหมาะสมเพื่อให้สามารถอ่านได้ง่าย

ตำแหน่งการจัดวาง

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

โลโก้ “f” นั้นมีหลายขนาดซึ่งใช้กับปุ่มขนาดต่างๆ ได้ แต่สัดส่วนและรูปแบบตัวอักษรจะต้องตรงกัน

สิ่งที่ควรทำและไม่ควรทำ

• ควรใช้โลโก้ “f” ที่ได้รับการอนุมัติซึ่งมีอยู่ในศูนย์แหล่งข้อมูลของแบรนด์ Facebook บน Facebook และปฏิบัติตามแนวทางในการนำไปใช้

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

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

• ไม่ควรใช้โลโก้ "f" บนปุ่มที่ไม่มีการกระตุ้นให้ดำเนินการที่เหมาะสม โดยปุ่มที่แนะนำให้ใช้คือ "ดำเนินการต่อด้วย Facebook" หรือ "เข้าสู่ระบบด้วย Facebook"

• ไม่ควรวางข้อความการกระตุ้นให้ดำเนินการ (เช่น: ดำเนินการต่อด้วย Facebook) นอกปุ่มเข้าสู่ระบบ

4. สิทธิ์การอนุญาต

ขอเฉพาะสิทธิ์การอนุญาตที่คุณต้องใช้เท่านั้น

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

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

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

ขอสิทธิ์การอนุญาตในบริบทที่เหมาะสมและอธิบายเหตุผลที่จำเป็นต้องขอ

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

เช่น แอพ Facebook จะขอบริการตำแหน่งก็ต่อเมื่อผู้ใช้แตะปุ่มตำแหน่งอย่างชัดแจ้งขณะอัพเดตสถานะของตนเท่านั้น

5. ให้ตัวเลือกในการออกจากระบบ

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

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

6. ทดสอบและวัดผล

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

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

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