Tips for creating user interface
در اکثر موارد وقتی که کاربری برنامه‌ای رو برای اولین بار اجرا میکنه٬ اگر به هر دلیلی رابط کاربر (User Interface) برنامه مورد پسندش قرار نگیره دیگه فرصت اجرای دوباره‌ای به برنامه نمیده و یک راست میره سراغ برنامه‌ی مشابه دیگه‌ای که رابط کاربرش راه دستش باشه و حق هم با کاربره. کاربر کاری به این نداره که برنامه شما چقدر توانایی داره و اون یکی چقدر٬ براش مهم اینه که با اون یکی برنامه زندگی براش راحتتره.
کاربر می‌خواد وظایفی رو به کمک برنامه سریعتر و بهتر انجام بده و در ذهنش هم الگوهایی برای انجام این وظایف داره. از طرفی برنامه هم طبق قوانین و اصول خودش دستورات رو می‌گیره تا وظایف خواسته شده رو به انجام برسونه. هر چقدر ما بتونیم تعابیر برنامه (Program Model) رو به تعابیر کاربر (User Model) نزدیکتر کنیم٬ رابط کاربر مناسبتری برای برنامه ایجاد کردیم.
برای این منظور کافیه که اصول ساده زیر رو در زمان طراحی رابط کاربر در نظر بگیریم:
سادگی
خیلی از کاربران از کار با کامپیوتر وحشت دارند. حتی بسیاری از کاربرانی که با کامپیوتر آشنایی کافی دارند٬ هنوز این وحشت رو هنگام کار با یک نرم افزار جدید تو خودشون احساس می‌کنند. هر چقدر رابط کاربر برنامه پیچیده‌تر باشه٬ این وحشت بیشتره. علاوه بر این وقتی کاربری قصد استفاده از یک برنامه رو داره٬ هدفش اینه که کارش رو سریعتر راه بندازه نه اینکه مجبور بشه کلی چیزهای جدید یاد بگیره یا اینکه بره یک دوره آموزشی ببینه تا بتونه از برنامه استفاده کنه.
- اقلام و عملکردهای اضافی رو حذف کنید.
هر چی اقلام روی صفحه بیشتر باشه یا منوها تو در تو و بزرگتر باشند٬ عملکرد برنامه پیچیده‌تر به نظر میاد. - تعداد انتخابها (Options) رو کاهش بدید.
هر گزینه‌ای رو که در برابر کاربر قرار می‌دید بابتش کاربر باید فکر کنه و راجبش تصمیم بگیره. این وظیفه طراح رابط کاربره که بهترین تصمیم رو بجای کاربر بگیره. - اقلام مرتبط به هم رو دسته بندی کنید.
با دسته بندی کردن اطلاعات کاربر راحتتر می‌تونه رابطه بین اقلام رو بفهمه. جدا از اینکه با دریافت مفهوم یک قلم٬ درک مفاهیم اقلام مرتبط به اون راحتتره. همچنین سعی کنید تا اونجا که امکان داره هر زمان فقط گوشه‌ای از این اقلام رو به کاربر نشون بدید. برای این منظور استفاده از Page Control یا Tab Control بهترین انتخاب شماست. - جملات را ساده و کوتاه انتخاب کنید.
می‌دونیم که اکثریت کاربران دفترچه راهنما یا راهنمای آنلاین برنامه رو نمی‌خونند. البته بیشتر ما هم به همین دلیل این دو قلم رو از برنامه‌هامون حذف می‌کنیم. جالبه بدونید که اکثر کاربران حتی پنجره‌های پیام (Message Box) برنامه رو هم نمی‌خونند. پس سعی نکنید که پیامهای زیادی به کاربر نشون بدید و اگر واقعا لازمه که کاربر چیزی رو بدونه حتی‌الامکان جمله رو کوتاه کنید. هر چی جمله کوتاه‌تر باشه شانس اینکه کاربر بخوندش بیشتره. به همی دلیل حتی کلماتی مانند "لطفا" و "خواهشمند است" رو از پیامهاتون بردارید.
تشابه سازی
برای کاربر راحتترین چیز اینه که بدون فکر کردن و از روی عادت کاری رو که می‌خواد انجام بده. برای این منظور باید رابط کاربر رو جوری طراحی کرد که کاربر با استفاده از اون چیزهایی که تو دنیای واقعی ملکه ذهنش شده راه خودش رو به سادگی تو برنامه پیدا کنه.
- به دستورات تصویری مناسب نسبت بدید که گویای عملکرد دستور باشه.
یک تصویر گویای هزار حرفه ولی بخاطر داشته باشید که نبود یک تصویر بهتر از بودن یک تصویر نامناسبه. قراره این تصویر راهنمای کاربر باشه نه باعث گمراهی اون. - • از اقلامی استفاده کنید که خودشون انجام کاری رو از کاربر طلب می‌کنند.
به عنوان مثال یک دکمه فشاری (Puch Button) با اون ظاهر برجسته‌ای که داره٬ داد می‌زنه که باید روی من فشار بدید.
سازگاری
هیچوقت فکر نکنید که برنامه شما اولین برنامه‌ای هست که کاربر قراره تو زندگیش اجرا کنه. بطور حتم کاربر با برنامه‌های دیگه‌ای هم آشنایی داره و انتظار داره اون چیزهایی رو که قبلا دیده و یاد گرفته تو این برنامه جدید هم قابل استفاده باشند. نوآوری چیز خوبیه ولی اولین هدف در طراحی یک رابط کاربر٬ آسودگی کاربره نه هنر و خلاقیتی که در پشت رابط کاربر نهفته شده.
- رابط کاربر رو طبق استانداردهای موجود در سیستم عامل پیاده کنید.
کاربر انتظار داره همونجور که بقیه برنامه‌ها رو کنترل میکنه٬ برنامه شما رو هم کنترل کنه. به عنوان نمونه در برنامه‌های ویندوز دکمه تایید همیشه پیش از دکمه انصراف قرار داره٬ پس برنامه ویندوز شما هم باید این اصل رو رعایت کنه. - با توجه به نوع برنامه٬ از برنامه‌های معروف و پرطرفدار دیگه الگوبرداری کنید.
به عنوان نمونه اگر قصد دارید یک ویرایشگر متن بنویسید٬ ببینید کلیدهای میانبر (Shurtcuts) روی مایکروسافت ورد چی تعریف شده و همونها رو استفاده کنید. درسته که ممکنه اشتباهاتی در رابط کاربر این برنامه‌ها وجود داشته باشه٬ ولی در نظر بگیرید که میلیونها نفر دارند از این برنامه‌ها استفاده می‌کنند و به رابط کاربر آنها عادت کردند. جدا از اینکه این شرکتها کلی پول و وقت بابت طراحی رابط کاربر برنامه‌هاشون می‌گذارند و من و شما توان انجام اون رو نداریم.
دستیابی پذیری
همه کاربران نمی‌تونند از موش (Mouse) استفاده کنند. حالا می‌تونه دلیلش این باشه که کاربر کامپیوتر کیفی داره و به جای موش از Trackball یا Trackpad یا اون چیز کوچیکی که نمی‌دونم اسمش چیه و وسط صفحه کلید قرار داره استفاده میکنه٬ یا اینکه از آرتروز مچ رنج می‌بره یا اینکه دستش لرزش داره یا خلاصه هر ناتوانی دیگه. در هر صورت کاربر یا اصلا نمی‌تونه از موش استفاده کنه یا اینکه دقت لازم برای کنترل اون رو نداره.
- محدوده‌ای رو که کاربر روی اون می‌تونه با موش عمل کنه کوچیک انتخاب نکنید.
اینجوری حتی کسانی که یک موش خراب و بدون دقت دارند یا از ابزارهای کم دقت دیگه به جای موش استفاده می‌کنند٬ میتونند از قابلیت برنامه شما بهره ببرند. - برای هر عملی که با موش قابل اجرا هست٬ معادل صفحه کلید هم در نظر بگیرید.
بارها شده موشم خراب شده و برنامه‌ای هم که باهاش کار داشتم به هیچ طریق با صفحه کلید راه نمی‌اومده. نتیجه اینکه برنامه نویس یا بهتره بگم طراح رابط کاربر برنامه رو مورد لعن و نفرین قرار دادم. البته اخیرا زرنگ شدم و یک موش یدکی هم دارم.
زیبایی٬ یکپارچگی و خوانایی
برخی از کاربران بینایی ضعیفی دارند که باید در زمان طراحی رابط کاربر مشکلات آنان را در نظر داشته باشید. همچنبن بطور متوسط نیمی از کاربران به زیبایی برنامه بیش از کارآیی برنامه اهمیت می‌دهند و نکته جالب اینکه عده معدودی از کاربران با دیدن برنامه شما سعی می‌کنند تا شخصیتی از شما در ذهن خود مجسم کنند. پس زیبایی را هم نباید فراموش کرد.
- اقلامی که در عملکرد مشابه هستند باید یکسان دیده شوند.
مفاهیم مشابه با ظاهری متفاوت حاصلی جز گیج کردن کاربر ندارد. به عنوان نمونه اگر در تمام پنجره‌ها کلیدهای تایید و انصراف وجود داره٬ اندازه و محل قرار گیری آنها بر روی هر پنجره باید مشابه پنجره دیگه باشه. علاوه بر این باید عناوین هم مشابه باشه٬ نه اینکه یکجا از عناین "قبول" و "لغو" استفاده کنیم و در جای دیگه از "تایید" و "انصراف". - فاصله بین اقلام را یکدست و مناسب انتخاب کنید.
تو در تویی اقلام باعث ناخوانایی آنها می‌شود. فراموش نکنید که بعضی از کاربران دارای مشکلات بینایی هستند و ممکن است نتوانند اقلام نزدیک به هم را از هم تفکیک کنند. همچنین اولین چیزی که در پیش چشم یک فرد حساس به ترتیب ظاهر می‌شود فاصله‌هاست٬ حتی اگر تنها یک نقطه تفاوت فاصله وجود داشته باشد. - برای اقلامی که درون یک ظرف (Container) قرار می‌گیرند٬ با دیواره‌ی ظرف حاشیه‌ای مناسب در نظر بگیرد.
این حاشیه باعث خواناتر شدن اقلام و همچنین زیباتر شدن محتوی می‌شود. - قلم نمایش را مناسب و یکسان انتخاب کنید.
مشکلات بینایی برخی کاربران ایجاب می‌کند که قلم نمایش (Font) را تا حد معقول بزرگ و خوانا انتخاب کنید. همچنین سعی کنید انتخاب خود را در همه جا یکسان نگهدارید. استفاده از قلمهای متفاوت برای یک منظور مثل این است که نامه‌ای را با ترکیبی از مداد٬ خودکار٬ خودنویس و ماژیک بنویسید.
دقیق یادم نیست از کجا گرفتم که منبع رو بگم، اگه کسی نام نویسنده رو میدونه بگه.
