طراح تجربه کاربری در باسلام
چالش روان‌خوانی فونت در باسلام
فونت انجمن و مسئله روان‌خوانی
از بهمن ماه ۱۴۰۰ فونت «انجمن» برای باسلام انتخاب شد و در حال حاضر این فونت در پروداکت باسلام استفاده می‌شود. بر اساس بازخوردهای مختلف، فرضیه‌ای داریم که فونت انجمن به علت وزن بصری زیادی که دارد، فونت سنگینی است و این موضوع باعث پایین آمدن سهولت خوانایی و کاربردپذیری آن می‌شود. علاوه بر آن فاصله بین حروف و کلمات در فونت انجمن کم است. در یک مطالعه تازه انجام شده، عواملی که بر روان‌خوانی تأثیر می‌گذارند، مورد بررسی قرار گرفته است. این تحقیق نشان می‌دهد که تأثیرگذارترین عامل در روان خوانده شدن یک فونت، فاصله میان حروف و کلمات در آن است. از این رو، تصمیم گرفته شد که فونت‌های دیگری را برای مقایسه با فونت انجمن ارزیابی کنیم و ببینیم آیا فونتی وجود دارد که روان‌خوانی بهتری ارائه دهد یا خیر؟
کاندیداهای جایگزینی فونت انجمن
پس از بررسی گزینه‌های موجود فونت با کمک مدیر تیم طراحی گرافیک به کاندیداهایی مثل فونت‌های یکان بخ، قلم ری، آریا و دانا رسیدیم. از این بین دو فونت دانا و یکان بخ از این لحاظ که در مقایسه با بقیه کاندیداها از خوانایی بیشتری برخوردار بودند، گزینه‌های جدی‌تر برای جایگزینی با فونت انجمن شدند.
پارامتر دیگری که با اولویت پایین‌تری نسبت به سهولت و سرعت خوانایی برایمان اهمیت داشت، تمایز برندمان از پلتفرم‌های دیگر بود. دیجی‌کالا از یک فونت خانواده یکان در پروداکت خود استفاده می‌کند. بنابراین، فونت یکان بخ از نظر این پارامتر امتیاز پایین‌تری داشت. حال باید بررسی می‌کردیم که آیا کاندیدای دیگر، یعنی فونت دانا، روان‌خوانی بهتری از فونت انجمن دارد و آیا می‌تواند جایگزین مناسبی برای این فونت باشد یا خیر؟
از نظر طراحان فونت دانا، «فونت دانا تلاشی است برای خلق یک تایپ‌فیس هندسی و نزدیک به خط نسخ. هندسی بودن باعث می‌شود فونت دانا مدرن و معاصر به نظر برسد و وفاداری به شیوه نسخ باعث می‌شود در اندازه ریز و نوشته‌های طولانی خوانایی آن حفظ شود.»
بنابراین با طراحی تست‌هایی این فونت‌ها را از نظر سهولت خوانایی و زیبایی بررسی کردیم.
بررسی فاصله حروف و کلمات
همانطور که قبلا اشاره شد، فاصله میان حروف و کلمات در فونت انجمن کم است که می‌تواند یکی از علل کاهش روان‌خوانی این فونت باشد. در ادامه، این مورد را دقیق‌تر بررسی می‌کنیم و می‌خواهیم ببینیم که در مقایسه با فونت دانا، وضعیت این پارامتر چگونه است؟
تصویر اول شامل یک جمله است که با دو فونت انجمن و دانا، با سایز ۱۶ پیکسل و وزن regular نوشته شده است. طول این جمله در متن با فونت انجمن ۵۰۱ پیکسل و در متن با فونت دانا ۵۳۷ پیکسل است. این اختلاف در طول به دلیل فاصله بیشتر بین حروف و کلمات در فونت دانا بوده است.
در تصویر دوم، یک متن طولانی‌تر با دو فونت انجمن و دانا، با سایز ۱۴ پیکسل نمایش داده شده است. در اینجا نیز فاصله بیشتر میان حروف و کلمات در فونت دانا قابل مشاهده است. علاوه بر این، ارتفاع کمتری که حروف فونت دانا نسبت به فونت انجمن دارند، باعث می‌شود فواصل بین خطوط در فونت دانا بیشتر باشد و خطوط به ظاهر منظم‌تری بنظر بیایند.
ابزار تست و اجرا
به منظور سنجش گزینه‌های موجود فونت از نظر فاکتورهای زیبایی و خوانایی، دو نوع تست طراحی شد. با استفاده از تست ۵ ثانیه (five second test) دو فونت دانا و انجمن را از نظر میزان خوانایی بررسی کردیم و با به کارگیری تست ترجیحی (preference test) سلیقه کاربران را از نظر زیبایی در مورد سه فونت دانا، انجمن و یکان بخ سنجیدیم. اعضای جامعه هدف تست‌ها کاربرانی هستند که در ۷ روز گذشته حداقل یک صفحه محصول باسلام را بازدید کرده‌اند. تست‌ها به صورت آنلاین از طریق ابزار lyssna انجام شد. در ادامه جزئیات هر تست آمده است.
تست اول: تست ترجیحی (preference test)
در این تست، تصویر صفحه‌ای از پروداکت باسلام را با سه متغیر که فونت‌های متفاوتی دارند (انجمن، دانا، یکان بخ)، به کاربران نمایش دادیم و از آنها پرسیدیم که به نظرشان کدام فونت زیباتر است؟
سلیقه کاربران در مورد زیبایی را برای صفحات محصول، سبد خرید و جست‌وجو که از صفحات مهم و پرترافیک باسلام هستند، با سه گروه از کاربران سنجیدیم.
نتایج تست ترجیحی
همانطور که در جدول ملاحظه می‌شود، فونت انجمن با ۴۱ درصد بیشترین رأی را از نظر زیبایی از طرف کاربران کسب کرده است. فونت دانا با ۳۰.۸ درصد و فونت یکان بخ با ۲۸.۲ درصد در رتبه‌های بعدی قرار گرفتند. این اختلاف با توجه به تعداد پاسخ‌های کاربران به تست معنادار است. یکی از دلایل انتخاب فونت انجمن توسط کاربران می‌تواند به عادت مخاطب برگردد چرا که جامعه هدف تست از میان کاربران باسلام بوده‌اند و فونت انجمن به چشمشان آشناتر است.
تست دوم: تست ۵ ثانیه (five second test)
در این تست، یک تصویر از صفحه محصول باسلام را به مدت زمان کوتاهی (۱۵ ثانیه) در اختیار کاربران قرار داده و به آنها فرصت دادیم که در این مدت زمان با آن تعامل داشته باشند. تصویر را به دو گروه از کاربران نشان دادیم. به گروه اول با فونت انجمن و به گروه دوم با فونت دانا.
ازآنجایی که تایپ‌فیس‌های متن، برای انتقال اطلاعات در کم‌ترین و سریع‌ترین زمان هستند، بنابراین درک مطلب یکی از معیارهای سنجش یک فونت بهینه است. برای سنجش میزان درک مطلب مخاطب از متن، در انتها سوالاتی از محتوای متن از آنها پرسیده شد.
سوالات را از ۴ قسمت مختلف از طول صفحه پرسیدیم تا متوجه شویم که کاربر با اسکرول در صفحه موفق شده به چه میزان از متن را بخواند و درک کند. با این روش میزان خوانایی فونت‌ها را سنجیدیم و انتظار داشتیم کاربرانی که فونت خواناتر را می‌بینند، به میزان بیشتری به سوالات پاسخ درست بدهند.
سوالاتی که در انتها از کاربران پرسیدیم
۱. با حداقل چند تومان خرید از غرفه ارسال رایگان می‌شه؟
۲. برای جوشاندن آب بهتر است از چه وسیله‌ای استفاده کرد؟
۳. ارسال از کدوم شهر خواهد بود؟
۴. قیمت محصول چقدر است؟
نتایج ۵ ثانیه
همانطور که در جدول و نمودار ملاحظه می‌شود، درصد پاسخ‌گویی درست در هر دو گروه از کاربران بسیار به هم نزدیک است. با این‌حال در سوالات ۱ ، ۲ و ۴ کاربرانی که تصویر را با فونت دانا دیده‌اند به نسبت کاربرانی که آن را با فونت انجمن دیده‌اند، پاسخ درست بیشتری ثبت کرده‌اند. این اختلاف‌ها با توجه به تعداد کل پاسخ‌ها معنادار است.
پس به صورت خلاصه، فونت دانا از نظر درک مطلب و خوانایی با اختلاف جزئی برنده است.
نکته‌ها
- سوال ۲ به علت اینکه از یک متن طولانی پرسیده شده به نسبت سوالات دیگر که از بین تک کلمه‌ها یا از اعداد بوده‌اند، نرخ تبدیل پاسخ درست کمتری داشته.
- یکی از روش‌های افزایش دقت این تست، شمارش تعداد پلک زدن کاربر به عنوان شاخصی برای خستگی او است. زیرا حرکت چشم در هنگام خواندن شامل رفت‌وبرگشت‌ها و تثبیت‌های متعدد می‌شود. با هر تثبیت، عمل پلک زدن اتفاق می‌افتد. وقتی نیاز به تمرکز بیشتر برای خواندن و درک مطلب باشد، تعداد پلک زدن کاهش می‌یابد و در خواندن متن‌های طولانی موجب خستگی می‌شود. به علت محدودیت زمان و ابزار، از بررسی این مورد صرفنظر کردیم.
جمع‌بندی
کاندیداهای جایگزینی برای فونت انجمن را از نظر زیبایی و خوانایی بررسی کردیم. در تست زیبایی، ۴۱ درصد از کاربران، فونت انجمن را به عنوان زیباترین فونت انتخاب کردند. فونت دانا با ۳۰.۸ درصد و فونت یکان بخ با ۲۸.۲ درصد در رتبه‌های بعدی قرار گرفتند.
در مقایسه خوانایی و درک متن بین فونت‌های دانا و انجمن، فونت دانا با اختلاف جزئی برنده شد. سهولت و سرعت خواندن، مهم‌ترین عوامل در کاربردپذیری یک فونت هستند. ما فرض داشتیم که فونت انجمن به دلیل شلوغی و سنگینی، میزان درک و خوانایی را کاهش می‌دهد و در متن‌های طولانی باعث خستگی چشم کاربر می‌شود. میزان بهبودی هم که از ابتدا انتظار داشتیم در همین مقیاس درصد و دهم درصد بود. وقتی دو فونت که هر دو از لحاظ خوانایی در مجموع پیچیدگی خاصی ندارند، برتری یکی از آنها مقیاسش کوچک است.
در نهایت، با ترکیب نتایج تست‌ها و نظرات شهودی و تخصصی، تصمیم گرفتیم که فونت باسلام را به دانا تغییر دهیم. این تغییر به تمامی پروژه‌های باسلام در اپلیکیشن و وب مشتری و در فاز دوم به اپلیکیشن و وب غرفه اعمال خواهد شد.
واضح است که فونت یکی از عوامل تاثیرگذار در تمیزی و نظم صفحات و تعامل بهتر کاربر با آنها است. عوامل دیگری همچون تنظیمات همراستایی، یکدستی رنگ، اندازه و وزن فونت‌ها، فواصل مارجین‌ها و خطوط نیز تاثیرگذار هستند. بنابراین، همراه با تغییر فونت، بهبودهایی نیز با هدف تمیزتر و مرتب‌تر کردن صفحاتی مثل صفحه محصول انجام دادیم.
مطلبی دیگر از این انتشارات
روانشناسی تست نرمافزار: چرا فرآیند تست در سازمانها به درستی پیش نمیرود؟
مطلبی دیگر از این انتشارات
چطور نرمافزار باسلام را برای تبلیغات تلویزیونی مقیاسپذیر کردیم؟
مطلبی دیگر از این انتشارات
از خاکستر بحران تا نقشهی آینده: نقشه مناطق بمباران شده ایران