ویرگول
ورودثبت نام
yeganeh lavarian
yeganeh lavarian
خواندن ۲۵ دقیقه·۱۹ روز پیش

داستان طراحی محصول اپلیکیشن مرورگری

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

تو این مقاله میخوام راجب این موارد بنویسم:

  • ریدیزاین اپ مرورگری دارای چند سرویس
  • نویگیت کاربری در برنامه سوپر اپی
  • ریدیزاین صفحات سرویس های درون برنامه
  • نحوه ریکامند دادن بهتر سرویس ها
  • حل مشکلاتی که در این بازطراحی انجام دادم (توضیح در مقاله بعد)

"ذره بین" چیست؟

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

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

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

نسخه۱
نسخه۱

حالا چرا ذره بین وقتی گوگل هست !!؟؟

این سوال که "چرا با وجود گوگل، ذره‌بین؟" اغلب مطرح می‌شود. در پاسخ به این سوال، اولین نکته‌ای که باید به آن اشاره کنیم، بومی بودن ذره‌بین است. این مرورگر به طور خاص برای کاربران فارسی‌زبان طراحی شده و از این رو تجربه‌ای محلی و منطبق با نیازهای فرهنگی و زبانی کاربران ایرانی ارائه می‌دهد.
بسیاری از کشورها موتورهای جستجوگر بومی دارند که برای مخاطبان محلی خود طراحی شدند، تعدادی از موتورهای جستجوگر جهانی مانند گوگل، یاهو و بینگ، سهم زیادی از بازار جستجو را در سراسر جهان به خود اختصاص داده‌اند. برخی از موتورهای جستجوگر بومی محبوب:
Naver (کره جنوبی)
Baidu (چین)
Yandex (روسیه)
Seznam (جمهوری چک)
DuckDuckGo (جهانی)

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

سرآغاز داستان

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

پروسه دیزاین

برای شروع مسیر از رویکرد تفکر طراحی استفاده کردم.

مشکلات

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

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

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

بنابراین، بهتر است بررسی جامعی روی رقبا داشته باشیم تا با مدل ذهنی کاربران خود بیشتر آشنا شویم.

داده های اماری و تحلیل رقبا

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

یا توجه به این دیتا و سهمشان در بازار اطلاعات بیشتری رو در similar web‌ مورد بررسی قرار دادم و با توجه به میزان استفاده کاربران ایرانی این بنچ مارک رو شروع کردم.

بررسی مرورگرها
بررسی مرورگرها

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

بررسی مرورگرها
بررسی مرورگرها

حالا وقتشه که کاربرامون رو بشناسیم ؟

برای ارتباط با کاربرانمان، از تیم پروداکت و بازاریابی کمک گرفتیم.فوکوس گروپ برگزار کردیم. فعالیت‌های مختلفی را برای جمع‌آوری نظرات انجام دادیم، از جمله برگزاری جلسات فوکوس گروپ، ارسال نظرسنجی‌ها از طریق پیامک و پرسلاین و استفاده از ابزارهای مختلفی مثل Insider و Analytics .
همچنین، نظرات کاربران را در اپ استورها مورد بررسی قرار دادیم تا بهتر بفهمیم که چه نیازهایی دارند و چگونه می‌توانیم به آنها کمک کنیم.
در نتیجه تونسیم جواب های خوبی به سوال های زیر بدست بیاریم :
کاربر با استفاده از محصول میخواهد به چه برسد و چرا ؟


کاربر چه نیازها و خواسته هایی در زمینه انگیزه و هدف خود میخواهد برسد ؟


کاربر چه نوع فعالیت ها و هزینه هایی برای رسیدن به هدف انجام میدهد ؟ چرا ؟


کاربر از چه ابزار هایی برای رسیدن به هدف خود استفاده میکند چرا ؟


کاربران در چه دسته بندی هایی از عوامل روانشناختی - جغرافیایی - جمعیت شناختی و عوامل رفتاری قرار دارد؟


دلایل نصب کاربران فعال چیست ؟


سن کاربران فعال در چه محدوده ای است ؟


اشنایی با امکانات اپ از دید کاربران فعال چگونه است ؟
جنسیت کاربران فعال چیست ؟


دلایل حذف اپ از دید کاربران فعال چیست ؟


نحوه اشنایی کاربران فعال با اپ چگونه است ؟
اولویت کاربران فعال چیست ؟


پرسشنامه
پرسشنامه

با توجه به دیتاهای جمع اوری شده 5 دسته پرسونا مشخص شد که آن ها را در سه گروه دسته بندی کردیم 
گروه اول کاربران فعال و پر اهمیت ، گروه دوم اهمیت کمتر و گروه سوم پرسونای منفی هستند.

پرسونا
پرسونا

طراحی تست کاربرد پذیری از نسخه اولیه

دریافت فیدبک از کاربر در مورد اپ کنونی ذره‌بین را در قالب تست به ۳ بخش تقسیم کردیم

  • با توجه به نیازمندی ما برای دریافت فیچر از کاربران بخش اول که سوالات کلی است پرسیده میشود.
  • در بخش دوم رفتار کاربر و نیازسنجی آن برای جستجو مشاهده میشود.
  • در بخش آخر فیدبک کاربران نسبت به اپ کنونی گرفته میشود.
تست کاربرد پذیری
تست کاربرد پذیری

نقاط ضعف و قوت همه کاربران یکجا جمع اوری شده تا یک دید بهتری نسبت به ارتباط کاربران با اپ داشته باشیم و سپس برای هر کاربر نقشه همدلی ان کشیده شد.

نقشه همدلی
نقشه همدلی

بهبود نسخه اولیه

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

به دلیل برخی تصمیمات استراتژیک و نیازمندی های سازمان سرویس بازار از داخل اپ حذف شد و خدمات خود را به شکل یک تب در انجین دنبال کرد و به دنبال ان برخی سرویس ها هم اضافه و حذف شدند.

یه جمع بندی بکنیم و به ادامه مسیر بپردازیم .به عنوان یک اپلیکیشن مرورگر، هدفمان این است که ویژگی‌ها و امکانات مرور و جستجو را بهبود بخشیم .این باید باعث ایجاد یک تجربه کاربری یکپارچه، جذاب و بهینه شود.

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

توضیح مختصری راجب سرویس ها

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

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

اما کاربر رو چطور نویگیت کنیم ؟

برای ایجاد قانونی که کاربرها به راحتی بتونن در اپ گشت و گزار کنند ما چند تا نکته رو در نظر گرفتیم .
۱. جانمایی هر اکشن برای نویگیشن پایین صفحه 
این قانون این طور چیده شد که هر سرویس ۵ صفحه برای نویگیشن پایین صفحه میتواند داشته باشد که قسمت راست ترین برای صفحه اصلی هر سرویس و چپ ترین برای جانمایی پروفایل است . قسمت وسط هم جایی برای دستیار چیده شده . دستیار به صورت یک رفتار ثابت و به صورت یک مکالمه چت بات با کاربر ، در همه نویگیشن ها قرار گرفته و کاری که میکنه سولت دسترسی محتوا در کل اپ است 
2. برگشت به صفحه اصلی ذره بین 
در هر سرویس و در در صفحه اصلی ان ما باید یک دسترسی ای برای رسیدن به صفحه اصلی ذره بین میزاشتیم که این را با یک دکمه خانه در نویگیشن بالایی در نظر گرفتیم .در صفحات داخلی هم از نام صفحه به همراه دکمه بک استفاده میشود.دکمه خانه بازگشت به صفحه اصلی و دکمه بازگشت به صفحه اصلی ان سرویس میرود 
۳. نام هر صفحه و سرویس 
نام هر سرویس هم به صورت ثابت در نویگیشن بالایی برای آگاهی بیشتر کاربر در جایی که قرار داره در صفحه قرار گرفته است

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


نویگیشن بالای صفحه

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


در چه صفحاتی نویگیشن پایین رو میتونیم حذف کنم ؟

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


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


حالا که قراره نویگیشن داخلی هر سرویس حذف شه پس چطور باید کاربر رو نویگیت کرد؟

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

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

در تصویر زیر میبینیم در هر سرویس چه بخش هایی وجود دارد و چه بخش هایی مشترک هستند

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

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

اسکچ چیدمان پیشنهادی برای سرویس ها

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

در دسترسی پذیری شصت دست با استفاده از گوشی موبایل، قوانین تجربه کاربری مهمی وجود دارند. این شامل سادگی(Simplicity)، قابلیت دسترسی(Accessibility)، پیش‌بینی و یکپارچگی(Predictability) است. هدف این قوانین ارائه یک تجربه استفاده قابل فهم، آسان و بی‌محدود برای همه کاربران است. این اصول باعث بهبود تجربه کاربری و افزایش کارایی در استفاده از گوشی موبایل می‌شوند.

اسکچ  پیشنهادی
اسکچ پیشنهادی
وایرفریم طرح پیشنهادی
وایرفریم طرح پیشنهادی

انواع مسیر های پیشنهادی با در نظر گرفتن چالش های هر کدام در جدول زیر بررسی شد

 بررسی مسیر های پیشنهادی
بررسی مسیر های پیشنهادی

نتیجه نهایی در سرویس ها

در نهایت، توانستم به این شیوه نتیجه کار را ارائه دهم.


طرح یک نیازمندی و چالش در سرویس ها

بنا به درخواست مدیر پروژه، عکس بنری به ابتدای هر صفحه لندینگ اضافه شد. با این حال، من به دلیل دو دلیل اصلی مخالفت داشتم:

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

✖️یکی از چالش‌های موجود در این مسیر، دسترسی سرویس‌ها به یکدیگر بود، همچنین نباید فراموش کرد که دسترسی به صفحه اصلی ذره‌بین نیز مهم است. برای حل این مسئله، ۳ مسیر را ارائه دادم (تمرکز بر هماهنگی بیشتر در داخل سرویس‌ها بود )


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

بررسی نویگیشن پایین

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

باتوجه به ثابت بودن نویگیشت کاربر ابتدا باید به این سوال پاسخ دهیم که کاربر به چه المان هایی همیشه نیاز داره ؟
ما نیاز به 5 جایگاه داریم، که یکی از این جایگاه‌ها مخصوص سرویس دستیار است. حالا، چگونه باید 4 جایگاه دیگر را پر کنیم تا بخش‌های مورد نیاز کاربر در دسترس قرار گیرند؟

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

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

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

نتیجه نهایی

✅❇️ بازگشت به بررسی صفحه اصلی

بررسی دیزاین صفحه اصلی - نحوه معرفی سرویس ها

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

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

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

بنچ مارکی که انجام شد با تمرکز بر این دو مورد بود

  • بررسی مستقیم رقبا (موضوعی)
  • بررسی غیر مستقیم رقبا (بررسی از نظر سرویس های قابل ارائه در اپ)

✅راه حل

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

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

ابتدا به سراغ رقبای اصلی‌مان که شامل Yandex، Hi Browser، Yanii App، Bing App، و Petal هستند، می‌رویم. در این بخش، بر نحوه ارائه سرویس‌های آن‌ها و شیوه جابه‌جایی بین سرویس‌ها تمرکز کردم که برای کاربران و کسب‌وکارها بسیار حائز اهمیت است.

  • نکته از مقاله recommend guildline از nngroup در مورد نحوه ریکامند خوندم که میگفت :
    سرویس ها یا مطالب مهمی که میخواهیم مورد توجه کاربر باشد حتما باید در بالای صفحه و بخش ابتدایی صفحه باشد چون کاربران زیاد اسکرول نمیکنند.
    محتوای تولید شده شخصی نسبت به نحتوای عمومی ارزش زیادی دارد . این به این معناست ک اگر میخواهیم پیشنهادی برای کاربر بیاریم این پیشنهاد کاستومایز شده و طبق سلیقه کاربر باشد. (شخصی سازی محتوای پیشنهادی )
  • کاربران از چیز های جدید و تازه موجود در اپ خبر ندارند و ان ها باید جزو موارد پیشنهادی در اپ باشند 
  • توضیح مختصر در باره ی سکشن پیشنهادی

نکات دیگر مقاله ها :

  • 79 درصد از کاربران وب به جای خواندن صفحه، آن را اسکن می کنند. اگر بازدیدکنندگان را مجبور کنیم که از پیشنهاد ما مطلع شوند، نرخ تبدیل کاهش می یابد.
  • کاربر چه چیزی می داند ؟ چقد از قبل میداند تا بتوانیم محتوا را طبق نظر کاربر قرار دهیم تا ان ها را متقاعد کنیم  (نیاز به تست)
  • طبق قانون هیک زمان تصمیم گیری با تعداد و پیچیدگی انتخاب هایی که داریم افزایش پیدا میکند و باید تا حد ممکن از نمایش دستای زیاد و پیچیده برای کاربر جلوگیری کنیم  ( جلوگیزی از نمایش سروس در سرویس - لندینگ های جدا برای هر کدوم - داشتن سرویس هایی ک برای کاربران ارزسی خلق نمیکنند.

موردی که ما حتما باید برای جانماییش بهش توجه میکردیم که از طرف تیم مارکتینگ بود وجود جایی برای بنر در صفحه اصلی بود برای این منظور بهتره نکات زیر را مرورکنیم

  • بررسی بنر ها :
    بر اساس مطالعه ای که توسط InMobi انجام شده، بنرهای موبایل دارای میانگین نرخ کلیک (CTR) 0.35٪ هستند که بالاتر از سایر اشکال تبلیغات موبایلی مانند تبلیغات بینابینی (0.23٪) و تبلیغات بومی (0.30٪) است.
  • بنرها یادآوری برند را بهبود می‌بخشند: مطالعه‌ای توسط گوگل نشان داد که تبلیغات بنری می‌تواند یادآوری برند را تا 46 درصد بهبود بخشد و آنها را به ابزاری مؤثر برای ایجاد آگاهی و شناخت برند در میان کاربران تبدیل می‌کند.
  • بنرها باعث افزایش تبدیل ها می شوند: طبق مطالعه ای که توسط eMarketer انجام شده است، تبلیغات بنری با نرخ تبدیل 8.6٪، درست پس از بازاریابی ایمیلی (9٪) دومین شکل موثر تبلیغات دیجیتال برای ایجاد تبدیل است.
بررسی مستقیم رقبا
بررسی مستقیم رقبا


چون دیجی کالا و اسنپ هم دارای سرویس های مختلف بودند میتونیم به عنوان رقبای غیر مستقیم بررسی کنیم

برای تعداد سرویس هایی که میخواهیم در لندینگ به کار ببریم  طبق قانون‌ میلر باید تعدادشون (2 ± 7) باشد تا  کاربران بتوانند سرویس ها  را در حافظه خود نگه دارند . که این رفتار را در اپ های موجود که در بالا بررسی شده مشاهده میکنیم .
 در اپ هایی که در بنچ مارک مستقیم بررسی شدند مشاهده شده که اگر در لندینگ  سرویس دیسکاوری باشد نیازی به ریکامند دادن سرویس های داخلیمون نیست اما اگر دیسکاوری در صفحه لندینگ نباشد میتوانیم مانند you app و یا با نوع نمایش متفاوت دیگر سرویس هامون رو پیشنهاد بدیم


بررسی دیتای اپ

برای تغییر باید امار های فعلی روهم در نظر داشته باشیم

معماری اطلاعات صفحه اصلی

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

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

اسکچ و ایده پردازی

پیشنهاد ها و اسکچ هایی که من برای این صفحه داشتم :

1.حذف سرویس دیسکاوری از صفحه اصلی  و معرفی سرویس هامون به صورت ماژول یا ویجت

۲.

۳.

۴.

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


نتیجه های نهایی در دیزاین

مدل های مختلفی برای هر سرویس بر اساس نیازمندی های مدیر محصول دیزاین شده و دائم در حال امتحان مدل های استتیک و داینامیک میباشیم تا ببینیم کدوم حالت برای کاربر بهتر و کاربردی تر است .

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

نوشتار در محصول (writing)

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

به همین علت در یک سندی تمام جمله های به کار رفته در برنامه را جمع اوری کردم و تغییر لحن را روی ان اعمال کردم .

تست کاربرد پذیری از نسخه جدید

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

پرتوتایپ اماده شده قبل از انجام تست
پرتوتایپ اماده شده قبل از انجام تست

سوال های تست همراه یا اهداف هر کدومشون

سوال های تست
سوال های تست

تست کاربرد پذیری از ۵ نفر با تخصص های مختلف گرفته شد تا همه پرسوناهامون رو در بر بگیره . نتایج خیلی خوبی داشت که در ادامه مسیر های موفق و ناموفق ان رو خلاصه کردم تا چکیده تست رو به دست تیم های دیگ برسونم

نتیجه تست
نتیجه تست

جمع بندی میزان موفقیت مسیر های مهم

جمع بندی  تست
جمع بندی تست

در ادامه مسیر دو تست SUS و NPS را انجام دادم و تحلیل کردم . و بعد نکات و چالش هایی که در طول مسیر انجام دادم رو بازرسی کردم و سعی در حلشون داشتم که میتونید در این مقاله راجبش بخونید

و درنهایت با یک تست کاربردپذیری مسیر های مختلف رو مورد بررسی قرار دادم و در نهایت به یک جمع بندی رسیدم که شامل چندین تسک برای بررسی مجدد شد ، به دلیل تعداد زیاد تسک ها و با توجه به استراتژی های جدید سازمان وقت و زمان برای پرداختن به همه آن ها را نداشتیم ، برای اولویت در انجام تسک ها از دو جدول مسکو ( MoSCoW )و فوربز (furps) استفاده کردم.

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



سخن پایانی

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

نمایی از نسخه اولیه و نسخه های باز طراحی شده در قسمت مرورگری ذره بین




تجربه کاربریرابط کاربریطراحی محصولکیس استادیمطالعه موردی
شاید از این پست‌ها خوشتان بیاید