در این مقاله یک بار برای همیشه به صورت تیتروار یاد می گیریم تفاوت UI با UX چی هستش. در هر سطح و ژانر شغلی که مربوط به سایت و یا اپلیکیشن هستید نیازمند یک دانش حدقلی در این دو عنوان هستید. اگر یک برنامه نویسی هستید که در حال طراحی یک سایت یا اپلیکشن هستید یا اینکه طراح گرافیکی هستیدکه نیازمند ارتقای دانش و لول آپ در زمینه طراحی باشید، نیاز دارید که حدقل به صورت تیتر وار این در این دو زمینه مطالعه کمی کرده باشید.
تجربه کاربری و طراحی رابط کاربری دو زمینه متفاوت هستند که سال ها باهم و درکنار هم همزیستی کرده اند این به معنی هستش که که هردو به یکدیگر وابسته هستن و هر کدوم از اون ها در موفقیت دیگری نقش دارن. UX پایه و اساس را ایجاد می کند و UI اون رو جذاب میکنه (بلعکسش هم معنی میده 🙂 )
راستی می تونید تمام خدمات گرافیکی سایت خودتون مثل بنر سایت رو از فروشگاه سایت ما با بهترین قیمت و بالاترین کیفیت دریافت کنید. همچنین فروشگاه سایت MFP خدمات گرافیکی بیشتری در حوزه هایی مثل اینستاگرام هم ارائه میده و می تونید در سریع ترین زمان تمام نیاز های گرافیکی و بصری خودتون رو تهیه کنید.
این بخش یکم توضیحات تخصصی تری داره ولی اگر تیتر وار بخوایم توضیح کلی راجب حوزه کاری و وظایف هرکدوم بدیم عبارت هستش از :
UX : شامل چندین وظیفه و چترچوب هستش.
UI :
UX : بسته به چارچوب مورد استفاده، فرآیند ممکن است مطابق با آن تغییر کند. به طور معمول، با درک مسئله و هدف با تحقیق آغاز می شود. سپس، با کمک کارگاه‌ها یا جلسات ایده‌پردازی، راه‌حل‌های ممکن را ایده‌بندی می‌کند تا در نهایت یک Wireframe و یک نمونه اولیه بسازد که آزمایش و اعتبارسنجی شود. در نهایت، پس از تمام بهبودهای حاصل از بازخورد، موارد قابل تحویل برای تیم توسعه ایجاد خواهد شد.
UI : پس از تصمیم گیری در مورد تجربه، طراح تمام طرح‌بندی‌ها را برای تمام اندازه‌های صفحه‌نمایش پشتیبانی شده ایجاد می‌کند و اجزا و سبک‌ها برای ایجاد یک وایفرم بهینه شده اعمال می‌شوند. یعنی افرادی که روی UI یک محصول یا طرح کار می کند باید ایده ها و تسک هایی که برای UX در تصمیم گرفته شده رو تبدیل به طرح واقعی و قابل لمس با استفاده از المان های بصری کنند.
البته این وسط بگم که می تونید تمامی نیاز های گرافیکی خودتون را با استفاده از سایت MFP تهیه کنید. کل این مقاله توسط تیم ما ترجمه و تولید و ویراستاری شده و هر بخش از اون رو که متوجه نشدید می تونید توی نظرات بپرسید تا بهتون توضیح کامل تری بدیم 🙂
UX – تحویل‌های معمول ممکن است شامل گزارشی با تحقیق، ایده و معیارها باشد. تحویل‌های توسعه ممکن است شامل یوزر فلو (User Flow)، وایفریم ها (wireframes)، نمونه‌های اولیه و مستندات باشد.
UI – مدل نهایی، عناصر تعاملی مانند انیمیشن‌ها و هر به‌روزرسانی رابط کاربری (UI) برای سیستم طراحی.
UX : یک اپلیکشن همه کار و به قولی پادشاه این کار Figma هستش که به ایجاد وایرفریم کمک میکنه، اما هنوز هم می تونید از Sketch یا نرم افزارهای دیگه استفاده کنید. و بعد از این ها سایت هایی مثل usertesting.com، userzoom.com یا maze.com وجود داره که ممکنه به انجام تحقیقاتتون کمک کنه!!
UI : باز هم، Figma از نظر بهترین نرم افزار برای رابط کاربری پیشتاز هستش ولی نرم افزار هایی مثل Adobe Xd هم وجود دارن که یکمی قدیمی ترن ولی خب به قدرت و سرعت فیگما نیستن. در نهایت، وقتی صحبت از ساخت انیمیشن یا ویدیو می شه، می توانیم از نرم افزار هایی مثل After Effects استفاده هم کنیم.
طیف گسترده ای از مهارت های نرم و سخت مورد نیاز در زمینه UX وجود داره. نیچ یا تمرکز داشتن روی فقط همین حوزه بودن ممکنه برای یافتن شغلتون مفید باشه. مهارت‌های معمولی از تحقیقات راجب کاربران ، وایفریم ها، آماده‌سازی و اجرای کارگاه‌ها، و ایجاد جریان‌های کاربری متغیر است. طراحان UX باید بسته به محدوده پروژه، برای به کارگیری مهارت های مختلف آماده باشن!!
به مهارت‌هایی در طراحی گرافیکی و تعاملی پایه، تئوری رنگ، تایپوگرافی، طراحی واکنش‌گرا و سلسله مراتب بصری نیاز دارن. باز هم بسته به پروژه و بلوغ شرکت، برخی از مهارت ها بیشتر از سایرین مورد نیاز خواهند بود.
در مجموع، طراحی UX یک فرآیند فکری هستش و پایه و اساس یک رابط کاربری خوب را تشکیل می ده. طراحی UI برای زیباکردن فرایند فکری که در UX تصمیم گیری شده به کار میره و نکات بصری و سلسله مراتبی ایجاد می کنه تا کاربر رو برای تکمیل هدف با یک مسیر بصری منسجم و جذاب راهنمایی کنه.
آشکارسازی مشکلات وظیفه طراحان و محققان UX است. بخش اساسی کار، درک نیازها و اهداف کاربرانی است که برای آنها طراحی می کنیم. انجام مصاحبه ها، نظرسنجی ها، معیارها و سایر کارهای تحقیقاتی می تواند به جمع آوری اطلاعات کاربر برای همدلی با آنها کمک کند. به عنوان مثال، مصاحبه با کاربران برای درک اینکه چرا آنها از پرداخت در آخرین مرحله خارج می شوند
در طول مرحله ایده پردازی، یک وظیفه معمولی رهبری و اجرای کارگاه ها برای ایده پردازی راه حل های بالقوه و همسویی با تیم بهترین گزینه برای توسعه است. این کارگاه نیاز به آمادگی بر اساس دانش جمع آوری شده از تحقیق دارد و از تمرینات عملی تشکیل شده است.
پس از کارگاه ها و جلسات ایده پردازی، طراح UX سفرهای کاربر را با سناریوهای ممکن مختلف ایجاد می کند تا تمام نتایج ممکن سفر را ترسیم کند.
در مرحله بعد، طراح UX وایفریم هایی با جززیات پایین ایجاد می کند تا UserFlow را تجسم کند. صفحه نمایش ها ممکن است در Figma یا هر نرم افزار دیگری ایجاد شوند
در مرحله بعد، محصولات پیچیده باید سازماندهی شوند و اطلاعات باید بر اساس سطوح و سایر سلسله مراتب ساختاربندی شوند
قبل از توسعه هر جریان جدیدی، طراح UX باید آن را با کاربران آزمایش کند تا هرگونه مشکل قابلیت استفاده را پیدا کند و بازخورد جمع آوری کند تا آن را در تعاملات بعدی پیاده سازی کند.
هنگام کار بر روی یک محصول با چندین طراح، داشتن یک سبک و اجزای منسجم مهم است. همه این عناصر بصری، سبک‌ها و قوانین در یک سیستم طراحی ذخیره می‌شوند. یعنی طراح با انتخاب یک دیزاین سیستم خوب پایه و اساس طراحی خودش رو آماده کنه.
پس از تعریف UX، طراح UI با اعمال عناصر دیزاین سیستم، رابط ها و طرح ها رو ایجاد می کنه. گاهی اوقات، یک نمونه اولیه برای نمایش ناوبری و تعاملات مورد نیاز است. به عنوان مثال، با کمک نرم افزارهایی مانند Figma یا Sketch برای ایجاد یک ماکت یا نمونه اولیه استفاده کنید و یک نمونه صفحه لندینگ پیج یک سایت رو بسازید
هر تعاملی امکانی برای افزایش تجربه محصول است. طراحان رابط کاربری روی طراحی انتقال بین عناصر، ایجاد حالت‌های دکمه مانند فعال یا غیرفعال، و تعاملات پیشرفته‌تر مانند انیمیشن‌ها کار می‌کنند.
یکی از ارکان طراحی رابط کاربری این است که یک طراحی را واکنش گرا می کند تا بتواند اندازه مناسبی را در اندازه های مختلف صفحه نمایش، از موبایل گرفته تا دسکتاپ، تغییر دهد.
مسیر های مختلفی برای یک طراح UI/UX شدن وجود داره. شما می تونید کورس ها و دوره های مناسبی رو از گوگل پیدا کنید و تهیه کنید و یا مقالات و کتاب های مختلفی رو تهیه و شروع به خوندنشون کنید (یکم سخته البته:). یا با جستجو توی یوتیوب آموزش های فارسی و اینگلیسی خوبی می تونید پیدا کنید (البته از یک جا به بعد دیگ آموزش فارسی خوب پیدا نمیشه و باید آموزش های رو فقط به صورت زبان اصلی ببینید تا نیازتون برطرف بشه) در کل راه های زیادی وجود داره ولی پیشنهاد من نویسنده به کسایی که تازه دارن این راه رو شروع میکنن این هستش:
1- اول از یوتیوب یا دوره مناسبی که تهیه کردید آموزش های اولیه و جامعی رو ببینید مخصوصا فیگما رو خوب یاد بگیرید و تمرین کنید.
2- طرح هایی متوسط رو به بالایی رو از سایت های ایرانی و خارجی معروف در فیگما پیدا کنید تا هم براتون تمرین خوبی بشه هم نمونه کار
3- اگر حس کردید ضعف دارید از یوتیوب یا منبع های انگلیسی مناسب مثل یودیمی هم به صورت تیتروار و سریع آموزش ببینید.
4- سریع تر بپرید توی پروژه ها یا به صورت فریلنسری پروژه هارو تست کنید و یا به صورت حضوری (چه کارآموزی و چه استخدامی) تجربه کسب کنید.
و در آخر بعد از استاد شدن توی همه بخش ها می تونید کمی دانش سطحی برنامه نویسی وب یعنی HTML و CSS رو یاد بگیرید چون حتما بعد ها بهش نیاز پیدا می کنید. راستی منتظر آموزش های ما در سایت MFP هم باشید شاید چیز مناسبی براتون پیدا شد.
این هم یک نقشه راه اصولی و کامل از UX و UX :
مرسی که تا آخر این مقاله رو مطالعه کردید می تونید باقی مقالات تخصصی مارو هم از سایت دنبال کنید 🙂
