چطور صفحات خالی یا empty stateها را طراحی کنیم؟

حالت‌های خالی یا empty stateها به چه صفحاتی گفته می‌شود؟

حالت‌های خالی یا empty stateها اسکرین‌هایی در UI هستند که هنوز با اطلاعات پر نشده‌اند و وقتی پر می‌شوند که کاربر یک سری task مشخص را کامل کند.

هرچند طراحی خوب یک empty state باعث نمی‌شود محصول شما موفق‌ترین و بهترین محصول جهان باشد، اما کمی توجه به جزئیات تاثیر بالایی در تجربه کاربری محصول شما دارد و به قول معروف :

The devil is in the details !

از empty stateها می‌توان استفاده‌های زیادی کرد. مثلا می‌توان در empty stateها از کاربرها خواست یک action خاص را انجام دهند، درباره پروداکت شما آموزش ببینند یا حتی شخصیت یا personality برندتان را مشاهده کنند.

به empty state های‌تان شخصیت بدهید!

یکی از جاهایی که می‌توانید از آن برای نمایش دادن شخصیت برندتان استفاده کنید empty state ها هستند. (استفاده از شخصیت برند لزوما به معنای استفاده از شوخی و المان‌های طنز نیست).

گایدلاین‌های متریال دیزاین درباره empty state را از این‌جا می‌توانید بخوانید.

از empty state برای آموزش محصول‌تان به کاربر استفاده کنید

حالت‌های خالی یا empty stateها نقش مهمی در پروسه‌های onboarding دارند، علی‌الخصوص در جاهایی که نیاز است کاربر یک task مشخص را انجام دهد تا بتواند از محصول شما استفاده کند.

از کاربر بخواهید کاری انجام دهد

یک نکته مهم در empty stateها این است که این حالت‌ها نباید کاربر را به بن‌بست برسانند. با یک call to action ساده در این صفحات می‌توانید کاربر را به مسیر درست هدایت کنید.

درباره empty stateها و اهمیت‌شان این‌جا می‌توانید بیشتر بخوانید.

سبد خرید خالی

برای کاربرانی که روی سبد خالی کلیک می‌کنند، باید سعی کنیم آن‌ها را به مسیر خرید راهنمایی کنیم. می‌توان با دادن call to action کاربرها را به صفحات پیشنهاد خرید هدایت کرد یا برای این که این مسیر حتی ساده‌تر باشد، این پیشنهادات را در سبد خرید خالی قرار داد

درباره طراحی سبد خرید خالی این‌جا می‌توانید بیشتر بخوانید.

چند نمونه سبد خرید خالی

در سبد خرید خالی فروشگاه‌های بزرگ آنلاین مثل aliexpress، amazon و etsy، تلاش بر این است که کاربر به مسیر خرید هدایت شود. این کار با دادن پیشنهادات مختلف برای خرید انجام می‌شود.

با توجه به این‌که 35% از درآمد amazon از پیشنهاداتی است که برای خرید به کاربرها می‌دهد، یکی از بهترین الگوها در بررسی پیشنهادات در سبد خالی amazon است. در سبد خرید خالی وب‌سایت amazon، پیشنهادات مختلفی برای هدایت کاربر به خرید وجود دارد.

سبد خرید خالی باسلام

با توجه به مواردی که گفته شد، سبد خرید باسلام را ریدیزاین کردم : )

درباره usability در سبد خرید این‌جا می‌توانید بیشتر بخوانید.