با افزایش تولید و سریع‌تر شدن فرایند آن با وارد شدن تکنولوژی‌های جدید و دیجیتال به کسب و کارها، رقابت شدیدی بین آن‌ها ایجاد شد. به همین دلیل در طراحی محصول، پیدا کردن نقاط تمایز مخصوص و رقابتی سخت شد و محصولات، تنها می‌توانستند کمی از هم بهتر باشند تا به فروش بیشتری برسند. در این حالت توجه به جزئیات مخصوصاً در طراحی اهمیت زیادی پیدا کرد و توجه به مصرف‌کننده محصول و راضی کردن آن به هدف اصلی هر کسب و کار تبدیل شد. در این حالت، طراحی محصول از حالت کلی خود درآمده و به عناوین شغلی جزئی‌تری تقسیم شد و همزمان، برای طراحی محصولات دیجیتال مانند سایت‌ها و اپلیکیشن‌ها به این عنوان‌های شغلی احتیاج بیشتری پیدا کردند. در این مقاله از آکادمی کاپریلا با دو عنوان مهم طراحی تجربه کاربری UX و طراحی رابط کاربری UI با بیانی ساده آشنا خواهید شد و تفاوت UI و UX را یاد خواهید گرفت.
طراحی تجربه کاربری UX چیست؟
هر کاربر و مصرف‌کننده یک محصول، در زمان برخورد با کسب و کار تولیدکننده آن، تجربه‌ای را می‌گذراند. یک مغازه ساده در بازار را تصور کنید، از وقتی که مشتری وارد مغازه می‌شود و محصولات رو نگاه می‌کند، با فروشنده صحبت می‌کند، خرید می‌کند و از مغازه بیرون می‌رود، همه جزئی از تجربه او نسبت به آن مغازه به حساب می‌آید.
همین اتفاق در فضای دیجیتال هم می‌افتد. زمانی که کاربر به یک سایت سر می‌زند و از محتوای آن استفاده می‌کند و یا خریدی از آن سایت انجام می‌دهد، در حال گذراندن یک تجربه با آن کسب و کار است. طراحان به این نتیجه رسیدند که مهم‌ترین چیزی که در خرید یک محصول و رضایت از آن تأثیر دارد، همین تجربه کاربری و داشتن حس خوب در هنگام تجربه کردن است. به همین دلیل عنوان تخصصی طراحی تجربه کاربری UX یا همان User Experience Design به وجود آمد تا به طراحی تمام مسیر تعاملی که یک کاربر می‌تواند با یک کسب و کار داشته باشد، بپردازد. هدف اصلی UX، پیدا کردن مشکلات و نقاط درد کاربر در مسیر تجربه خود و ارائه بهترین راه‌حل‌ها برای حل این مشکلات است.
به عنوان مثال ممکن است یک نفر برای خرید اینترنتی کفش به یک سایت مراجعه کند و به دسته‌بندی کفش‌ها برود. در صفحه دسته‌بندی، تعداد زیادی کفش می‌بیند اما آن سایت، راهی برای دسته‌بندی جزئی‌تر این کفش‌ها مثل جنسیت یا مدل کفش ارائه نکرده است. این شخص باید مدت‌ها ده‌ها و صدها محصول را نگاه کند تا کفش مورد نظرش را پیدا کرده و به سبد خرید اضافه کند. سپس برای نهایی کردن خرید خود و پرداخت هزینه مسیر سختی را داشته باشد، مثلاً عضویت در حساب کاربری پیش از خرید، پر کردن فرم‌های طولانی و وقت‌گیر، طولانی بودن مراحل پرداخت آنلاین و …. این شخص بعد از دیدن این مسیر عذاب‌آور، از خرید خود منصرف شده و از سایت خارج می‌شود.
این یک مسیر با طراحی UX بد است و وظیفه طراح آن این است که مشکلات گفته شده در مسیر تجربه کاربری را پیدا کند و با ساده کردن آن و گذاشتن فیلترهای خرید و برداشتن فرم‌های اضافه، این مشکلات را حل کند و در نتیجه سایت UX بهتری داشته و فروش بهتری هم پیدا کند. به عبارت دیگر، وظیفه یک طراح UX، بهبود تجربه کاربری در سایت یا اپلیکیشن با ساده کردن استفاده از سایت، کم کردن فرآیندها، دسترسی بهتر به بخش‌های سایت و … می‌باشد.
طراحی رابط کاربری UI چیست؟
هر محصول دیجیتال (سایت یا اپلیکیشن) دارای یک قسمت ارتباطی بین مصرف‌کننده و آن محصول است. یعنی کاربر از طریق آن قسمت دیداری، با آن محصول تعامل می‌کند و به خواسته‌اش می‌رسد. به این واسط بین کاربر و محصول، رابط کاربری یا User Interface می‌گویند. وقتی یک اپلیکیشن موبایل یا یک صفحه سایت را باز می‌کنید، پس‌زمینه، منوها، دکمه‌ها، رنگ‌بندی‌ها، چینش صفحه و ستون‌هایی مشاهده می‌کنید که قسمت‌های گرافیکی سایت را شامل می‌شوند. طراحی این المان‌ها توسط طراح رابط کاربری UI انجام شده است.
البته باید در نظر داشت که محصولات دیجیتال تنها شامل سایت و اپلیکیشن نمی‌شود و محصولاتی مانند نرم‌افزارها، بازی‌های کنسول، دستگاه‌های دیجیتال مثل عابر بانک‌ها و دوربین‌های عکس‌برداری و فیلم‌برداری همه جزئی از این محصولات هستند.
هدف اصلی یک طراح رابط کاربری، ارتباط گرفتن ساده و سریع کاربر با محصول دیجیتال است. او تلاش می‌کند وقتی کاربر در حال استفاده از محصول است، هیچ سؤالی برایش پیش نیاید و بتواند بدون پیچیدگی، تمام کارهای مورد نظر خود را با محصول انجام بدهد.
مثلاً ممکن است شما وارد یک سایتی شوید و به دلیل رنگ بد پس‌زمینه یا فونت‌های کوچک، نتوانید مطالب آن را بخوانید. یا آنکه وارد سایتی شوید که چینش داخل صفحات آن نامرتب و شلوغ است و علاوه بر حس بد، شما را سردرگم می‌کند. حل کردن این مشکلات از وظایف طراح UI است.
تفاوت طراحی UX و UI چیست؟
با تعریف این دو اصطلاح، شاید تا حدودی تفاوت آن‌ها مشخص شده باشد اما در این قسمت به صورت کامل به این مورد پرداخته می‌شود.
طراحی تجربه کاربری برای همه مدل محصول اعم از فیزیکی یا دیجیتال کاربرد دارد. این عنوان، گسترده‌تر هم بوده و به طراحی تمام ارتباطات بین یک کسب و کار و کاربر می‌پردازد. به عنوان مثال، همان فروشگاهی که کفش می‌فروشد، UX را می‌تواند هم در طراحی خود کفش‌ها وارد کند و هم در قسمت‌هایی مانند طراحی سایت، ارسال محصولات و خدمات پس از فروش از طراح UX استفاده کند. به صورت کلی، UX یک تصویر جامع است و در قسمت‌های زیادی می‌تواند مطرح شود.
در مقابل، طراحی رابط کاربری UI تنها در مورد محصولات دیجیتال و قسمت واسطه مجازی آن‌ها وارد می‌شود. اما به این معنی نیست که UI بخشی از UX بوده و یا وظایف کمتری دارد. در محصولات دیجیتال، این دو عنوان مانند برادر باید در کنار هم کار کنند تا به موفقیت برسند. با گسترش این نوع محصولات و همچنین بیشتر شدن آن‌ها در آینده، طراحی دقیق و درست هر قسمت اهمیت پیدا کرده است؛ به همین خاطر شغل طراحی UI ایجاد شده تا در کنار UX به صورت اختصاصی به این قسمت مهم بپردازد.
پس به صورت کلی، UX به تجربه و حسی که کاربر در هنگام استفاده از محصول داشته و UI به چیزی که کاربر می‌بیند و با آن تعامل می‌کند، می‌پردازد. برای درک بهتر به چند مثال زیر توجه کنید.
- در مسیر یک سفر جاده‌ای، UX به خراب نشدن ماشین، سرعت مناسب و ایستادن در ایستگاه‌های بین راهی توجه می‌کند و UI، به رنگ و شیک بودن و تمیز بودن ماشین و صندلی‌های درون آن می‌پردازد.
- در بدن انسان، UX اندام‌های داخلی بدن و کار کردن درست آن‌ها با هم و UI ظاهر بدن است.
- در یک غذا، UX مزه آن و UI تزیین و ظاهرش است.
در طراحی یک محصول دیجیتال، ابتدا UX کار خودش را شروع می‌کند و اسکلت اصلی آن را می‌سازد. مسیر قدم به قدم کاربر را مشخص می‌کند و در هر قدم، راه‌حل مشکل کاربر را ارائه می‌کند. سپس UI وارد شده و این چارچوب را زنده می‌کند. مراحل و راه‌حل‌ها را به المان‌های دیداری تبدیل کرده و رابط کاربری محصول را می‌سازد.
در طراحی محصول، کار UX و UI یک طرفه نبوده و با یک بار انجام دادن تمام نمی‌شود. این طراحی باید به صورت مداوم مورد آزمایش قرار بگیرد و نحوه ارتباط کاربر با آن بهینه شود. همیشه می‌توان با تحقیق و آزمایش، یک محصول بهتر را در اختیار کاربران قرار داد.
تفاوت طراحی UI و UX با طراحی محصول چیست؟
یک عنوان که در سال‌های اخیر اهمیت زیادی پیدا کرده، طراح محصول یا Product Designer است. با توجه به تعریف‌هایی که در بالا بیان شد، شاید تفاوتی بین آن‌ها و طراحی محصول پیدا نکنید. بسیاری از افرادی که تخصص طراحی محصول دارند، در UI و UX نیز ممکن است کار کنند. اما در دیدگاه کلی یک تفاوت اساسی بین UI/UX و طراحی محصول وجود دارد.
تمرکز اصلی طراح تجربه و رابط کاربری، همان‌طور که از اسمشان مشخص بوده، بر روی کاربر است و این بر خلاف طراح محصول است که بر روی محصول متمرکز می‌شود و بر اساس محدودیت‌های کسب و کار، طراحی را انجام می‌دهد. به عنوان مثال، طراح UX برای راحتی بیشتر کاربر ممکن است چندین ویژگی مختلف را وارد محصول کند اما طراح محصول به دلیل کمبود هزینه یا منابع انسانی در قسمت برنامه‌نویسی، تنها مهم‌ترین ویژگی را به محصول اضافه کند و بقیه موارد را به زمان‌های آینده موکول کند.
وظایف طراح UX و UI چیست؟
اکنون که با تفاوت‌های این دو عنوان آشنا شدید، در قسمت آخر مقاله به وظایف کلی طراحان تجربه کاربری و رابط کاربری پرداخته می‌شود. در کسب و کارهای کوچک به دلیل کوچک بودن محصول و کمبود بودجه، امکان دارد از یک طراح برای هر دو عنوان استفاده شود اما در همین حالت نیز باید وظایف از هم جدا باشد تا در صورت وجود مشکل در یک محصول، بتوان قسمت مشکل‌دار را پیدا و سپس بهینه کرد.
وظایف طراح تجربه کاربری UX چیست؟
- انجام تحقیقات کاربر شامل مصاحبه و نظرسنجی با آن‌ها
- ساخت پرسونای کاربر بر اساس تحقیقات
- ساخت مسیر کاربر در پیدا کردن آسان راه حل ارائه شده توسط کسب و کار و استفاده از آن
- ساخت نمونه و پروتوتایپ محصول بر اساس مسیر
- آزمایش کردن نمونه‌ها توسط کاربران واقعی و بهینه‌سازی آن
- ارتباط مناسب با دیگر بخش‌های محصول مانند برنامه‌نویس‌ها، طراح محصول و UI
وظایف طراح رابط کاربری UI چیست؟
- گرفتن اطلاعات مورد نیاز و نمونه‌های ساخته شده در بخش UX
- ساخت نمونه‌های اولیه گرافیکی از محصول دیجیتال
- طراحی المان‌های تصویری شامل رنگ‌ها، دکمه‌ها و منوها
- طراحی تعاملی مانند انیمیشن‌ها و حرکت‌ها
- طراحی ریسپانسیو و واکنش گرا مناسب همه دستگاه‌های مورد استفاده کاربر
.
مهارت‌هایی که طراح UX باید داشته باشد شامل تکنیک‌های تحقیق، ساخت نمونه، معماری اطلاعات و انجام تست کاربردپذیری می‌شود و از مهارت‌های طراح UI نیز می‌توان به برندینگ، تایپوگرافی، روانشناسی رنگ، طراحی واکنش‌گرا و خلاقانه اشاره کرد.
اگر این مطلب برای شما مفید بوده است، آموزش‌ها و مطالب زیر نیز به شما پیشنهاد می‌شوند:
- آموزش طراحی رابط کاربری اپلیکیشن دیجی کالا با فتوشاپ
- آموزش آشنایی با واکنش گرایی (Responsive) و فریمورک بوت استرپBootstrap) ) (رایگان)
- آموزش طراحی رابط کاربری وبسایت با فریمورک jQuery UI
- مجموعه آموزش طراحی سایت
- آموزش طراحی وب با HTML – مقدماتی
- آموزش طراحی وب با CSS3) CSS) – تکمیلی
- آموزش پروژه محور HTML و CSS
- مجموعه آموزش دیجیتال مارکتینگ (Digital Marketing)
