الگوی ورود 2 صفحه ای، و نحوه رفع آن - مجله Smashing

چرا می بینیم فرم های ورود به چندین صفحه تقسیم می شوند هر کجا؟ به جای تایپ ایمیل و رمز عبور، باید ایمیل را تایپ کنیم، به صفحه بعد برویم و سپس رمز عبور را در آنجا تایپ کنیم. به نظر می رسد این حداقل ناکارآمد است.

بیایید ببینیم که چرا فرم های ورود به سیستم در سراسر صفحه ها تقسیم می شوند، چه مشکلی را حل می کنند و چگونه تجربه بهتری برای احراز هویت بهتر UX طراحی کنیم (ویدئو).

این مقاله است بخشی از سریال در حال انجام ما روی الگوهای طراحی همچنین بخشی از کتابخانه ویدیویی 10 ساعته در مورد الگوهای طراحی رابط هوشمند 🍣 و همچنین آموزش زنده UX آینده است. از کد استفاده کنید پرنده برای صرفه جویی 15 درصدی

مشکل فرم های ورود

اگر یک چیز وجود داشته باشد که ما در طول سال ها در UX یاد گرفته ایم، این است که طراحی برای افراد سخت است. این در مورد فرم های ورود نیز صدق می کند. مردم به طرز چشمگیری فراموشکار هستند. آنها اغلب فراموش می کنند که با چه ایمیلی ثبت نام کرده اند یا آخرین بار با چه سرویسی وارد شده اند (گوگل، توییتر، اپل و غیره)

یک ایده این است که به مشتریان یادآوری کنیم که آخرین بار با چه چیزی وارد سیستم شده اند و شاید آن را تبدیل به یک ایده کنیم گزینه پیش فرض. با این حال، به طور مستقیم نشان می دهد که حساب کاربر چیست، که ممکن است یک مشکل حریم خصوصی یا امنیتی باشد:

چه می شود اگر به جای نشان دادن همه گزینه هایی برای همه مشتریان در همه زمان ها، ما ابتدا ایمیل بخواهید، و سپس جستجو کنید که آخرین بار از چه خدماتی استفاده کرده اند و مشتریان را به طور خودکار به مکان مناسب هدایت کنید؟ خوب، این دقیقاً همان ایده است ورود 2 صفحه ای.

با 2-Page-Logins آشنا شوید

شاید قبلاً آنها را دیده باشید. اگر چند سال پیش، اکثر فرم های ورود به سیستم ایمیل و رمز عبور را در یک صفحه درخواست می کردند، این روزها بیشتر پرسیده می شود. فقط برای ایمیل اول. هنگامی که کاربر ادامه را انتخاب می کند، فرم در مرحله ای جداگانه رمز عبور را درخواست می کند. براد برخی از مشکلات این الگو را بررسی می کند.

یک دلیل رایج برای تقسیم فرم ورود به صفحه در صفحات است احراز هویت تک ورود (SSO).. شرکت های بزرگ معمولاً از SSO برای ورود به سیستم کارمندان خود استفاده می کنند. با استفاده از آن، کارکنان تنها یک بار در روز وارد سیستم می شوند و تنها از یک مجموعه اعتبار استفاده می کنند که امنیت شرکت را بهبود می بخشد.

پیچیدگی های UX ورود به سیستم (SSO)

SSO نیز کمک می کند انطباق با مقرراتو ارائه مجوزهای مناسب به کاربران و لغو آن ها بعداً به یکباره بسیار آسان تر است. بنابراین، اگر کارمندی را ترک کند، تمام حساب ها و داده های او به یکباره حذف می شوند.

به هم از مشتریان تجاری و هم از مشتریان خصوصی پشتیبانی می کند، شرکت ها از ورود 2 مرحله ای استفاده می کنند. کاربران باید ابتدا ایمیل خود را تایپ کنند، سپس اعتباردهنده بررسی می کند که ایمیل با کدام ارائه دهنده مرتبط است و کاربران را به آنجا هدایت می کند.

کاربران به ندرت این تجربه را دوست دارند. گاهی اوقات، آنها چندین حساب (خصوصی و تجاری) با یک سرویس دارند. همچنین، اغلب وارد سیستم 2 مرحله ای می شود مدیریت تکمیل خودکار و رمز عبور را بشکنید. و برای اکثر کاربران، ورود/گذر سریعتر از ورود دو مرحله ای است.

البته، به طور معمول، وجود دارد صفحات ورود به سیستم اختصاصی شرکت برای کارمندان برای ورود به سیستم، اما آنها اغلب مستقیماً به Gmail، Figma و غیره سر می زنند و سعی می کنند در آنجا وارد شوند. با این حال، آنها نمی توانند وارد سیستم شوند زیرا باید از طریق SSO وارد شوند.

خط پایین: این الگو برای کاربران SSO به خوبی کار می کند، اما برای کاربران غیر SSO منجر به a می شود UX خسته کننده.

راه حل جایگزین: آشکارسازی مشروط SSO

وجود دارد راهی برای کار کردن این چالش ها (تصویر زیر را ببینید). ما می توانیم از a استفاده کنیم جستجوی تک صفحه ای با فیلدهای ورودی ایمیل و رمز عبور به عنوان پیش فرض. هنگامی که کاربر ایمیل خود را تایپ کرد، متوجه می شویم که آیا احراز هویت SSO فعال است یا خیر.

اگر Single Sign-On (SSO) باشد برای آن ایمیل فعال شده است، یک گزینه Single Sign-On را نشان می دهیم و به طور پیش فرض روی آن قرار می دهیم. همچنین می توانیم قسمت رمز عبور را اختیاری یا غیرفعال کنیم.

اگر SSO فعال نیست برای آن ایمیل، ما با ورود به ایمیل/رمز عبور معمولی ادامه می دهیم. این مشکل چندانی ندارد، اما از دردسر برای حساب های خصوصی و تجاری صرفه جویی می کند.

خوراکی های کلیدی

🤔 مردم اغلب فراموش می کنند که با چه ایمیلی ثبت نام کرده اند.
🤔 همچنین سرویس احراز هویتی که با آن وارد شده اند را فراموش می کنند.
🤔 شرکت ها از Single Sign-On (SSO) برای ورود به سیستم شرکتی استفاده می کنند.
🤔 حساب های شخصی هنوز برای ورود به ایمیل و رمز عبور نیاز دارند.
✅ ورود 2 مرحله ای: ایمیل بخواهید، سپس به سرویس مناسب هدایت شوید.

✅ ورود 2 مرحله ای جایگزین ورود "اجتماعی" برای کاربران مکرر می شود.
✅ کاربران را به جای ایجاد موانع برای آنها هدایت می کند.
🤔 کاربران همچنان ایمیلی را که با آن وارد شده اند فراموش می کنند.
🤔 گاهی اوقات، کاربران چندین حساب با یک سرویس دارند.
🚫 لاگین های 2 مرحله ای اغلب مدیریت تکمیل خودکار و رمز عبور را خراب می کنند.
🚫 برای اکثر کاربران، ورود/گذر بسیار سریعتر از ورود دو مرحله ای است.

✅ بهتر است: با یک صفحه واحد با لاگین و رمز عبور شروع کنید.
✅ همانطور که کاربران ایمیل خود را تایپ می کنند، متوجه شوید که آیا SSO برای آنها فعال است یا خیر.
✅ اگر اینطور است، یک گزینه SSO-login را نشان دهید و یک پیش فرض برای آن تنظیم کنید.
✅ در غیر این صورت با ورود رمز عادی اقدام کنید.
✅ اگر کاربران باید از SSO استفاده کنند، قسمت رمز عبور را غیرفعال کنید - آن را پنهان نکنید.

بسته بندی

من شخصاً این رویکرد را آزمایش نکرده ام، اما ممکن است یک جایگزین خوبی برای لاگین های 2 صفحه ای - هم برای کاربران SSO و هم برای کاربران غیر SSO. البته به خاطر داشته باشید که احراز هویت SSO ممکن یا ممکن نیست نیاز به رمز عبور دارید، زیرا گاهی اوقات ورود از طریق Yubikey یا Touch-ID یا اشخاص ثالث (به عنوان مثال، OAuth) اتفاق می افتد.

همچنین، در نهایت، کاربران قفل خواهند شد. این فقط به زمان بستگی داره. پس استفاده کن لینک های جادویی برای بازیابی رمز عبور یا بازیابی دسترسی، اما آن را به عنوان یک گزینه ورود به سیستم اجباری نکنید. جابجایی بین برنامه ها کند است و باعث اشتباه می شود. در عوض، کاربران را تشویق کنید تا 2FA را فعال کنند: هم قابل استفاده و هم امن است.

و از همه مهمتر، جریان ورود خود را تست کنید با ابزارهایی که مشتریان شما به آنها اعتماد دارند. اگر برای ورود به سیستم به مدیران رمز عبور یا ابزارهای امنیتی اعتماد کنند، ممکن است تعجب کنید که تجربه آنها چقدر شکسته است. همه موفق باشید!

منابع مفید

با الگوهای طراحی رابط هوشمند آشنا شوید

اگر به بینش های مشابه در مورد UX علاقه مند هستید، نگاهی به آن بیندازید الگوهای طراحی رابط هوشمند، ما دوره 10 ساعتی ویدیویی با 100 نمونه عملی از پروژه های واقعی - با آموزش زنده UX در اواخر امسال. همه چیز، از فهرست های کشویی تا جداول پیچیده سازمانی - با 5 بخش جدید هر سال. پرش به یک پیش نمایش رایگان.

100 الگوی طراحی و نمونه های واقعی.
دوره 10h-video + آموزش زنده UX. پیش نمایش رایگان.

(Yk)