وب روز

واژه‌هاي UI و UX جزوي از ادبيات طراحي سايت هستند كه البته گاهي اوقات اشتباها به جاي هم به كار مي‌روند. UX يا تجربه كاربري مفهومي بسيار گسترده است و بحثي مجزا مي‌طلبد. اما رابط كاربري يا UI چيست ؟ در اين مقاله مي‌خواهيم مفهوم رابط كاربري و اصول و عناصر آن را به شما معرفي كنيم.

واژه‌هاي UI و UX جزوي از ادبيات طراحي سايت هستند كه البته گاهي اوقات اشتباها به جاي هم به كار مي‌روند. UX يا تجربه كاربري مفهومي بسيار گسترده است و بحثي مجزا مي‌طلبد. اما رابط كاربري يا UI چيست ؟ در اين مقاله مي‌خواهيم مفهوم رابط كاربري و اصول و عناصر آن را به شما معرفي كنيم.

رابط كاربري يا UI چيست ؟

مهمترين ويژگي هر محصول، قابل استفاده بودن آن است. مثلا وقتي مي‌خواهيد يك در را باز كنيد از دستگيره استفاده مي‌كنيد. بدون دستگيره در باز و بسته نمي‌شود و به همين دليل قابليت استفاده ندارد.

وقتي مي‌خواهيد از يك چاقو استفاده كنيد، دسته آن را مي‌گيريد. بدون دسته، مجبور بوديد تيغه چاقو را با دست بگيريد كه هم خطرناك است و هم استفاده از آن راحت نيست.

در حقيقت هر چيزي كه باعث شود بتوانيم از يك محصول استفاده كنيم، رابط كاربري نام دارد.

با اين توضيحات، رابط كاربري در طول تاريخ سابقه دارد. هر محصولي كه بشر توليد مي‌كند، قاعدتا بايد قابل استفاده باشد و رابط كاربري داشته باشد.

چنان كه گفتيم رابط كاربري از قديم وجود داشت اما اصطلاح UI يا User Interface Design به معناي امروزي در عصر كامپيوتر به وجود آمد. امروزه UI را فضايي مي‌دانند كه تعامل ميان انسان و ماشين در آن رخ مي‌دهد. با رواج استفاده از كامپيوتر و ديگر ابزارهاي ديجيتال، دانش طراحي UI نيز شكل گرفت. دانشي كه هدفش ارائه محصولاتي با قابليت استفاده آسان به كاربران است.

طراح UI به اين فكر مي‌كند كه هر المان بايد كجاي صفحه قرار بگيرد؟ فرم‌ها چگونه باشند؟ دكمه ارسال فرم كجا باشد؟ خطاها چطور به كاربر نشان داده شوند؟ گزينه‌هاي اصلي را كجا قرار بدهيم كه به راحتي ديده شوند؟ و … . كاربران از پر كردن فرم متنفرند! يك دليل اين مسئله، نوع طراحي فرم‌ها است. فيلدهاي متعدد، نزديكي بيش از حد آن‌ها به هم و دريافت اطلاعات بي‌ربط از كاربر، باعث مي‌شود او فرم را نيمه‌كاره رها كند.

روي مسئله قابليت استفاده تاكيد مي‌كنم تا طراحي UI را با طراحي گرافيك اشتباه نگيريد.

تفاوت طراحي گرافيك و طراحي رابط كاربري چيست ؟

به دليل وجود كلمه طراح يا طراحي، گاهي اوقات رابط كاربري زيرمجموعه هنر و ديزاين قرار مي‌گيرد. بزرگترين دانشگاه‌هاي جهان، مثلا ام آي تي، طراحي رابط كاربري را در شاخه علوم كامپيوتر ارائه مي‌كنند.

حال بايد ببينيم تفاوت طراحي گرافيك يا طراحي بصري Visual Design با طراحي UI چيست و چرا نمي‌توان آن را زيرشاخه هنر طراحي دانست؟

كسي كه رابط كاربري طراحي مي‌كند، بايد با اصول گرافيك آشنايي داشته باشد. با اين حال، هدف اصلي‌اش طراحي يك نرم‌افزار يا يك و سايت زيبا نيست. بلكه مي‌خواهد محصولي طراحي كند كه كاربران بتوانند به آساني از آن استفاده كنند و به هدف خود برسند.

در حقيقت طراح UI از اصول گرافيك و زيبايي‌شناسي در راستاي ايجاد كاربري آسان استفاده مي‌كند. مثلا براي اين كه يك گزينه به راحتي در معرض ديد كاربران قرار بگيرد، از يك رنگ خاص در طراحي آن استفاده مي‌كند.

براي روشن‌تر شدن موضوع، سايت‌هايي را به ياد بياوريد كه ظاهر خوب و كاربري بد دارند. مثلا سايت‌هايي با رنگ‌بندي زيبا كه طراحي منوي آن‌ها پيچيده است. براي پيدا كردن يك مورد خاص كاربران را مجبور به زدن چندين كليك مي‌كنند يا باعث سردرگمي آن‌ها مي‌شوند.

طراحي گرافيك خوب يعني سايت يا نرم‌افزار بايد زيبا باشد، طراحي UI خوب يعني كار با نرم‌افزار بايد ساده باشد.

اصول طراحي كاربري يا UI چيست ؟

قبل از اين كه به مراحل طراحي UI بپردازيم، بايد ببينيم اصول اوليه UI چيست . اصولي كه يك طراح حرفه‌اي هنگام اجراي پروژه آن‌ها را در ذهن دارد و رعايت مي‌كند.

پنج اصل اساسي طراحي رابط كاربري يا UI از اين قرارند:

رعايت ساختار

منظور از رعايت ساختار اين است كه رابط كاربري بايد هدف، معنا و سمت و سو داشته باشد. نظم و ساختاري روشن و مشخص، كه كاربران بتوانند آن را درك كنند و تشخيص بدهند. نبايد چيزهاي بي‌ربط را در كنار هم قرار بدهيد. دسته‌بندي مشخص داشته باشيد. در يك نگاه به محصول، كاربر بايد بتواند بخش‌هاي مختلف را تشخيص بدهد. بايد بداند براي رفع هر يك از نيازهاي خود به كدام بخش مراجعه كند.

رعايت سادگي

تكنولوژي‌ها روز به روز پيچيده‌تر مي‌شوند و در همين زمان، رقابت بر سر سادگي است! از گوشي‌هاي تلفن همراه گرفته تا سايت‌هاي فروشگاهي، نمونه‌اي موفق‌تر است كه در طراحي UI آن اصل سادگي بيشتر رعايت شده باشد.

بايد محصول را به گونه‌اي طراحي كنيد كه كاربر به سادگي روش استفاده از آن را بفهمد. كارهاي پرتكرار و متداول بايد به راحتي انجام شوند. كاربر نبايد براي انجام فرايندهاي پيچيده، مسير پيچيده‌اي در پيش رو داشته باشد. به عبارت ديگر، مهم نيست تكنولوژي چقدر پيچيده است، كاربري را آسان نگه داريد.

حتما نمونه‌هاي عالي فراواني از اين مورد در ذهن داريد. نمونه‌هايي كه تكنولوژي‌هاي پيشرفته را به سادگي چند كليك در اختيارتان قرار مي‌دهند. مثلا سيستم عامل ويندوز را در نظر بگيريد كه هر نسخه از آن نسبت به نسخه قبلي رابط كاربري ساده‌تري دارد. به عبارت ديگر يوزر فرندلي‌تر است.

قابل ديد بودن

قابليت ديده شدن يا اصل پديداري يكي ديگر از اصول مهم UI است. اين كه چه اطلاعاتي را در معرض ديد كاربر قرار مي‌دهيد، اهميت بسياري دارد.

در نظر داشته باشيد كه كاربر تنها بايد چيزهايي را ببيند كه به آن‌ها نياز دارد. تمامي گزينه‌هاي مورد نياز كاربران را بايد با ساختاري صحيح در دسترس او قرار دهيد. با اطلاعات نامربوط، غير ضروري يا فرعي باعث سردرگمي كاربر نشويد و برايش مزاحمت ايجاد نكنيد.

تمامي موارد مهم و مورد نياز كاربر را در معرض ديد او قرار دهيد. كاربر نبايد مجبور شود مطالب مورد نظرش را از محصول‌تان استخراج كند!

اصل بازخورد يا اطلاع‌رساني به كاربر

هر سيستمي ممكن است تغيير كند. ممكن است خطاهايي پيش بيايد. وضعيت‌ها تغيير مي‌كنند و موارد استثنايي رخ مي‌دهد. بايد بتوانيد اين موارد را با زباني قابل فهم به كاربر منتقل كنيد. بايد به او توضيح بدهيد كه در اين موارد چه كار كند، چه اتفاقي افتاده است و قدم بعدي چيست.

اصل انعطاف‌پذيري

منظور از انعطاف‌پذيري يا تحمل UI چيست ؟ يعني UI را اولا با كمترين درصد احتمال رخ دادن خطا و اشتباه طراحي كنيد. ثانيا اگر خطايي رخ داد كاربر را منفجر نكنيد! سيستم را طوري طراحي كنيد كه تحمل بالايي نسبت به خطا و اشتباه داشته باشد. (دقت كرده‌ايد سيستم‌هايي كه گزينه Undo دارند چه آرامشي به آدم مي‌دهند!؟)

چگونه UI طراحي كنيم؟

تا اينجا با تعريف كلي و اصول اساسي طراحي UI آشنا شديم اما مراحل طراحي UI چيست ؟ به عبارت ديگر، براي طراحي كاربري مناسب چه كارهايي بايد انجام شود؟

در مرحله اول، طراح UI بايد پروژه را تمام و كمال بررسي و نيازسنجي كند. مثلا اگر قرار است رابط كاربري يك سايت را بررسي كند، بايد ببيند مخاطبان سايت چه كساني هستند. هر چه شناخت بيشتري از مخاطبان داشته باشيد، طراحي بهتري ارائه خواهيد داد. مي‌توانيد براي شناخت نوع كسب‌وكار و مخاطبان سايت‌هاي رقيب را بررسي كنيد. يا اگر سايت اكنون موجود است، از طريق ابزار گوگل آناليتيكس مخاطبان و رفتار آن‌ها آن را بشناسيد.

شناخت مخاطب يكي از اصول مهم UI است. اين شناخت همه جا به دردتان مي‌خورد. مثلا اگر قرار است رابط كاربري يك سايت سرگرمي طراحي كنيد، بايد مخاطب عام را در نظر بگيريد. زمينه كاري را نيز در نظر داشته باشيد. فرض كنيم طراحي رابط كاربري يك سايت شركتي فروش ماشين‌آلات سنگين را به عهده داريد. فكر مي‌كنيد استفاده از تم رنگ صورتي چه تاثيري داشته باشد!؟

مرحله دوم، شامل طراحي اتود اوليه و ارائه آن به مشتري مي‌شود. در اين مرحله طرحي ابتدايي از سايت تهيه مي‌كنيد. منوها مشخص مي‌شوند. محل قرار گرفتن هر يك از گزينه‌ها تعيين مي‌شود و … . اين طرح اوليه را به مشتري نشان مي‌دهيد و با همفكري او، تغييرات لازم را در نظر مي‌گيريد.

پس از اعمال تغييرات لازم، نوبت به انتخاب رنگ‌بندي و گرافيك مي‌رسد. البته بهتر است اين كار به عهده يك گرافيست باشد. ممكن است اين كار را در مرحله اوليه انجام داده باشيد. با اين حال، پيشنهاد اكثر متخصصان اين است كه در آغاز طراحي سايت خود را درگير زيبايي ظاهري نكنيد. در غير اين صورت ممكن است از اصل موضوع، يعني كاربري آسان، دور شويد.

مهارت هاي لازم براي طراحي UI

با توجه به مواردي كه گفته شد، حتما متوجه شده‌ايد كه طراح UI به مهارت‌هاي مختلفي نياز دارد. يكي از اين موارد، آشنايي با ابزارهاي طراحي گرافيك مثل فوتوشاپ و Illustrator است. البته نبايد از ابتداي پروژه به سراغ اين ابزارها برويد. شروع كار يك طراح UI با واير فريم يا ابزارهاي طراحي اوليه است. مي‌توانيد از يك كاغذ سفيد به عنوان واير فريم استفاده كنيد و طرح مورد نظرتان را روي آن پياده كنيد. ابزارها و نرم‌افزارهاي ديجيتال هم براي اين كار وجود دارند.

در بسياري موارد طراح سايت و طراح رابط كاربري يك نفر است. به هر حال طراح UI بايد با سبك‌هاي طراحي سايت آشنايي داشته باشد.

مفهوم رابط كاربري را با هم بررسي كرديم و متوجه شديم منظور از طراحي UI چيست . هدف اصلي طراحي رابط كاربري، قابليت استفاده آسان است. طراح رابط كاربري تصميم مي‌گيرد هر المان و عنصري از سايت يا نرم‌افزار چگونه باشد و كجا قرار بگيرد. او خود را به جاي كاربران مي‌گذارد. هدف‌ها و نيازهاي آن‌ها را در نظر مي‌گيرد و در نهايت محصول را به گونه‌اي طراحي مي‌كند كه اين نيازها و اهداف به ساده‌ترين شكل ممكن رفع شوند.

منبع:

Webnagroup.ir