طراحی UI و UX دو مورد از رایج‌ترین اصطلاحات درهم و برهم در طراحی وب سایت و اپلیکیشن هستند که البته دلیل اشتباه گرفتن این دو اصطلاح، قابل درک است؛ چون مرز مشخصی برای جدا کردن رابط کاربری (User Interface, UI) و تجربه کاربری (User Experience, UX) وجود ندارد و هر کدامشان برای تکمیل دیگری مورد نیاز طراحان UI و UX است، زیاد پیش می‌آید که افراد این دو مفهوم را با هم اشتباه بگیرند.
تجربه و رابط کاربری معمولاً در یک عبارت واحد، یعنی طراحی UI/UX، کنار هم قرار می‌گیرند ولی باید بدانید هر کدامشان، تعریف حرفه‌ای و مفهوم عمیقی دارند؛ به شکلی که این روزها، به دو تخصص جداگانه تبدیل شدند.
در ادامه این بلاگ از وب سایت راندمانو، به قابل هضم‌ترین شکل ممکن، تجربه کاربری (UX) و رابط کاربری (UI) را تعریف می‌کنیم.
با خواندن این مقاله:
- می‌فهمید رابط کاربری (UI) چیست.
- متوجه می‌شوید تجربه کاربری (UX) چیست.
- تفاوت UI و UX را به راحتی درک می‌کنید.
- از نحوه ارتباط UI و UX درک نسبی خوبی به دست می‌آورید.
رابط کاربری (UI) چیست؟
به زبان ساده، رابط کاربری با طراحی گرافیکی یک وب سایت یا اپلیکیشن در ارتباط است. یعنی تصاویر، دکمه‌ها، رنگ‌ها، سایزها، فواصل، هماهنگی بین متن‌ها، انواع فونت و تایپوگرافی، اسلایدرها، سربرگ یا همان هدر و پاورقی یا همان فوتر، همگی به دست طراح رابط کاربری یا همان UI Designer طراحی و تعیین می‌شوند و با توجه به قوانینی که در زمینه رفتار مصرف کننده در ارتباط با گرافیک یک برنامه وجود دارد، طراح رابط کاربری این فاکتورهای مختلف را در صفحات وب سایت یا اپلیکیشن در کنار هم قرار می‌دهد.
| بیان ساده‌تر: “هر نوع عنصر بصری در وب سایت یا اپلیکیشن، توسط UI Designer طراحی می‌شود.“ |
حالا چرا بهش میگن رابط؟!
در واقع وقتی یک کاربر وارد وب سایت یا اپلیکیشن شما می‌شود، از طریق هر آن چیزی که می‌بیند با برند، محصول یا خدمات شما ارتباط برقرار می‌کند؛ پس می‌توان گفت UI، رابط بین محصول، خدمات یا برند شما با مخاطب است. UI چیزی است که از طریق آن، مخاطب با کسب و کار شما ارتباط “خودآگاه” و “ناخودآگاه” برقرار می‌کند و به همین خاطر، یکی از مهم‌ترین مفاهیمی است که باید به آن توجه کنید.
اگر بخواهیم باز هم کلام را ساده‌تر کنیم، باید بگوییم رابط کاربری بر روی تجربه بصری مشتری تمرکز دارد. بر اساس مفاهیم UI، مشخص می‌شود که مخاطب چگونه از طریق آنچه که می‌بیند و توجهش را جلب می‌کند، با برند شما ارتباط برقرار می‌کند یا از طریق تاچ پوینت‌های بصری، از نقطه‌ای به نقطه دیگر می‌رود.
برای آن که مشتری از کار با اپلیکیشن یا وب سایت شما تجربه خوبی داشته باشد، نه تنها باید بتواند به راحتی با آن کار کند، بلکه سایت یا اپ شما باید طراحی زیبا و مناسبی هم داشته باشد.
با ترکیب درست تجربه و رابط کاربری، یک اپلیکیشن یا وب سایت کاربرپسند (یوزر فرندلی) را به مخاطبین خود ارائه می‌دهید.
تجربه کاربری (UX) چیست؟
تجربه کاربری در حقیقت همان بازخورد مشتری از کار با اپلیکیشن یا وب سایت شماست. به بیانی دیگر، زمانی که مخاطب با اپلیکیشن یا وب سایت شما کار می‌کند، یک سلسله از احساسات و افکار به صورت خودآگاه یا ناخودآگاه در مورد آن دارد که از مجموعه این افکار و احساساتی که مشتری تجربه می‌کند، تجربه کاربری یا همان User Experience شکل می‌گیرد.
طراحان تجربه کاربری تلاش می‌کنند سفر مشتری (Customer Journey) را بهینه کنند. یعنی با حذف پیچیدگی‌ها، بهترین راه را برای رسیدن به هدف جلوی مخاطبین شما بگذارند تا آن‌ها در مسیر چیزی که می‌خواهند، در وب سایت یا اپ شما سردرگم نشوند.
به طور کلی، همیشه انسان دنبال بهینه سازی کارها بوده تا بتواند بدون زحمت زیاد و پیچیدگی و سردرگمی در انجام کارها، به هدف خود برسد. اصلاً به همین دلیل اختراعات مختلف شکل گرفتند. اگر انسان از ابتدا به دنبال بهینه‌تر کردن مسیرهای دست یابی به اهدافش نبود، هیچ وقت اختراعی صورت نمی‌گرفت و پیشرفتی هم حاصل نمی‌شد.
پس تجربه کاربری راحت و مناسب، یکی از اساسی‌ترین نیازهای انسان در کار با هر چیزی محسوب می‌شود.
طراحان تجربه کاربری یا همان UX Designers برای آن که بتوانند بهترین مسیر را برای کاربر طراحی کنند، باید درک عمیقی از پروداکت مارکتینگ یا بازاریابی محصول داشته باشند تا بتوانند بر اساس رفتار مصرف کننده، پرسونای مخاطب، ویژگی‌های محصول یا خدمات شما و البته پرسونا مخاطب و برند، با استفاده از المان‌هایی که UI Designer طراحی کرده است، مناسب‌ترین مسیر را برای طی کردن و رسیدن به هدف، جلوی مخاطب بگذارند.
| مهم‌ترین اصل در ساخت تجربه کاربری خوب، فراهم کردن بهینه‌ترین راه حل، بدون هرگونه پیچیدگی یا دشواری، پیش روی کاربر است. |
البته این را هم در نظر داشته باشید که تجربه کاربری در مقیاس‌های عمیق‌تر، فقط بر روی استفاده آسان از محصول تمرکز ندارد. برای مثال، برخی محصولات مانند آیفون، پلی استیشن، ویندوز مایکروسافت و گوگل درایو که همگی تجربه کاربری فوق‌العاده‌ای را ارائه می‌دهند، علاوه بر تمرکز بر استفاده آسان از محصول، بر روی جنبه‌های دیگری مثل لذت و سرگرمی یا گیمیفیکیشن (Gamification) هم مانورهای زیادی داده‌اند.
تفاوت تجربه کاربری و رابط کاربری (تفادت UI و UX)
طبیعتاً وقتی تا اینجای مقاله خوانده‌اید، خودتان به این نتیجه رسیده‌اید که تجربه کاربری (UX) و رابط کاربری (UI) با یکدیگر تفاوت دارند و لازم نیست ما یک بار دیگر آن را بگوییم.
ولی دقیقاً تفاوت این دو در کجاست؟ مرز مشخصی که تجربه و رابط کاربری را از هم جدا می‌کند، چیست؟
خب، ببینید!
گفتیم که رابط کاربری، مشخص می‌کند کاربر وقتی وارد اپلیکیشن یا وب سایت شد، با چه چیزی روبرو شود. تمام عناصر بصری توسط طراح رابط کاربری تعیین و طراحی می‌شوند.
بعد از آن که عناصر بصری توسط UI Designer طراحی و اجرا شد، UX Designer چگونگی استفاده از این عناصر توسط کاربر برای رسیدن به یک هدف خاص را تعیین می‌کند.
بگذارید یک جور دیگر برایتان توضیح دهم…
کاربری که وارد وب سایت یا اپلیکیشن شما می‌شود به دنبال چه چیزی می‌گردد؟
- محتوا
- محصول
- خدمات
یعنی کاربر برای مصرف یک یا چند مورد از موارد بالا، وارد سایت یا اپ شما می‌شود.
خب، حالا باید یک ابزار مناسب به او بدهید تا بتواند محتوا، محصول یا خدماتی که برای آن وارد سایت شده است را مصرف کند. این ابزار، همان رابط کاربری است.
خب، الان هدف کاربر و ابزار استفاده از آن هدف در دسترس است؛ چه چیزی کم داریم؟
نحوه استفاده از ابزار برای مصرف محتوا، محصول یا خدمات کم است!
پس تجربه کاربری را می‌توانید نحوه استفاده و دسترسی کاربر به هدف نهایی در نظر بگیرید.
کاربرد UI و UX هماهنگ با یکدیگر
شما نمی‌توانید محصول فوق‌العاده‌ای داشته باشید که رابط یا تجربه کاربری خوبی نداشته باشد. دنیا پر است از محصولاتی که رابط کاربری فوق‌العاده زیبا و هماهنگ با ارزش‌های بصری برند و مخاطب داشته ولی تجربه کاربری آن‌ها ضعیف است و به همین دلیل، نتوانسته‌اند محصولی موفق باشند. همین طور محصولاتی وجود دارند که تجربه کاربری نسبتاً خوبی داشته ولی طراحی رابط کاربری آن‌ها چنگی به دل نمی‌زند و به همین دلیل، نتوانسته‌اند پیشرفت کنند.
نکته‌ای که وجود دارد این است که اگر یکی از این بخش‌ها خوب نباشد، اثر آن دیگری را هم خنثی می‌کند.
چطور؟! فرض کنید یک اپلیکیشن طراحی کرده‌اید تا یکی از اساسی‌ترین نیازهای افراد را رفع کنید. یک طراح UX استخدام می‌کنید تا به شما بگوید اپلیکیشن دقیقاً چه ویژگی‌هایی باید داشته باشد و نقشه سفر مشتری چطور باید ترسیم شود. پس از هفته‌ها بررسی، بهترین UX ممکن را برای اپ خود طراحی می‌کنید، برنامه را لانچ کرده و در دسترس مخاطب قرار می‌دهید.
بعد از آن که مشتری/مخاطب برنامه را دانلود و نصب کرد، متوجه می‌شود متنی که در برنامه وجود دارد اصلاً خوانا نیست؛ تصور کنید متن با فونت زرد و ریز، بر روی پس زمینه سفید باشد. یا مورد دیگری که مخاطب شما با آن روبرو می‌شود این است که دکمه‌ها بسیار به هم دیگر نزدیک هستند و نمی‌توان روی یکی از آن‌ها تپ (کلیک) کرد.
این یک نمونه از UI بد است که نتایج مثبت UX را هم از بین می‌برد.
به غیر از این مسئله، ممکن است بارها با یک وب سایت فوق‌العاده زیبا برخورد کرده باشید که ورای انیمیشن‌های شگفت‌انگیز و رنگ بندی نقطه به نقطه، استفاده از آن فوق‌العاده سخت باشد؟ این یکی نمونه‌ای از UX ضعیف است که باعث می‌شود UI زیبا به چشم نیاید.
بنابراین وقتی صحبت از طراحی محصول به میان می‌آید، UI و UX مکمل یکدیگر هستند.
تلفیق UI و UX و پروداکت مارکتینگ (بازاریابی محصول)
بهترین اطلاعاتی که می‌تواند به شما کمک کند رابط و تجربه کاربری بهتری را ایجاد کنید چیست؟
با جمع آوری کدام داده‌ها می‌توانید UI و UX بهتری را طراحی کنید؟
برای این که بتوانید UI/UX بهتری را طراحی کنید، باید از برند، پرسونا برند و محصولی که ارائه می‌دهید، اطلاعات کافی را داشته باشید. باید درک عمیقی از برندی که به وسیله طراحی رابط کاربری شما به مخاطب ارائه می‌شود داشته باشید تا بتوانید به بهترین شکل ممکن رابط بین مشتری و محصول را طراحی کنید.
از طرفی دیگر، به داده‌های بازاریابی برای شناخت بهتر مخاطب نیاز دارید؛ برای مثال، باید بدانید رده سنی مخاطب برند یا محصول چیست، رفتار خرید مخاطب هدف به چه شکل است، در چه منطقه‌ای و در چه شرایطی زندگی می‌کند و ویژگی‌های شخصیتی و سبک زندگی او به چه صورت است. در حقیقت شما باید درک واضح و روشنی از پرسونا برند و پرسونای مخاطب داشته باشید.
یعنی باید داده‌هایی تلفیقی و ترکیبی از محصول، بازار و برند داشته باشید؛ این داده‌ها را تیم پروداکت مارکتینگ می‌تواند به شما بدهد!
بر اساس داده‌های بازاریابی تیم پروداکت مارکتینگ، می‌توانید تصویری واضح از مخاطب و عادات، رفتار خرید، ویژگی‌های شخصیتی، ارزش‌ها و ضد ارزش‌ها، رده سنی، جنسیت، مکان جغرافیایی و علایق و سلایق او داشته باشید. به این ترتیب، می‌توانید دقیق‌تر رابط کاربری و تجربه کاربری (UI و UX) که به او در رفع نیازهایش کمک کند ارائه دهید.
از طرف دیگر، داده‌های محصول تیم پروداکت مارکتینگ به شما کمک می‌کند تا برند، محصول و هر آن چه که هویت کسب و کار را می‌سازد، درک کنید. به این صورت می‌توانید بهترین رابط و تجربه کاربری که نماینده شرکت باشد را به مخاطبان ارائه دهید.
این داده‌ها ممکن است به صورت جدا نیز در اختیار شما قرار گیرد ولی آن چه که سبب کارایی این اطلاعات می‌شود، تحلیل ترکیبی آن است. با تحلیل ترکیبی داده‌های محصول و بازار که توسط تیم بازاریابی محصول انجام می‌شود، شما ارتباط بین این داده‌ها را بهتر درک می‌کنید و بین آنالیز هر کدام نیز شبکه‌ای از ارتباطات معنادار را مشاهده می‌کنید که به طور کلی بر روی درک شما از مخاطب و برند، تأثیر شگفت‌انگیزی می‌گذارد؛ بنابراین رابط کاربری و تجربه کاربری فوق‌العاده‌ای را می‌توانید ارائه دهید.
به جای کلام آخر…
بگذارید با یک مثال، به بهترین شکل ممکن قضیه را توضیح دهم تا بتوانید هم تفاوت UI و UX را درک کنید و هم ارتباط این دو با یکدیگر را بهتر متوجه شوید.
فرض کنید می‌خواهید آش بخورید.
آش، محتوا، محصول یا خدمات مورد نظر شماست که به خاطر آن، وارد آش فروشی می‌شوید. ولی آش فروش، مستقیم آش را داخل دهان شما نمی‌ریزد. بلکه به شما یک کاسه و یک قاشق برای مصرف محتوا، محصول یا خدمات (در اینجا، آش!) می‌دهد.
| آش = محتوا، محصول یا خدمات کاسه و قاشق = رابط شما با محتوا، محصول یا خدمات (رابط کاربری UI) |
خب، حالا شما چطور از قاشق و کاسه برای مصرف (خوردن) آش استفاده می‌کنید؟
نحوه استفاده شما از کاسه و قاشق، تجربه کاربری است (UX).
حالا چطور تجربه کاربری می‌تواند برای شما خوب نباشد؟
فرض کنید به جای قاشق سوپ خوری یا غذاخوری، آش فروش به شما یک قاشق چای خوری یا چاپ استیک (چوب غذاخوری شرقی) بدهد.
آیا می‌توانید با چاپ استیک به راحتی از آش خود لذت ببرید؟
من که شک دارم!
ارتباط تجربه کاربری و رابط کاربری را در مثال بالا متوجه شدید؟
اگر قرار است کاسه شما بزرگ باشد، دسته قاشق هم به همان نسبت باید بلند باشد تا زمانی که خواستید آش ته کاسه را بخورید، دستتان تا آرنج درون کاسه فرو نرود و آستینتان، آشی نشود.
فکر کنم این بهترین روش برای توضیح ارتباط تجربه کاربری و رابط کاربری بود.
در آخر، باید بگویم که دوست داریم نظراتتان را درمورد تجربه کاربری، رابط کاربری، این مقاله، ما، آژانس راندمانو، آب و هوا یا هر چیز دیگری که فکر می‌کنید جالب است، بدانیم. پس آن‌ها را در قسمت نظرات زیر همین مقاله به اشتراک بگذارید.
یک پاسخ
از مطالعه این مقاله لذت بردم، چقدر خوب به تفاوت بین UI و UX اشاره کردین. مثال آش هم عالی بود ?