จากโค้ดสู่แคนวาส: Logto ทำให้การออกแบบประสบการณ์การลงชื่อเข้าใช้เป็นแบบโอเพนซอร์ส
เราได้เผยแพร่ทรัพยากรประสบการณ์การลงชื่อเข้าใช้ใน Figma สู่สาธารณะ ซึ่งรวมถึงการออกแบบขั้นตอนการยืนยันตัวตนครบวงจรและสไตล์และส่วนประกอบที่แตกต่างกัน.
เราได้เผยแพร่ทรัพยากรประสบการณ์การลงชื่อเข้าใช้ใน Figma สู่สาธารณะ ซึ่งรวมถึงการออกแบบขั้นตอนการยืนยันตัวตนครบวงจรและสไตล์และส่วนประกอบที่แตกต่างกัน.
ที่ Logto เราเชื่อในพลังแห่งความร่วมมือและความโปร่งใส นั่นเป็นเหตุผลที่เรามีความยินดีที่จะแจ้งให้คุณทราบว่าเราได้ทำให้การออกแบบประสบการณ์การลงชื่อเข้าใช้ใน Figma ของเราเป็นโอเพนซอร์สและพร้อมใช้งานสำหรับทุกคน ในการเข้าถึงทรัพยากร Figma:
การออกแบบนี้ประกอบด้วยสองส่วนหลัก: การไหลของการยืนยันตัวตน (ประสบการณ์การลงชื่อเข้าใช้) และสไตล์ & ส่วนประกอบ มาสำรวจแต่ละส่วนในรายละเอียดกันเถอะ
เราได้รังสรรค์การผสมผสานของการลงชื่อสมัครใช้ การลงชื่อเข้าใช้ และการลงชื่อเข้าใช้ผ่านช่องทางสังคมครั้งแรกสำหรับทั้งแพลตฟอร์มมือถือและคอมพิวเตอร์ แต่ละสถานการณ์มาพร้อมกับการตั้งค่าคอนโซลที่เกี่ยวข้อง มอบภาพรวมของการไหลของการยืนยันตัวตนให้กับคุณ นี่คือตัวอย่างบางส่วนของสถานการณ์เหล่านั้น:
| การลงชื่อสมัครใช้ | การลงชื่อเข้าใช้ | การลงชื่อเข้าใช้ผ่านช่องทางสังคมครั้งแรก | |
|---|---|---|---|
| ชื่อผู้ใช้ | ชื่อผู้ใช้ + รหัสผ่าน | ชื่อผู้ใช้ + รหัสผ่าน | ลงชื่อเข้าใช้ผ่านช่องทางสังคม + ตั้งชื่อผู้ใช้ |
| อีเมล (ที่นิยมที่สุด) | อีเมล + รหัสยืนยัน + รหัสผ่าน | อีเมล + รหัสผ่าน | ลงชื่อเข้าใช้ผ่านช่องทางสังคม + ลิงค์อีเมล |
| เบอร์โทรศัพท์ | เบอร์โทรศัพท์ + รหัสยืนยัน | เบอร์โทรศัพท์ + รหัสยืนยัน | ลงชื่อเข้าใช้ผ่านช่องทางสังคม + ลิงค์เบอร์โทรศัพท์ |
| อีเมลและเบอร์ผสม | อีเมล/เบอร์โทรศัพท์ + รหัสยืนยัน + รหัสผ่าน | อีเมล/เบอร์โทรศัพท์ + รหัสยืนยัน/รหัสผ่าน | ลงชื่อเข้าใช้ผ่านช่องทางสังคม + ลิงค์อีเมล/เบอร์โทรศัพท์ |
| ลงชื่อเข้าใช้ช่องทางสังคมเท่านั้น | / | / | ลงชื่อเข้าใช้ผ่านช่องทางสังคมเท่านั้น |
| ลืมรหัสผ่าน | |
|---|---|
| อีเมลและเบอร์ผสม | ตั้งรหัสผ่านใหม่โดยการยืนยันอีเมล/เบอร์โทรศัพท์ |

การออกแบบของเรายังรวมถึงชุดของสไตล์และส่วนประกอบที่ง่ายและหลากหลาย ทำให้คุณสามารถปรับแต่ง UI ของประสบการณ์การลงชื่อเข้าใช้ของคุณได้อย่างง่ายดาย นี่คือสิ่งที่คุณจะพบ:
| บทนำ | |
|---|---|
| สไตล์ฟอนต์ | เราได้ทำการจัดหมวดหมู่ฟอนต์ให้ง่ายขึ้น เช่น ตัวเนื้อหา, ป้าย, หัวข้อ, และพันธกรณี ฟอนต์เดียวกันถูกใช้ทั้งในแพลตฟอร์มมือถือและคอมพิวเตอร์ เพื่อความคงตัวและการใช้งานที่ง่ายดาย |
| สไตล์สี | ด้วยความช่วยเหลือของพาเลตสีและโทเค็น คุณสามารถปรับเปลี่ยนสีธีมให้เข้ากับแบรนด์ของคุณได้อย่างง่ายดาย พาเล็ตสีของเราถูกสร้างขึ้นโดยใช้ Google Material Design และมีทั้งโหมดแสงและโหมดมืด ทำให้นักออกแบบของคุณเข้าใจได้ง่าย |
| ไอคอน | เราได้รวบรวมคอลเลกชันของไอคอนตามการใช้งานที่หลากหลายที่สามารถใช้โดยตรงหรือเปลี่ยนแปลงได้อย่างง่ายดาย นอกจากนี้ เรายังมีไอคอนสื่อสังคมหลากหลายประเภทที่ออกแบบมาเฉพาะสำหรับปุ่มลงชื่อเข้าใช้สังคมของคุณ |
| ส่วนประกอบ | เราได้จัดระเบียบบริษัททั้งบนแพลตฟอร์มมือถือและเว็บ รวมถึง การสร้างแบรนด์, ปุ่ม, กล่องเลือก, การสนทนา, การนำทาง, ขนมปังปิ้ง, ช่องกรอกข้อความ, และคีย์บอร์ด (มือถือ). |

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

Logto มีความมุ่งมั่นที่จะให้บริการโค้ดแบบโอเพนซอร์สมาโดยตลอด แต่คุณอาจสงสัยว่าทำไมเราถึงตัดสินใจที่จะขยายความโปร่งใสนี้ไปยังการออกแบบของเราด้วย
เราต้องการให้ Logto เป็นเพื่อนที่ดีที่สุดไม่เพียงแค่นักพัฒนาแต่ยังสำหรับ PMs และนักออกแบบด้วย เราเชื่อในการส่งเสริมความร่วมมือที่ดีขึ้นตลอดกระบวนการพัฒนา ซึ่งนำไปสู่ประสิทธิภาพสูง ความโปร่งใส และความไว้วางใจ
ขณะที่ Logto มีความมุ่งมั่นในการให้บริการ Cloud ที่มีประสิทธิภาพ มันมีต้นกำเนิดจากชุมชนโอเพนซอร์สและตั้งใจที่จะแสดงความโปร่งใสสู่สาธารณะในระยะยาว
ขณะที่เรายังคงพัฒนาผลิตภัณฑ์ Logto ต่อไป เรายังคงอัปเดตการออกแบบ Figma อย่างต่อเนื่อง เราหวังว่าคุณจะได้ใช้ Logto เพื่อสร้างประสบการณ์การก้าวแรกที่โดดเด่นสำหรับผลิตภัณฑ์ของคุณและสร้างความทรงจำที่ยาวนานให้กับแบรนด์ของคุณ
เรายินดีรับฟังประสบการณ์และความคิดเห็นของคุณเสมอ ดังนั้นโปรดให้การสื่อสารยังเปิดอยู่ เรารอคอยที่จะได้ยินจากคุณ