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

سادگی (Simplicity) چیست؟

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

دو رابط را کنار هم بگذارید. یکی نصف عنصرهای دیگری را دارد. کاربر لزوماً همان یکی را ساده‌تر نمی‌بیند.

تعریف

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

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

ادعایش هم روشن است: برای رسیدن به سادگی باید فکرتان را تمیز کنید، و این کار زحمت دارد.

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

همین‌جا مهم‌ترین ویژگی این مفهوم پیدا می‌شود. سادگی به‌سختی تعریف می‌شود و به‌سختی سنجیده می‌شود.

جو اسپارانو، طراح گرافیک آمریکایی، آن را در یک جملهٔ کوتاه می‌گذارد: طراحی خوب پیداست و طراحی بزرگ نامرئی است.

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

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

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

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

چهار راه رسیدن به سادگی

منبع چهار راه عملی را نام می‌برد. هر چهار راه، فاصلهٔ هدف و ابزار را کوتاه‌تر می‌کنند.

• - ۱. وضوح: رابط را برای هدف‌های اصلی کاربر بسازید و اطلاعات اضافی را از سر راهش بردارید.
• - ۲. خودکاری: رابط را طوری بچینید که کمترین توجه آگاهانه را بخواهد.
• - ۳. گزینهٔ کمتر: شمار انتخاب‌ها را محدود کنید تا رایحهٔ اطلاعات قوی بماند.
• - ۴. خلیج اجرای باریک‌تر: کاربر باید در نگاه اول ببیند محصول چطور به هدفش کمک می‌کند.

راه اول از همه پایه‌ای‌تر است. وضوح یعنی کاربر در چند ثانیهٔ اول بفهمد پیام صفحه چیست و چه کاری می‌تواند بکند.

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

منبع دو مقایسهٔ تاریخی می‌آورد. سایت شرکت گودَدی در سال ۲۰۰۵ آن‌قدر شلوغ بود که کاربر فراخوان روشنی برای گام بعدی پیدا نمی‌کرد؛ همان سایت یک دهه بعد بسیار خلوت‌تر شد.

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

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

یعنی آدم کارهای آشنا و تکرارشده را با کمترین توجه آگاهانه انجام می‌دهد. نمونهٔ منبع، توستر نان است.

توستر چند دهه است تقریباً تغییری نکرده. تعامل با آن آن‌قدر کم است که کاربر بی‌آنکه فکر کند احساس تسلط دارد.

همین منطق در اپ‌های پیام‌رسان هم دیده می‌شود. ظاهر و کارکردشان به هم شبیه است، پس کاربر بی‌زحمت از یکی به دیگری می‌رود.

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

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

محدودکردن گزینه‌ها همین رایحه را قوی می‌کند. تردید و سرگردانی کم می‌شود و کاربر کمتر به دکمهٔ بازگشت پناه می‌برد.

نمونهٔ روشنش ابزارک آب‌وهوا است. سایت‌های آب‌وهوا در دههٔ ۱۹۹۰ ده‌ها گزینه پیش کاربر می‌گذاشتند؛ ابزارک فقط دما را می‌دهد و یک شمایل تنظیمات برای عوض‌کردن مکان.

راه چهارم از دان نورمن می‌آید. او در کتاب «طراحی چیزهای روزمره» اصطلاح «خلیج اجرا» را به کار می‌برد.

خلیج اجرا فاصلهٔ میان هدف کاربر و راه اجرای آن هدف است. این فاصله یک شکاف روانی میان آدم و رابط سامانه است.

کاربر باید بتواند هدفش را به توانایی‌ها و محدودیت‌های سامانه ترجمه کند. هر چه این ترجمه سخت‌تر باشد، خلیج پهن‌تر است.

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

سایت آب‌وهوا خلیج پهن‌تری دارد. هدف کاربر همان است، اما راه‌های رسیدن به آن زیاد و پراکنده‌اند.

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

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

پیچیدگی از بین نمی‌رود؛ درزش جابه‌جا می‌شود

این بخش افزودهٔ من است، چون منبع چهار راه را می‌شمارد اما نمی‌گوید هزینهٔ هر چهار راه کجا می‌نشیند.

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

آن مقدار فقط جابه‌جا می‌شود. یا کاربر برش می‌دارد، یا سامانه.

پس مجموع پیچیدگی مثل نواری با طول ثابت است. تنها متغیر، جای درزی است که نوار را میان کاربر و سامانه تقسیم می‌کند.

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

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

یا می‌تواند همه را به کاربر پاس بدهد. یک فرم خالی، چند فیلد متنی، و یک لینک به آیین‌نامهٔ بار.

فرم خالی از دید عنصرشماری ساده‌تر است. برای کاربر سخت‌تر است.

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

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

پس آزمون درست پیش از هر برش این است: این کار به کدام طرف درز رفت؟ اگر پاسخ «به هیچ طرف» است، شما رابط را ساده نکرده‌اید؛ فقط کار را از دید خودتان پنهان کرده‌اید.

ساده برای چه کسی، و در کدام لحظه

این بخش افزودهٔ من است، چون سادگی صفتِ رابط نیست؛ داوریِ یک آدم در یک لحظهٔ مشخص است.

در نوشتهٔ اصل کیس گفتم که هر برش، کار را برای یک گروه ساده و برای گروه دیگری سخت می‌کند. آن بحث دربارهٔ «چه کسی» بود.

پرسش این بخش دیگری است: آن داوری در کدام لحظه گرفته می‌شود؟ چون یک رابط ثابت، در دو لحظهٔ متفاوت دو نمرهٔ متفاوت می‌گیرد.

لحظهٔ اول، نگاه نخست است. کاربر شلوغی را می‌بیند، نه دشواری را.

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

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

حالت اول، رابطی که در هر دو لحظه ساده است. این همان چیزی است که همه دنبالش‌اند.

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

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

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

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

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

لحظهٔ دوم را باید عمداً اندازه گرفت. کسی خودش را به شما نشان نمی‌دهد.

عنصر کمتر، همیشه تلاش کمتر نیست

این بخش افزودهٔ من است، چون «کمتر بهتر است» تا وقتی مرزش گفته نشود، به یک عادت بد تبدیل می‌شود.

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

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

در همهٔ این پنج مورد، نوار پیچیدگی کوتاه نشده است. فقط درزش به سمت کاربر لغزیده است.

راه سالم‌تر، پنهان‌کردن نیست؛ مرتب‌کردن است. افشای تدریجی دقیقاً همین کار را می‌کند: نگاه اول را خلوت نگه می‌دارد و کار کامل را در دسترس.

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

چه چیزی از سادگی سنجیدنی است

این بخش افزودهٔ من است، چون منبع می‌گوید سادگی سنجیدنی نیست و در عمل چند نمایندهٔ خوب برایش وجود دارد.

خودِ حس سادگی مستقیم سنجیده نمی‌شود. با این حال چند عدد به آن نزدیک‌اند.

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

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

سومی، نرخ عقب‌گرد است. هر بازگشت، نشانهٔ رایحهٔ ضعیف اطلاعات در گام قبل است.

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

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

در بافت فارسی

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

یک: سادگی با کم‌گویی اشتباه گرفته می‌شود. متن فارسی برای بیان یک مفهوم معمولاً بلندتر از متن انگلیسی درمی‌آید.

وقتی طراح یک چیدمان وارداتی را عیناً برمی‌دارد، جای متن کم می‌آید. آن‌وقت جمله را می‌بُرد تا در قالب جا شود.

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

دو: شمایل بی‌برچسب اینجا گران‌تر است. بخش بزرگی از شمایل‌های رایج رابط، ریشهٔ لاتین دارند.

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

سه: «کوتاه‌ترین مسیر» با آینه‌کردن جابه‌جا می‌شود. مسیری که در نسخهٔ چپ‌به‌راست کوتاه‌ترین بود، پس از آینه‌شدن همان‌جا نمی‌ماند.

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

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

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

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

جمع‌بندی

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