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