منبع: بنیاد طراحی تعامل (IxDF) · بازنویسی آزاد: سپنتا پویا · مرداد ۱۴۰۵ · زمان مطالعه: حدود ۹ دقیقه

یو‌ایکس رایتینگ (UX Writing) چیست؟

💡 این متن «بازنویسی آزاد» است: ایده‌ها و مفاهیم مطلب اصلی با نگارش کاملاً مستقل فارسی و مثال‌های تازه بازگو شده‌اند و ترجمهٔ کلمه‌به‌کلمه نیست. متن کامل اصلی به‌همراه همهٔ تصاویر در لینک انتهای صفحه در دسترس است.

یو‌ایکس رایتینگ یعنی نوشتن متنی که در دل تجربهٔ کاربری زندگی می‌کند. همهٔ آن کلمه‌هایی که معمولاً کسی آن‌ها را «محتوا» حساب نمی‌کند: اعلان‌ها، عنوان‌ها، برچسب دکمه‌ها، دستورالعمل‌ها، توضیح فیلدها، پیام‌های خطا و هشدارها. هدفش هم روشن است — کاربر بفهمد چه خبر است و بتواند کارش را جلو ببرد.

در مقالهٔ طراحی تعامل دیدیم که «کلمه‌ها» بُعد اول طراحی تعامل‌اند. این نوشته دربارهٔ همان بُعد اول است — بُعدی که در بیشتر تیم‌ها آخر از همه و با کمترین دقت پر می‌شود، معمولاً چند ساعت پیش از انتشار و توسط کسی که وقتش خالی بوده.

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

تفاوتش با کپی‌رایتینگ تبلیغاتی

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

تفاوت را در یک جمله می‌شود دید. کپی‌رایتر می‌نویسد «سفر رؤیایی‌ات را همین امروز شروع کن!» و یو‌ایکس رایتر می‌نویسد «تاریخ رفت و برگشت را انتخاب کنید». اولی در صفحهٔ فرود درست است، دومی بالای تقویم. جابه‌جا کردنشان هر دو را خراب می‌کند — و رابطی که با لحن تبلیغاتی نوشته شده باشد، در لحظهٔ انجام کار فقط سر راه کاربر است.

نکتهٔ ظریف‌تر: یو‌ایکس رایتینگ ضدّ فروش نیست. فقط می‌داند که در لحظهٔ استفاده، کمک‌کردن بهترین شکل فروش است.

وقتی کلمه نباشد، کاربر حدس می‌زند

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

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

پنج محک متن خوب

• - ۱. دسترس‌پذیر: زبان ساده — منبع اصلی سطح خوانایی پایین‌تر از کلاس هفتم را پیشنهاد می‌کند — و متن جایگزین برای هر عنصر بصری، از آیکن‌ها تا نشانه‌های تعامل.
• - ۲. هدفمند: کاربر باید از روی متن بفهمد که با این محصول به هدفش می‌رسد. اگر صفحهٔ اول محصول شما نمی‌گوید اینجا چه کاری انجام می‌شود، متن کار نکرده است.
• - ۳. موجز: برچسب دکمه‌ها سه کلمه یا کمتر؛ توضیح‌ها کوتاه و حداکثر در حدود چهار سطر. اما دقت کنید: هدف کوتاهی نیست، هدف کوتاهیِ بدون ابهام است. جمله‌ای که سه کلمه‌ای شده اما دو معنا دارد، بدتر از جملهٔ بلندِ روشن است.
• - ۴. محاوره‌ای: زبان باید طبیعی باشد و دستورالعمل‌ها به همان ترتیبی بیایند که یک آدم می‌گوید. «قبل از ذخیره، فایل را انتخاب کنید» بد است؛ «فایل را انتخاب کنید، بعد ذخیره بزنید» خوب است.
• - ۵. شفاف: کاربر نباید حدس بزند. انیمیشن بارگذاری باید کلمهٔ «در حال بارگذاری» را هم داشته باشد، و پیام خطا باید بگوید چطور مشکل حل می‌شود.

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

پیام خطا: جایی که بیشترین آسیب و بیشترین فرصت است

تفاوت این دو فرم، تفاوت میان «یک جای کار می‌لنگد، خودت پیدا کن» و «این فیلد، این مشکل، این راه‌حل» است. پیام خطای خوب سه کار می‌کند: می‌گوید کجا مشکل است، چه مشکلی است، و چطور حل می‌شود. و تا جای ممکن باید کنار همان فیلد بنشیند، نه در بالای صفحه.

یک نکتهٔ لحن هم هست: پیام خطا جای شوخی‌های زیادی نیست و مطلقاً جای سرزنش‌کردن کاربر نیست. «ایمیل نامعتبر است» بهتر از «شما ایمیل را اشتباه وارد کردید» است، چون دومی انگشت اتهام را به سمت آدمی می‌گیرد که فقط می‌خواسته ثبت‌نام کند.

الگوهای رشته‌ای

مفهوم کاربردی دیگری که منبع معرفی می‌کند الگوی رشته‌ای (String Pattern) است: قالب‌های قابل‌استفادهٔ مجدد برای انواع متن — عنوان‌ها، دکمه‌ها، توضیح‌ها و اعلان‌ها. مثلاً قرار می‌گذارید همهٔ پیام‌های تأیید با ساختار «فعلِ انجام‌شده + مفعول» نوشته شوند: «پروژه ذخیره شد»، «دعوت ارسال شد».

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

چه کسی این متن‌ها را می‌نویسد؟

این نمودار — که به توری پادمایرسکی، نویسندهٔ کتاب Strategic Writing for UX، بازمی‌گردد — نقش‌ها را روی سه محور می‌چیند: تعامل زبانی، تعامل بصری و لمسی و راهبرد. یو‌ایکس رایتر و طراح محتوا در تلاقی زبان و تعامل بصری می‌نشینند؛ نویسندهٔ فنی به سمت زبان متمایل است؛ راهبر محتوا میان زبان و راهبرد؛ و طراح محصول و مالک محصول در ضلع‌های دیگر.

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

چند نکته که مخصوص نوشتن فارسی است

این بخش افزودهٔ من است، چون منبع طبیعتاً به انگلیسی فکر می‌کند و چند مسئلهٔ ما در آن نیست:

• - ترجمهٔ تحت‌اللفظی برچسب‌ها را رها کنید. Submit در فارسی «ثبت» یا «ارسال» است، نه «تسلیم». برچسب باید بگوید چه اتفاقی می‌افتد، نه اینکه معادل واژگانی انگلیسی باشد.
• - روی یک صورت فعل بمانید. «ذخیره کن» یا «ذخیره کنید» یا «ذخیره» — هر کدام را انتخاب کردید، در کل محصول همان بماند. مخلوط‌کردن امری مفرد و جمع، سریع‌ترین راه بی‌شخصیت‌شدن یک رابط است.
• - نیم‌فاصله را جدی بگیرید. «می شود» و «می‌شود» برای خواننده یکسان نیستند؛ اولی متن را غیرحرفه‌ای نشان می‌دهد.
• - ارقام و جهت را بررسی کنید. در رابط راست‌به‌چپ، شماره‌ها، تاریخ‌ها، ایمیل و نشانی وب باید در بستر LTR درست بنشینند وگرنه شکسته دیده می‌شوند.
• - مراقب طول متن باشید. ترجمهٔ فارسی معمولاً از انگلیسی بلندتر می‌شود؛ دکمه‌ای که در طرح انگلیسی جا می‌شد، ممکن است در فارسی دو خطی شود. این را در وایرفریم امتحان کنید، نه بعد از پیاده‌سازی.
• - واژهٔ تخصصی را با معادل رایج بنویسید، نه با معادل درست ولی ناآشنا. اگر کاربران شما به آن می‌گویند «لاگین»، «ورود به سامانه» ممکن است دقیق‌تر باشد اما کندتر فهمیده می‌شود.

جمع‌بندی

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