امین سهرابی
امین سهرابی
خواندن ۷ دقیقه·۵ سال پیش

صفحه آغازین (Splash)، ساخت تجربه بهتر برای کاربران

سلام، امیدوارم حالتون خوب باشه. این اولین نوشته من توی ویرگوله و چند وقتی بود که میخواستم بنویسم ولی نمیدونستم از کجا شروع کنم و چطور! از تجربه‌هام بنویسم یا از چیزایی که خودم باهاش درگیر هستم همین الان. از اونجایی که هنوز خودم رو در حدی نمیدونم که بخوام در زمینه طراحی محصول چیزی رو آموزش بدم، تصمیم گرفتم همزمان که دارم مقاله‌های انگلیسی رو میخونم ترجمه شده‌ش به صورت خلاصه رو هم اینجا بذارم که همزمان با هم یاد بگیریم. اولین پست هم درباره صفحه آغاز یا همون Splash از invision inside design هست که چند روز پیش کیارش آمالی‌وند عزیز توی یکی از گروه‌ها فرستاد و من تصمیم گرفتم اینجا بذارمش. پس توی متن منظورم از صفحه آغاز همون Splash Page هست.

صفحه آغاز، یک خوش‌آمدگویی برای تجربه بهتر کاربران

فرقی نمی‌کند که شما برای اولین بار به یک هتل خیلی مجلل وارد شوید و فردی به شما خوش‌آمد بگوید یا اینکه برای اولین بار وارد یک اپلیکیشن موبایل شوید؛ در کسری از ثانیه تصمیم می‌گیرید که میخواهید بمانید یا بروید.

حال باید به این موضوع بپردازیم که طراحان محصول چگونه یک تاثیر اولیه ماندگار را در نبود دستگیره طلاکاری شده درب هتل و یا فرد خوشآمدگو ایجاد کنند؟ جواب این سوال همان صفحه آغازین (Splash) است. یک صفحه معرفی ساده که تجربه کاربری خوشایندی ایجاد می‌کند و همچنین تجربه بدِ تاخیر برای بارگذاری اپلیکیشن را به یک تجربه خوب تبدیل کند.

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

اما باید بدانیم که یک صفحه آغازین موثر می‌تواند حس خوبی را در اولین برخورد کاربر در او ایجاد کند. در ادامه به بررسی اینکه چرا صفحات آغازین ضروری هستند می‌پردازیم – البته نه برای همه اپ‌ها، وبسایت‌ها و یا محصولات. برخی مثال‌های خوب و کاربردی را با یکدیگر مرور خواهیم کرد که می‌توانید از آن‌ها برای طراحی‌های خودتان الهام بگیرید.

صفحات آغازین چه صفحاتی هستند ؟؟؟

صفحه‌ی آغازین یک معرفی کوتاه از محصول شماست که هنگام اجرای اپلیکیشن شما توسط کاربر، به نمایش گذاشته می‌شود. مانند:

معمولا صفحات آغازین شامل لوگو و نام شرکت، رنگ و بک‌گراند گرافیکی برند و لودینگ مخصوصشان است. این صفحات باعث شناساندن مشخصات برند در ذهن کاربران می‌شوند.

تاریخچه و ریشه صفحات آغازین چیست ؟

در گذشته و در صنعت داستان‌های کُمیک، در مجلات قبل از شروع داستان کمیک، یک صفحه به عنوان صفحه آغازین (splash) وجود داشت که دارای یک تصویرسازی بزرگ با جزییات زیاد بود که معرف داستات کمیکی بود که در ادامه قرار بود توسط کاربر خوانده شود. همچنین توجه کاربر نیز با این صفحه به داستان جلب می‌شد و او را وارد مود خواندن داستان کمیک می‌کرد.

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

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

بهترین وسیله برای خوش‌آمد گویی به کاربرانتان همین صفحات آغارین هستند. به این طراحی‌ها توجه کنید:

تیک‌توک و چِفزفید
تیک‌توک و چِفزفید


یونایتد و یاملی
یونایتد و یاملی


اوپن‌تیبل و لیم
اوپن‌تیبل و لیم


ویز و بیت‌موجی
ویز و بیت‌موجی


ردیت و توییچ
ردیت و توییچ


چرا از صفحات آغازین استفاده کنیم؟

در سال‌های گذشته که سرعت اینترنت و دیوایس‌ها حال و روز خوبی نداشت، این صفحات برای خریدن زمان استفاده می‌شد. زمانی که در وبسایت و اپلیکیشن رابط کاربری آن‌ها درحال بارگذاری بود. اما امروزه با رشد تکنولوژی و افزایش سرعت اینترنت، سرعت بارگذاری نیز بسیار افزایش یافته است و به نظر میرسد که دیگر به صفحات آغازین نیازی نداشته باشیم. اما باید بدانیم هنوز هم این صفحات اهدافی را دنبال میکنند که وجوشان را ضروری میکند.

دلیل اول: خوشآمدگویی و خلق تجریه خوب برای کاربران

یک تجربه کاربری عالی از زمانی که کاربر به اپلیکیشن وارد می‌شود آغاز می‌شود. صفحات آغازین این حس را برای کاربران ایجاد می‌کند که "ما میدانیم شما اینجایید"

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

فرض کنید به رستورانی میروید و یکی از کارکنان رستوران شما را تا نزدیکی میز مورد نظرتان همراهی میکند. و به شما این حس را القا میکند که به شما اهمیت می‌دهند. این یک تماس و رفتار بسیار کوچک و ناچیز است اما باعث خلق تجربه بهتر می‌شود. اگر این یک اتفاق خوشایند و مثبت باشد از اینجا به بعد خوشحال نگه داشتن کاربر کار بسیار ساده است. اما اگر همان تجربه اولیه حس ناخوشایند و منفی داشته باشد یک جبهه‌گیری منفی نسبت به اپلیکیشن شما ایجاد می‌شود که به سختی می‌توان آن را به حس خوب تبدیل کرد.

دلیل دوم: مشاهدات و انتظارات کاربران از اپلیکیشن خود را مدیریت کنید

بر اساس گفته نویسنده و مشاور کسب و کار، دیوید میستر، محاسبه رضایت کاربران از محصول یک فرمول ساده اما کارا است.

رضایت=مشاهدات-انتظارات

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

به مثال رستوران برگردیم، فرض کنید گارسون زمان آماده شدن غذا را بیشتر از چیزی که خودشان هم انتظار دارند به شما اعلام کند، سپس هنگامی که غذا آماده می‌شود شما این را حس می‌کنید که غذا زود آماده شده و خوشحال می‌شوید. و یا اینکه نصب آینه در سالن رستوران باعث می‌شود مهمانان هنگام انتظار حواسشان پرت شود زمان انتظار برایشان کوتاه شود.

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

دلیل سوم: کمرنگ کردن تاخیر هنگام بارگذاری اپلیکیشن

منتظر ماندن‌های غیرمشخص همیشه بیشتر از منتظر ماندن‌های محدود طول خواهد کشید. اینکه دیگر صف‌های فروشگاه زودتر از شما حرکت می‌کنند نیز به همین دلیل است. حتی کسانی که برای ورود به هواپیما با اینکه میدانند کل مسافران هواپیما با هم می‌رسند اما باز هم زودتر داخل صف ورود می‌روند نیز به همین دلیل است.

نگرانی هنگام انتظار باعث می‌شود که آن انتظار بیشتر طول بکشد. کاربرانی که نمیدانند که اپلیکیشن هنوز در حال بارگذاری است و یا نه، بیشتر زمان انتظار را حس می‌کنند. همه می‌دانیم که حتی در نسخه‌های پریمیوم اپلیکیشن‌ها هم انتظار برای بارگذاری امری اجتناب‌ناپذیر است.

صفحات انتظار باعث کاهش نگرانی کاربران می‌شود و این امر را برای آن‌ها روشن می‌کند که اپلیکیشن در حال بارگزاری اطلاعات است. گاهی نشان دادن بازخوردی پویا از عملیات بارگذاری می‌تواند بسیار مفید باشد.

بهترین صفحه انتظار میتواند نبود این صفحه باشد!!

اگر بدانیم که زمان زیادی برای بارگذاری نیاز نیست، آیا باز هم داشتن صفحه انتظار ارزشمند است؟

طراحی یک تجربه کاربری بی‌نقص به معنی کاهش حداکثری اصطکاک موجود است و صفحات انتظار بیجا اصطکاک‌های غیر ضروری را ایجاد می‌کنند.

درواقع اکثر کاربران هیچ اهمیتی به برند نمی‌دهند. دیوایس‌های مدرن و جدید بارگذاری اطلاعات را در یک چشم به هم زدن انجام ‌می‌دهند. صفحات انتظاری که به صورت اشتباه به کار رفته باشند و در واقع هیچ ارزشی را خلق نکنند باعث ایجاد اختلال در تجربه کاربر می‌شوند.

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

بهترین نمونه‌های صفحات انتظار چه چیزهایی هستند ؟

این صفحات انتظار در رنگ‌ها و حالت‌های مختلف ساخته شده‌اند و جالب است بدانیم که اکثر آن‌ها می‌توانند نمونه خوبی برای این صفحات باشند.

ساده طراحی کنید، اما معمولی نباشید.

صفحات آغازین باید نگاه‌ها را به خود جلب کند و کاربران جدید را به نوعی دعوت کند. در واقع دلیلی باشد که همیشه سمت اپلیکیشن ما باشند.

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

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

تجربه کاربریاسپلشsplash pageuxصفحه آغاز
راهبر طراحی محصول در Browse AI
شاید از این پست‌ها خوشتان بیاید