طراحی UX و UI:
دو اصطلاح است که اغلب به جای هم استفاده می شوند، اما در واقع معنای بسیار متفاوتی دارند، بنابراین تفاوت آن ها دقیقاً چیست؟
ما همه مکالماتی را قدم زنان در مسیر فناورهای بزرگ جهان شنیده ایم، بحث های در مورد “UX” عالی یک محصول یا “UI” ضعیف یک وب سایت.
آیا این یک زبان مخفی است که شما هرگز از اسرار آن سر در نمیارید؟ آیا این افراد فقط از این اصطلاحات خاص استفاده می کنند تا خفن به نظر برسند؟
خوب، شاید با سوال دوم کمی موافق باشید، اما برای بقیه موارد قاطعانه جوابتون نه هست.
اگر می خواهید دقیقاً بدانید که UX و UI دقیقاً به چه معناست و تفاوت آنها چیست، به جای مناسبی آمده اید.
در زیر خلاصه ای از آنچه در این مقاله می خواهیم پوشش دهیم آورده شده است(مشاهده قسمت دوم مقاله).
ادامه مطلب را بخوانید تا بدانید که اصطلاحات “UX” و “UI” به چه معناست
و به کدام یک از دو حوزه طراحی بهتر پرداخته می شود و یا چگونه یک طراح UX یا طراح UI شوید.
- تفاوت بین طراحی UX و UI چیست؟
- طراحی UX و طراحی UI چگونه با هم کار می کنند؟
- طراحی UX یا طراحی UI: کدام مسیر شغلی برای شما مناسب است؟
- چرا این مقاله را باید بخوانیم؟
- جمع بندی و مطالعه بیشتر
۱. تفاوت بین طراحی UX و UI چیست؟
اول از همه چیز: UX و UI در واقع به چه معنا هستند؟
افرادی که شما از آنها شنود کرده اید در واقع در مورد دو حرفه بحث می کنند:
که علی رغم وجود چندین دهه فعالیت و از نظر تئوری قرن ها، توسط صنعت فناوری به عنوان طراحی UX و UI تعریف شده است.
طراحی UX به اصطلاح ” طراحی تجربه کاربر ” اشاره دارد، در حالی که UI مخفف “طراحی رابط کاربر” است.
هر دو عنصر برای یک محصول مهم هستند و از نزدیک با هم کار می کنند.
اما بر خلاف رابطه حرفه ای آنها، نقش ها کاملاً متفاوت هستند و به جنبه های بسیار متفاوتی از فرآیند تولید محصول و نظریه طراحی اشاره دارند.
قبل از اینکه تفاوت های اساسی بین UX و UI را بررسی کنیم، ابتدا تعریف می کنیم که معنی هر اصطلاح به صورت جداگانه چیست.
طراحی تجربه کاربر (UX) چیست؟
طراحی تجربه کاربر (UX) اولین روش طراحی محصولات توسط انسان است.
دون نورمن، دانشمند علوم شناختی و از بنیانگذاران مشاوره طراحی گروه نیلزن نورمن، در اواخر دهه ۱۹۹۰
اصطلاح “تجربه کاربر” معنا بخشیده است.
نحوه توصیف او در اینجا این است که:
آیا به طور قطع این تعریف درست است؟
خوب ممکن است بلافاصله توجه کنید به آنچه که در مقدمه ذکر کردم، این تعریف هیچ اشاره ای به فن آوری ندارد.
حتی هیچ اشاره ای به دیجیتال ندارد و همه چیز را درباره آنچه یک طراح UX در واقع انجام می دهد به ما نمی گوید، اما مانند همه مشاغل، تقطیر فرآیند از چند کلمه غیرممکن است.
هنوز هم، تعریف Don Norman، صرف نظر از کلیت آن به ما می گوید که، UX Design شامل همه تعاملات بین مشتری بالقوه یا فعال با یک شرکت است.
به عنوان یک فرایند علمی، می تواند برای هر چیزی اعمال شود: چراغ های خیابانی، اتومبیل ها، قفسه بندی کتاب و غیره.
با این حال، بر خلاف اینکه یک اصطلاح علمی است، از ابتدا استفاده از آن تقریباً به طور کامل در زمینه های دیجیتالی بوده است.
یکی از دلایل این امر این است که صنعت فناوری از زمان اختراع این اصطلاح شروع به منفجر شدن کرد.
اساساً، UX برای هر چیزی که می توان تجربه کرد اعمال می شود، مانند:وب سایت، دستگاه قهوه یا بازدید از سوپرمارکت.
قسمت “تجربه کاربر” به تعامل بین کاربر و یک محصول یا خدمات اشاره دارد، بنابراین طراحی تجربه کاربر (UX)، تمام عناصر مختلف شکل دهنده این تجربه را در نظر می گیرد.
یک طراح UX به چگونگی احساس کاربر هنگام تجربه کردن فکر می کند و یا اینکه چقدر راحت تر کاربر می تواند کارهای مورد نظر خود را انجام دهد.
به عنوان مثال:
- مراحل خرید در هنگام خرید آنلاین چقدر آسان است؟
- چقدر آسان است که شما آن پوست کن سبزیجات را بخرید؟
- آیا برنامه بانکی آنلاین شما مدیریت پول را برای شما آسان می کند؟
هدف نهایی از طراحی UX ایجاد تجربه های دلپذیر آسان، کارآمد، مرتبط و همه جانبه برای کاربر است.
ما به سوال “طراح UX چه کاری انجام می دهد؟” در مقاله بعدی پاسخ خواهیم داد.
ولی در حال حاضر آنچه که شما باید در مورد طراحی UX
به طور خلاصه بدانید این است:
- طراحی تجربه کاربر (UX) فرآیند توسعه و بهبود کیفیت تعامل، بین یک کاربر و همه جنبه های شرکت است.
- از نظر تئوری، طراحی تجربه کاربر (UX) عملی غیر دیجیتالی (علوم شناختی) است
اما بیشتر توسط صنایع دیجیتال استفاده و تعریف می شود. - طراحی UX مربوط به تصاویر نیست، این متمرکز روی احساس کلی کاربر هنگام تجربه کردن هر چیزی است.
طراحی رابط کاربر (UI) چیست؟
بر خلاف اینکه این یک زمینه قدیمی و تمرین شده است
به دلیل طیف گسترده ای از تعبیر سوال ” طراحی رابط کاربر (UI) چیست؟ ” پاسخ دادن به آن دشوار است.
در حالی که تجربه کاربر مجموعه ای از وظایف متمرکز بر بهینه سازی یک محصول برای استفاده موثر و لذت بخش است
طراحی رابط کاربر (UI) مکمل آن است: ظاهر، احساس، ارائه و تعامل یک محصول.
اما مانند UX، صنایعی که طراحان رابط کاربری را استخدام می کنند، اغلب به راحتی دچار اشتباه می شوند
تا آنجا که پست های مختلف شغلی اغلب از این حرفه به عنوان موارد کاملاً متفاوت یاد می کنند.
اگر به تبلیغات شغلی و شرح شغل برای طراحان رابط کاربر نگاه کنید، بیشتر تفسیرهایی از این حرفه پیدا خواهید کرد که شبیه طراحی گرافیک هستند، گاهی اوقات به طراحی مارک تجاری و حتی توسعه فرانت اند نیز گسترش می یابد.
اگر به تعاریف “کارشناسان” از طراحی رابط کاربر (UI) نگاه کنید، بیشتر توصیفاتی را پیدا خواهید کرد که تا حدی با طراحی تجربه کاربر (UX) کاملاً یکسان هستند، حتی با اشاره به همان تکنیک های ساختاری.
خوب کدام یک درست است؟ پاسخ غم انگیز این است: هیچ کدام.
بنابراین بیایید ضبط را یک بار و برای همیشه تنظیم کنیم
بر خلاف UX، طراحی رابط کاربر (UI) یک اصطلاح به شدت دیجیتالی است.
رابط کاربری نقطه تعامل بین کاربر و دستگاه دیجیتال یا محصول است
مانند صفحه لمسی تلفن هوشمند یا صفحه لمسی که برای انتخاب نوع قهوه از دستگاه قهوه استفاده می کنید.
در رابطه با وب سایت ها و برنامه ها، طراحی رابط کاربر (UI)، احساس و تعامل محصول را در نظر می گیرد.
همه چیز این است که اطمینان حاصل کنید که رابط کاربری یک محصول تا حد ممکن بصری(دیداری) است.
و این بدان معنی است که با دقت هر یک از عناصر بصری و تعاملی را که کاربر ممکن است با آن روبرو شود را باید بررسی کنید.
یک طراح UI درمورد آیکون ها، دکمه ها، تایپوگرافی، طرح های رنگی، فاصله، تصاویر و طراحی واکنش گرا فکر خواهد کرد.
مانند طراحی تجربه کاربر (UX)، طراحی رابط کاربر (UI) نیز نقشی چند وجهی و چالش برانگیز است.
این مسئول واگزاری:
توسعه، تحقیق، محتوا و طرح محصول به یک تجربه جذاب، راهنما و پاسخگو برای کاربران است.
ما در مقاله بعدی به روند طراحی UI و وظایف خاصی که از یک طراح UI می توان انتظار داشته باشیم، خواهیم پرداخت.
قبل از اینکه تفاوت های اصلی بین UX و UI را در نظر بگیریم
بیایید سریع بدانیم که طراحی رابط کاربری (UI) چیست:
- طراحی رابط کاربر یک عمل کاملاً دیجیتالی است، این تمام عناصر بصری(دیداری) تعاملی رابط محصول
از جمله: دکمه ها، آیکون ها، فاصله، تایپوگرافی، طرح های رنگی و طراحی واکنش گرا را در نظر می گیرد. - هدف از طراحی UI راهنمایی بصری کاربر از طریق رابط محصول است
همه چیز در مورد ایجاد یک تجربه بصری است که کاربر نیازی به فکر کردن زیاد ندارد! - طراحی UI نقاط قوت و دارایی بصری برند را به رابط محصول واگذار می کند
و از اطمینان حاصل می کند که طراحی از نظر سازگاری، انسجام و زیبا شناسی دلپذیر باشد.
اکنون ما تعریف مشخصی از هر دو طراحی UX و UI داریم، پس بیایید تفاوت های اصلی بین این دو را در نظر بگیریم.
تفاوت اصلی بین UX و UI
یک تشبیه وجود دارد که من می خواهم برای توصیف قسمت های مختلف یک محصول (دیجیتال) استفاده کنم:
اگر محصولی را به عنوان بدن انسان تصور کنید، استخوان ها کدی را نشان می دهند که به بدن ساختار می بخشد.
اندام ها نشان دهنده طراحی UX هستند: اندازه گیری و بهینه سازی نیرو پشتیبانی در برابر عملکردهای زندگی.
و طراحی UI معرف بخش تزئینی یا آرایشی بدن است(ظاهر): عرضه اندام، حواس و واکنش ها.
چند مثال برای درک بهتر:
اما اگر هنوز گیج هستید نگران نباشید! شما تنها نیستید! همانطور که Rahul Varshney، یکی از خالقان Foster.fm می گوید:
اگر جای یک قیاس دیگر را دارید، Dain Miller رابطه بین طراحی UX و UI را به طور کامل خلاصه می کند:
مهم است که درک کنیم UX و UI دست به دست هم می دهند، شما نمی توانید یکی را بدون دیگری داشته باشید.
با این حال، شما برای طراح UX شدن نیازی به داشتن مهارت طراح UI ندارید و بالعکس – UX و UI نقش های جداگانه ای با فرایندها و وظایف دارند!
تفاوت اصلی که باید به خاطر بسپارید این است:
طراحی UX کاملاً مربوط به احساس کلی تجربه است، در حالی که طراحی رابط کاربر (UI) کاملاً مربوط به نحوه کارایی و رابط های محصول است.
یک طراح UX کل سفر کاربر(مدل Aida) را برای حل یک مشکل خاص در نظر می گیرد:
چه مراحلی را طی می کنند؟ چه چیزی را برای انجام وظایف نیاز دارند؟ تجربه چقدر راحت است؟
بیشتر کارهای آنها معطوف به کشف انواع مشکلات و نقاط درد کاربران است و اینکه چگونه یک محصول خاص ممکن است مشکلات آن ها را برطرف کند.
آنها تحقیقات گسترده ای را در مورد کاربر انجام خواهند داد تا بفهمند کاربران هدف چه کسانی هستند و نیازهای آنها در رابطه با یک محصول خاص چیست.
سپس آنها با در نظر گرفتن مواردی مانند معماری اطلاعات، یعنی:
“نحوه سازماندهی و برچسب گذاری محتوا در سراسر محصول و انواع خاصی از ویژگی های کاربر” سفر کاربر را در یک محصول ترسیم می کنند.
در نهایت، آنها قاب های را ایجاد می کنندکه طرح های اصلی برای اسکلت محصول را مشخص می کند، با طرح برداری از اسکلت محصول، طراح UI برای زنده کردن آن وارد عمل می شود.
طراح UI تمام جنبه های بصری سفر کاربر(مدل Aida) را شامل می شود، از جمله تمام صفحه های نمایش فردی و نقاط لمسی که ممکن است کاربر با آن روبرو شود.
به ضربه زدن روی یک دکمه، پیمایش به پایین صفحه یا کشیدن انگشت در گالری تصاویر فکر کنید.
در حالی که طراح UX طرح کلی سفر را ترسیم می کند، طراح UI تمام جزئیاتی را که این سفر را ممکن می سازد متمرکز می کند.
این بدان معنا نیست که طراحی رابط کاربر (UI) همه چیز در مورد ظاهر است.
طراحان رابط کاربری تأثیر بسزایی در در دسترس یا نبودن یک محصول دارند.
آنها سوالاتی مانند:”چگونه می توان از ترکیبات مختلف رنگ برای ایجاد کنتراست(تضاد) و افزایش خوانایی استفاده کرد؟” یا “چه جفت رنگی برای کور رنگی مناسب است؟”.
امیدوارم که شما در حال حاضر ببینید که چگونه طراحی UX و UI در واقع دو چیز بسیار متفاوت هستند.
به طور خلاصه:
- طراحی UX تماما در مورد شناسایی و حل مشکلات کاربر است
و طراحی رابط کاربر (UI) تماما در مورد ایجاد رابط های تعاملی بصری، زیبا و دل انگیز است. - طراحی UX معمولاً در فرآیند تولید محصول حرف اول را می زند و به دنبال آن رابط کاربری است
طراح UX طرح اصلی اسکلت سفر کاربر(مدل Aida) را تهیه می کند، سپس طراح UI آن را با عناصر بصری(دیداری) و تعاملی پر می کند. - UX می تواند برای هر نوع محصول، خدمات یا تجربه اعمال شود. رابط کاربری خاص محصولات و تجربیات دیجیتال است.
۲. طراحی UX و طراحی UI چگونه با هم کار می کنند؟
ما تفاوت بین UX و UI را بررسی کرده ایم. حالا بیایید نگاهی به نحوه کار آنها با هم بیندازیم.
شاید از خود بپرسید که آیا یکی از دیگری مهمتر است، اما واقعیت این است که هر دو بسیار مهم هستند!
اجازه دهید نقل قول از هلگا مورنو، طراح و متخصص را بیان کنم، که در مقاله خود The Gap Between UX and UI:
همانطور که مشاهده می کنید، UX و UI کاملاً دست به دست هم می دهند و در حالی که میلیون ها نمونه از محصولات عالی با کمک یکی و نه هر دو وجود دارد
تصور کنید که با کمک هر دو زمینه چقدر می توانسته اند موفق تر باشند.
طراحی UI مانند ظاهر خامه ای روی کیک (UX) است.
تصور کنید که به یک ایده شگفت انگیز برای یک برنامه رسیده اید
چیزی که به وضوح در بازار گم شده است و می تواند زندگی مردم را به سمت بهتر تغییر دهد.
شما یک طراح UX استخدام می کنید تا تحقیقات مربوط به کاربر را انجام دهد و به شما کمک کند بفهمید برنامه شما دقیقاً چه ویژگی هایی باید داشته باشد و کل سفر کاربر(مدل Aida) چگونه باید ترسیم شود.
برنامه شما چیزی را ارائه می دهد که مخاطب هدف شما به آن نیاز دارد و می خواهد.
با این حال، هنگام بارگیری آن، متوجه می شوند که متن موجود در هر صفحه به سختی خوانا است (به متن زرد روی زمینه سفید فکر کنید).
علاوه بر این، دکمه ها خیلی نزدیک به هم هستند، آنها مرتباً دکمه اشتباه را می زنند! این یک مورد کلاسیک است که UI بد باعث خراب شدن UX خوب می شود.
از طرف مقابل، آیا تا به حال به یک وب سایت واقعاً زیبا برخورد کرده اید
و متوجه شده اید که فراتر از انیمیشن های دیوانه کننده و طرح رنگی عالی آن، در استفاده از آن دچار رنج واقعی شده باشید؟
UI خوب هرگز نمی تواند UX بد را جبران کند
این مانند این است که یک کیک تزئین شده زیبا را انتخاب کنید که در واقع وقتی آن را گاز می گیرید طعم وحشتناکی دارد.
بنابراین، وقتی صحبت از طراحی محصول می شود، UX و UI مکمل یکدیگر هستند
و در بازار رقابتی امروز، صحیح ساختن هر دو جنبه کاملاً ضروری است.
چه شما به عنوان یک طراح UX و چه یک طراح UI انتخاب کنند، داشتن درک درستی از هر دو مفید است.
به هر حال، شما به ناچار با هم کار خواهید کرد. که ما را به بخش بعدی می برد …
۱۰ دیدگاه. ارسال دیدگاه جدید
استاد شیخی همینطوری ادامه بده عاااااااااالی بود. شخصا از شما خیلی یاد گرفتم.
از خرسندی کلام شما کمال تشکر را دارم.
اطلاعات واقعا جالب بود
لطفا این موارد رو در قالب ویدیو در وب سایت فوق العادتون قرار بدید
در اسرع وقت تلاش میکنیم که محتوا را به صورت ویدیو برای شما عزیزان به اشتراک بگذاریم.
استاد شما ux و ui وب سایت رامان صفر و یک رو طراحی کردید ؟
خیلی جالب و زیباست
چطوری میتونیم سایتی به این زیبایی خلق کنیم ؟
زحمت وب سایت را مهندس موسوی کشیدن.
میتوانید از طریق پشتیبانی از نظرات کارشناسی ایشان کمال استفاده را ببرید.
سلام
سپاسگذار از این مقاله مفید
فقط چرا در خیلی از سایت های ایرانی این مسائل رعایت نمیشود؛ یعنی به کاربر اهمیت داده نمیشود ؟ یا خیلی ساده هست که نیاز کاربر را برطرف نمیکند یا خیلی پیچیده که نمیشود از سایت استفاده کرد حتی از لحاظ طرح های گرافیکی و رنگبندی زیاد جالب به نظر نمیرسند اینطور کاربر احساس خوبی از بودن در آن سایت نمیتواند داشته باشد .
سلام و درود
زیرا در ایران همواره بیش ترین توجه و بودجه بندی هزینه برای خلق آثار، قبل از پیداش خرج میشود.
و یا حتی در خرید لوازم خدمات قبل از فروش برای مشتری خیلی بیش تر از خدمات پس از فروش می باشد.
از این رو این بی مهری را در دنیایی دیجیتالی هم شاهدیم.
پس جای تعجبی نداره وبسایت های که از هنر دیجیتال مارکتینگ فقط برای فروش استفاده میکنن و یا از اهمیت تستر درک خوبی ندارند، به زودی رقابت میبازن.
امپراطوری روم در اوج قدرت پس از رضایت از خودش سقوط کرد، از همین رو توصیه میکنم تستر های همیشه ناراضی با دانش UI , UX برای وبسایت های خود استخدام کنید.
سلام و عرض ادب
به عنوان یک طراح تجربه کاربری خوشحالم که شما به این مبحث توجه کردید و مطلبی در این مورد منتشر کردید. صد البته که بحث UX و UI خیلی فراتر از این‌هاست اما من میخوام فقط به یک نکته اشاره کنم، اگر شما کتاب The Elements of User Experience نوشته Jesse James Garrett رو مطالعه کنید، میبینید که UI کاملا بخشی از UX هست و این دو مفهوم به هیچ عنوان جدا و مستقل از هم نیستن. سطوح UX به ترتیب عبارتند از: Strategy , Scope , Structure , Skeleton , Surface که طراحی Visual Elements در سطح آخر یعنی Surface انجام میشه که در واقع همون UI یا رابط کاربریه…
متاسفانه در حال حاضر اکثر سایت‌های ایرانی توجهی به استانداردها و اصول طراحی تجربه کاربری نشون نمیدن که امیدوارم این مساله به مرور زمان بهتر بشه.
سلام و درود
با تشکر از شما برای ارجاع اطلاعات مفیدتان به ما.
صحبت های شما رو تصدیق میکنم
بله از این جمله استنباط میشه که UX بخشی از UI نیست، بلکه UI بخشی از UX هست.
ولی پیداش هر کدوم و کاربردشون در صنعت باهم فرق داره، چون UX گستره بیش تری از طراحی بصری یا لایه بندیه (که از حرف های شما هم میشه این نکته رو استخراج کرد) هست.
برای همین بغییر از فناوری و تکنولوژی دانش UX اهمیت بسزایی در علوم شناختی داره، حتی میشه گفت در مبحث های که طراحی بصری کارایی چندانی ندارد مثل روانشناسی ذهن باز دانش UX به کمک ما می آید.
در کل نظر من اینه UI بخشی از UX است نه همه آن، در بین مواردی که برای UX گفتید در علوم دیگر هم شاهد کاربرد آن هستیم، در کل UX جامعه گسترده تری را در بر میگیره و واژه ای قدیمی تر نسبت به UI است.
پ.ن: پیدایش و درک واژه ها، کاربرد متفاوت آن ها در صنعت و مقدار گستردگی متفاوت هر کدام از این واژه ها دلیلی بر مستقل بودن آن ها از هم نیست(فقط UX مفهومی بسیار گسترده تر از UI است)!