6 نکته طراحی UI/UX
- دوشنبه, ۱ شهریور ۱۴۰۰، ۱۰:۲۷ ق.ظ
تحقیقات نشان داده است که کاربران هنگام بازدید از یک وب سایت در کمتر از یک ثانیه نظر خود را می دهند. 94 درصد از اولین برداشت های بازدیدکنندگان وب سایت و فروشگاه های اینترنتی مربوط به طراحی رابط کاربری است. طراحی وب سایت یا فروشگاه اینترنتی می تواند بسیار دشوار باشد ، زیرا چگونه می توانید تمام اطلاعات را بر روی صفحات خود تقسیم کنید تا منطقی باشد و همچنین خوب به نظر برسد؟
همانطور که استیو جابز یک بار گفت ، "طراحی فقط آنطور که به نظر می رسد و احساس می شود نیست. طرز کار نحوه طراحی است ". طراحی UX/UI (تجربه کاربری و رابط کاربری) شما باید به خوبی کار کند. با این وجود هنوز وب سایت هایی وجود دارند که به خوبی طراحی نشده اند و بنابراین به خوبی تبدیل نمی شوند. ما به شما نکاتی می دهیم!
تجزیه و تحلیل
این بسیار واضح به نظر می رسد ، اما تنها در صورتی می توانید یک طرح خوب ایجاد کنید که مشتری خود را به خوبی بشناسید. شروع به تحلیل مشتری خود کنید. بدانید که به چه دلیلی به وب سایت شما می آیند و مطابق آن عمل می کنند. به وب سایت های رقابتی نگاه کنید تا ببینید چگونه با رفتار کاربران برخورد می کنند ، اما به وب سایت های شرکت های دیگر صنایع نیز نگاه کنید. در Klik & Steen ما از روش MBTI (ساده شده) برای تجزیه و تحلیل مشتریان استفاده می کنیم.
این روش 4 ترجیح تصمیم افراد را توصیف می کند: بازدید کننده رقابتی ، بازدید کننده خودجوش ، بازدیدکننده روشمند و بازدید کننده انسان دوست. عناصر همه این 4 ترجیح تصمیم باید در وب سایت یا فروشگاه اینترنتی شما (در واقع در همه صفحات شما) ظاهر شود. البته ممکن است بر اولویت تصمیم گیری در وب سایت یا صفحات خاصی از وب سایت خود تأکید کنید.
چند نکته دیگر که می خواهیم با شما به اشتراک بگذاریم تا بتوانید طراحی UX/UI خود را بهبود بخشید:
طراحی رابط کاربری موبایل
البته طراحی برای موبایل داستانی متفاوت از طراحی برای دسکتاپ دارد. در جایی که با ماوس روی دسکتاپ حرکت می کنید ، این کار را روی موبایل با انگشتان خود انجام دهید. این کار فشار دکمه ها را دشوارتر می کند. به هر حال اندازه دکمه های خود را 7 تا 10 میلی متر تنظیم کنید تا کاربر فضای کافی برای "کلیک" داشته باشد. همچنین مطمئن شوید که فیلدهای ورودی شما بزرگتر از دسکتاپ هستند. مجبور به بزرگنمایی قبل از خواندن آنچه در یک زمینه است می توانید دلیلی برای ترک بازدیدکنندگان باشید.
هنگامی که یک دکمه یک فراخوان اصلی (CTA) است ، آن را بزرگتر و قابل مشاهده تر از بقیه دکمه ها کنید. همچنین وقتی کاربران روی دکمه ای "کلیک" می کنند ، نظرات آنها را در مورد تلفن همراه اعلام کنید. می توانید به بازدیدکنندگان خود نشان دهید که روی این مورد کلیک کرده اند ، به عنوان مثال ، پس از "کلیک" ، دکمه را تیره کنید. این باعث می شود دکمه بیشتر شبیه یک شی سه بعدی باشد. یک وب سایت دیگر نمی تواند پاسخگو نباشد! این برای هر وب سایت یا فروشگاه اینترنتی ضروری است!
رنگها
با استفاده از رنگ می توانید بازدیدکنندگان را به وب سایت یا فروشگاه اینترنتی خود ارسال کنید. به عنوان مثال ، رنگ های گرم ، مانند قرمز و نارنجی ، توجه بیشتری را نسبت به رنگ های سردتر ، مانند آبی و سبز ، به خود جلب می کنند. این امر به ویژه برای اطلاع از زمانی که می خواهید CTA خود را با رنگ ها آزمایش کنید مفید است.
همچنین به شما امکان می دهد اقدامات اولیه را از اقدامات ثانویه تشخیص دهید. دکمه های اصلی از رنگ "حال" بیشتری نسبت به عملکردهای ثانویه ساخته شده اند. دستورالعمل های خاصی توسط W3C (کنسرسیوم شبکه جهانی وب) در مورد تضاد رنگ برای وب سایت ها وجود دارد. نسبت کنتراست برای نمایش بصری متن در وب سایت 4.5: 1 است. این بدان معناست که بین روشن ترین و تیره ترین رنگ باید 4.5 سایه وجود داشته باشد.
برای متنی بزرگتر از 18 نقطه یا 14 نقطه پررنگ ، این نسبت کنتراست 3: 1 است. برای انتقال اطلاعات می توانید از رنگ ها استفاده کنید. یک دکمه سبز با کلمه "توقف" منطقی نیست و به احتمال زیاد فقط باعث سردرگمی بازدیدکنندگان می شود. یک دکمه قرمز با کلمه "توقف" ، از سوی دیگر ، یک انتخاب منطقی است و باعث می شود پیام شما به وضوح ظاهر شود.
نوع قلم
از فونت "استاندارد" استفاده کنید که خواندن آن آسان است. تا جایی که امکان دارد از متن "واقعی" استفاده کنید. متن موجود در تصاویر توسط ربات ها (که برای سئوی شما بسیار مهم است!) خوانده نمی شود و همچنین آنها از طریق سینتی سایزرهای صوتی به صدا تبدیل نمی شوند. مورد دوم اغلب توسط افرادی که نابینا یا کم بینا هستند استفاده می شود. تصاویر برای آنها خوانده می شود.
مهم است که متن شما به اندازه کافی بزرگ باشد تا افراد مجبور نباشند برای خواندن متن شما بزرگنمایی کنند. برای تلفن همراه توصیه می شود که بیش از 30 تا 40 نویسه در هر خط نداشته باشد. برای دسکتاپ ، این 60 تا 75 نویسه است. وقتی به این موضوع پایبند هستید ، وب سایت یا فروشگاه اینترنتی خود را واضح و خوانا نگه می دارید.
رابط
افراد فقط می توانند 5 تا 9 چیز را در حافظه کوتاه مدت خود به خاطر بسپارند. بنابراین ، رابط کاربری خود را تا حد ممکن ساده نگه دارید. در اصل ، بازدیدکنندگان باید از طریق وب سایت یا فروشگاه اینترنتی شما بدون تلاش زیاد در آن راهنمایی شوند.
انتخاب های زیاد انتخاب بازدیدکنندگان را در انتخاب محل کلیک دشوارتر می کند. افزودن ابزارهای جدید به وب سایت یا فروشگاه اینترنتی شما سرگرم کننده است ، اما همچنین می تواند بیش از حد از هدف منحرف شده یا برای بازدیدکنندگان قابل درک نباشد. بنابراین فقط در صورت مناسب بودن این ابزارها را اضافه کنید.
برای آزمایش
همانطور که در وبلاگ های قبلی ذکر شد: وب سایت یا فروشگاه اینترنتی خود را آزمایش کنید! نکات ارائه شده در این وبلاگ به وب سایت یا فروشگاه اینترنتی شما در جهت درست کمک می کند ، اما به ویژه آزمایش کنید که آیا این تغییرات برای وب سایت یا فروشگاه اینترنتی شما نیز کار می کند یا خیر. خودتان این کار را نکنید ، اما به کاربران واقعی اجازه دهید وب سایت شما را آزمایش کنند تا شما نیز نتایج واقعی داشته باشید.
از ابزارهای مختلف برای آزمایش استفاده کنید ، مانند آزمایش A/B Google ، اما ابزاری مانند Hotjar نیز برای مشاهده نحوه استفاده بازدید کنندگان از وب سایت یا فروشگاه اینترنتی شما بسیار مفید است. بنابراین مطمئن شوید که وب سایت یا فروشگاه اینترنتی شما واکنش گرا است ، از رنگ های شما به خوبی استفاده شده و متن های خود را به اندازه کافی بزرگ کرده اید. ارائه "آسان"وب سایت یا فروشگاه اینترنتی ke 'و به تجزیه و تحلیل ادامه دهید!
- ۰۰/۰۶/۰۱