کــــار آفرینــــ بلاگــــ

بلاگیــــ برایــــ امروزیــــ ها

10 تا از باید و نبایدهای UI و طراحی UX

10 تا از باید و نبایدهای UI و طراحی UX

 

 

10 باید و نباید UI و طراحی UX

 

این مقاله از طرف از Adobe و Creative Cloud برای شما نوشته شده و به شما کمک خواهد کرد تا برنامه های موبایلوطراحی وب سایت تان را به سرعت انجام دهید .
تجربه کاربری آنلاین تا حدودی بسیار مشابه به تجربه مشتری در هنگام خرید در فروشگاه ها می باشد . شما دوست دارید بدون اینکه زحمت زیادی را متحمل شوید , اوقات لذت بخشی را تجربه کنید. دلتان می خواهد که فروشگاه را به سرعت جستجو کرده و تمام چیزهایی را که نیاز دارید را سریع پیدا کرده , به سمت صندوق رفته و به خانه برگردید.
در این حال دوست ندارید با صندوق دارانی که وقت را تلف می کنند , محصولاتی که در جای مخصوص خود قرار ندارند و یا تمام شدند , کارمندان بد و یا پارکینگ پر روبرو شوید . شما می خواهید محصول مورد نظرتان را به سرعت پیدا کرده و سریع محل را ترک کنید.
فروشگاه ها کاملا از این نیاز شما مطلع بوده و زمان و پول قابل توجهی را صرف راحت تر کردن جستجوی شما , دسترسی محصولات و صف های دوستانه و سریع کرده اند.
مقایسه تجربه کاربر با تجربه خرید شاید تا حتی بچه گانه باشد ولی واقعیت این است که این دوتجربه کاملا مشابه هستند. مشتریان ما بازدید کنندگان وب سایت هایی هستند که ما آنها را طراحی کرده و می سازیم و از طرف دیگر خریدهای مواد غذایی محتوایی هستند که بخاطرشان کاربران به وب سایت سر می زنند.
برای افرادی مثل ما که به مغازه می روند تا خرید کنند , آگاهی از مشکلاتی که باعث ایجاد آزردگی می شوند آسان بوده وبه راحتی می توانیم پیشنهاداتی برای رفع این عیوب ارائه بدهیم . ولی , وقتی صحبت از طراحی های خودمان می شود , شاید نتوانیم قبل از کاربر اصلی متوجه ایرادهای کار بشویم.

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

 

1. باید: تجربه ای مشابه در دستگاه های مختلف


بازدیدکننده ها از دستگاه های مختلفی به وب سایت شما سر می زنند. آنها از لپ تاپ , تبلت , موبایل , موزیک پلیر , کنسول گیم و یا حتی ساعتهایشان وارد وب سایت شما می شوند . یکی از مهمترین بخش های طراحی این است که کاربر از هر دستگاهی که دوست دارد وارد وب سایت تان شده ولی تجربه ای مشابه را داشته باشد.
به این معنی که اگر بازدید کننده وب سایت را از موبایل خود تماشا می کند بتواند بدون هیچ سر در گمی هر چیزی را که دوست دارد به دست بیاورد , درست انگار که از صفحه دسکتاپ در خانه وارد وب سایت شده است. چنین کاری باعث می شود تا کاربران خود را بدون در نظر گرفتن وسیله ای مورد استفاده ,همیشه نگه دارید.

 

2. باید: ارائه ناوبری (navigation) به صورتی که سریعا قابل مشاهده بوده و کار با آن آسان باشد


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

 

3. باید: مهمترین چیز روی صفحه باید نمایش نقطه کنونی باشد


در ابتدا اکثر کاربران به جای خواندن تمام جزئیات روی صفحه به اسکن کردن آن می پردازند. بنابراین , اگر یک بازدید کننده و یا کاربر قصد پیدا کردن محتوا و یا انجام کاری را داشته باشد , به اسکن کردن خود ادامه داده تا اطلاعت مورد نظر را پیدا کند.
در اینجا شما می توانید به آنها کمک کنید و از لحاظ بصری نگاهشان را به سمت جایی که باید تماشا کنند هدایت کنید(همرانطور که در گذشته در مورد این موضع صحبت کردیم به این کار Visual Hierarchy و یا سلسله مراتب بصری می گویند) . اطلاعات مهم مانند عنواین , فرمهای ورود به سیستم , اقلام ناوبری و غیره را نقطه کانونی صفحه قرار داده تا بازدید کننده بتواند به راحتی آنها را مشاهده کند.


4. باید : تمام کلیدها و لینک ها باید به درستی کار بکنند


وقتی در فروشگاهی به دنبال چیزی بسیار ضروری برای شام شب می گردید و ناگهان متوجه می شوید که دیگر موجود نمی باشد , احساس خیلی بدی به شما دست می دهد . همین احساس زمانی به کاربر دست خواهد داد که روی لینکی که کار نمی کند کلیک کرده و یا با کلیدی مواجه شوند که قابل کلیک کردن نمی باشد.
زمانی که بازدیدکنندگان به دنبال محتوا می گردند , انتظار دارند تا هر لینکی آنها را به جایی که می خواهند ببرد و دوست ندارند با error 404 و یا وب سایت دیگری روبرو شوند. اقلام بصری که شبیه لینک و دکمه بوده و نمی شود روی آنها کلیک کرد(مانند کلماتی که زیرشان خط کشیده شده , عناصری که دکمه Call to action داشته ولی hyperlinked نیستند ) کاربر را خسته کرده و شاید باعث عصبانیت و در نهایت ترک وب سایت شوند.

 

5. باید : به کاربر اجازه بدهید که تجربه جستجو را کنترل کند

 

وب سایت هایی که با auto-play ویدیوها و یا hijacked scrolling کنترل را از دست کاربر می گیرند مورد علاقه کاربران نمی باشند . زمانی که یک وب سایت و یا واسط کاربر طراحی می کنید , باید به کنترل جستجو و همه چیز را به خود کاربر بسپارید .
باید در نظر داشته باشید که چیزهایی مثل پخش اتوماتیک ویدیوها , اجازه Scroll ندادن , موزیکی که در زمینه به صورت اتوماتیک شروع می شود , لینکهایی که در تب های دیگر باز می شوند , همه و همه ناراحتی کاربر را بر می انگیزند. از این عناصر باید به ندرت و فقط در مواقع خاصی استفاده کرد.


6. نباید : طراحی وب سایت نباید خدشه ای روی خوانایی آن ایجاد کند

 

طراحی یک وب سایت و واسط کاربر نباید تداخلی با نحوه نمایش اطلاعات در صفحه نمایش داشته باشد. این قضیه شامل پس زمینه های شلوغ و یا انتخاب رنگهای نامناسب می باشد که مانع خوانا بودن وب سایت می شوند.
پس زمینه های شلوغ باعث حواس پرتی می شوند و توجه را از محتوا می گیرند. بدترین حالت زمانی رخ می دهد که این صفحه شلوغ و گیج کننده دقیقا زیر محتوا و نوشته های وب سایت تان باشند.
به علاوه , سعی کنید از رنگهایی که باعث کاهش مقدار تضاد تایپوگرافی روی صفحه می شوند اجتناب کنید (مثلا رنگهای خاکستری روشن روی زمینه سفید) .
تمرکز بیشتری به تایپوگرافی وب سایت تان داشته باشید تا مواردی چون طول و درازای خطوط و نوع فونت خدشه ای به خوانایی وب سایت وارد نکنند.

 

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

 

همانطور که در بالا به آن اشاره شد , کاربران و بازدیدکنندگان در اکثر موارد به سرعت صفحه را اسکن می کنند تا چیزی که برای مطالعه می خواهند را پیدا کنند. این کاربران اغلب به نشانه های بصری مانند سرفصل ها , تصاویر , دکمه ها و بلوک ها نگاه می کنند تا بفهمند روی چه چیزی باید تمرکز بیشتری داشته باشند.
اگر چنین عناصری را حذف کنید , کاربر در جستجوی خود دچار مشکل می شود , و نمی توانید با اسکن وب سایت چیزی را که می خواهند پیدا کنند . استفاده از سرفصل های مناسب که به راحتی قابل مشاهده باشند , تصاویری که برای نشان دادن نقاط مختلف طراحی شدند , دکمه های ناوبری , بلوک ها محتوایی که مخصوص و یا مهم باشند به کاربر در جستجو و اسکن وب سایت کمک بسزایی می کند.


8. نباید : صفحه را با محتوای نامرتبط پر نکنید

 

به مثال فروشگاه بر می گردیم , زمانی که به دنبال آرد و شکر برای پختن کیکی هستید , دوست دارید مستقیم به سمت قفصه شیرینی پزی رفته و چیزهایی را که می خواهید بردارید . مطمئنا در چنین شرایطی دوست ندارید با لوازم کباب پزی و یا شوینده ها مواجه شوید .
کاربران وب سایت و واسط شما نیز احساسی مشابه خواهند داشت. آنها دوست دارند بدون هیچ دخالت و حواس پرتی اطلاعاتی که می خواهند را به دست بیاورند. اگر دوست دارند از وب سایت شما تی شرتی خریداری کنند , از دیدن تبلیغات خرید موبایل ناراحت خواهند شد.

 

9. نباید : کاربران نباید خیلی منتظر نمایش و بارگذاری اطلاعات شوند

 

قدرت توجه و صبر کاربران وب بسیار پایین می باشد, بنابراین زمانی که مجبور به صبر کردن برای مشاهده و بارگذاری محتوای وب سایت می شوند امکان خسته شدن و ترک کردن وب سایت خیلی زیاد است .
در زمان طراحی وب باید به خاطر داشته باشید که نحوه طراحی تاثیر بسزایی در سرعت بارگذاری وب سایتتان دارد . عکس های بزرگ , استفاده زیاد از انیمیشن ها , منابع لود از وب سایت ها دیگر جزو مواردی هستند که سرعت وب سایت را به شکل چشم گیری پایین می آورد . در کنار آن بهینه سازی و تصیمات درست طراحی در کاهش زمان بارگذاری وب سایت موثر می باشند.

زمانی که یک وب سایت و یا برنامه موبایل طراحی می کنید , در نظر داشته باشید که واسط شما تا حد امکان مثبت بوده و کاربران از استفاده از وب سایت و برنامه شما لذت فراوان ببرند. خوب تمام هدف ما همین بود. استراتژی که برای خلق UX به کار می برید "یعنی UI" به شکل بهبود یافته .

 

10. نباید : چند چیز مختلف که برای جلب توجه با هم رقابت می کنند

 

درست مثل استفاده از محتوای نا مرتبط , استفاده از عناصری که برای جلب توجه کاربر رقابت می کنند نیز باعث ایجاد استرس و حواس پرتی کاربر می شوند. استفاده از سلسه مراتب بصری در طراحی برای کنترل جریان در صفحه به ما کمک می کند تا حس رقابت بین عناصر را کاهش بدهیم.
شما می توانید با محدود کردن تعداد Call to action روی صفحه , کاهش تعداد تبلیغات, انیمیشن های رنگارنگ و تعداد تیترها به کاربر کمک کنید. همچنین , جلوگیری از تبلیغات به صورت Pop up تمرکز را روی محتوا نگه می دارد .

نتیجه گیری
کنار ایستادن و نگاهی صادقانه به تجربه کاربری وب سایت داشتن باعث کاهش بسیاری از تجارب دلخراش و ناراحت کننده می شود. با به کارگیری این باید و نبایدها , شما می توانید به بازدید کنندگانتان کمک کرده و تجربه کاربری بسیار خوبی ایجاد کنید.

 

 با مقالات دیگر کارآفرین بلاگ همراه ما باشید.

 شما می توانید با استفاده از لینک های زیر این مطلب را با دوستان خود نیز به اشتراک بگذارید.