مقدماتی از رابط و تجربه کاربری (ui/ux)

توی این جلسه قصد داریم ابتدا تعاریفی از طراحی رابط و تجربه کاربری را بیان کنیم. پس از آن، چرخه تجربه کاربری که توسط آقای دونالد نورمن مطرح شده است را توضیح خواهیم داد.

تعاریفی از طراحی رابط و تجربه کاربری

به جلسه اول دوره رایگان طراحی رابط کاربری، از آژانس نوآوری رسام خوش آمدید. توی این جلسه قصد داریم ابتدا تعاریفی از طراحی رابط و تجربه کاربری را بیان کنیم. پس از آن، چرخه تجربه کاربری که توسط آقای دونالد نورمن مطرح شده است را توضیح خواهیم داد.

در این قسمت از آموزش رایگان دوره ui ux ابتدا به سوال تجربه کاربری چیست؟ پاسخ می‌دهیم. تجربه کاربری (user experience)، به کلیه عواطف، احساسات، واکنش‌ها و خاطرات ما از محصولات مختلف گفته می‌شود. این خاطرات ممکن است مثبت یا منفی باشد و در بین افراد مختلف جامعه نیز یکسان نباشد. برای مثال شاید شما از برندی مانند اسنپ رضایت زیادی داشته باشید، اما دوست یا همکار شما از این برند ناراضی باشد.

افزون بر این، تجربه کاربری شما از برند اسنپ، محدود به ظاهر و طراحی گرافیکی آن نیست. اینجا مفهوم دیگری مطرح می‌شود. بله، طراحی رابط کاربری یا همان user interface. در واقع UI واسطی بین کاربر و سیستم محسوب می‌شود. (مثل یک منشی که شما را به یک پزشک متصل می‌کند). شاید این واسط، خیلی خوب و متناسب با نیاز کاربر طراحی شده باشد یا برعکس واسطی با طرحی ضعیف و غیر اصولی محسوب شود.

تعریف طراحی و رابط تجربه کاربری با شکل

به تصویر بالا دقت کنید. رابط کاربری بخشی از تجربه کاربری است. می‌خواهیم به یک نتیجه برسیم. برای داشتن یک محصول دیجیتال خوب و کاربرپسند، ما باید در تمام این دایره قوی عمل کنیم. پس رضایت کاربران از اسنپ یا هر برند دیگری، صرفاً محدود به UI و طراحی گرافیکی و دیزاین بصری آن نیست. در دایره بزرگ موضوعات دیگری به جز UI نیز اهمیت ویژه‌ای دارند. مثلاً ممکن است خدمات پس از فروش، پشتیبانی فنی، قیمت و یا هرچیز دیگری موجب رضایت یا عدم رضایت شود. بنابراین صرفاً طراحی UI شامل تجربه کاربری نمی‌شود.

زیر مجموعه‌های تجربه کاربری

حالا این دایره بزرگ و دوست داشتنی شامل چه مواردی می‌شود؟ (این تقسیم‌بندی در متون و دوره‌های مختلف می‌تواند متفاوت باشد، اما کلیت آنچه که می‌بینید رایج و صحیح است).

  • پرسونا: یک فرم که بیانگر خصوصیات گروه کاربرانی است که از خدمات یا محصولات ما استفاده می‌کنند. در ابتدا هر کسب‌وکاری برای انجام مراحل طراحی ui ux باید جواب سوال پرسونای مشتری چیست؟ را به درستی پیدا کنند.
  • تحقیق کاربریتحقیق تجربه کاربری به روش‌هایی برای جمع‌آوری اطلاعات گفته می‌شود. زیرا باید مطمئن شویم که اصلاً نیاز کاربران ما چیست؟
  • کاربردپذیریکاربرد پذیری به سنجه‌های مختلفی برای بررسی کیفی محصول اشاره می‌کند. (سخت است اما موضوع آن را در ویدیو معرفی خواهیم کرد. این بخش یک سری تست هم دارد که با آن‌ها می‌توان طراحی خود را سنجید.)
  • دسترسی‌پذیریچیزی حدود 15 درصد افراد جامعه معلول که نه، توان‌خواه هستند. محصولات دیجیتال باید برای این دسته از افراد نیز بهینه باشد.
  • معماری اطلاعاتمعماری اطلاعات در تجربه کاربری مثل یک کتابخانه عمومی است. به این ترتیب چگونه باید محتوای آن‌ها را بچینیم که متناسب با خواسته و نیاز کاربر باشد؟ چگونه کاربران می‌توانند سریع‌تر و راحت‌تر به محتواها دسترسی پیدا کنند؟
  • طراحی رابط کاربری: طراحی رابط کاربری ui ux هم که معرف حضورتان هستند.
  • تجربه نویسیمتن و محتوای داخل محصولات دیجیتال توسط چه افرادی نوشته شود؟ البته منظورمان متون طولانی بلاگ و محصول نیست. متون خطاها، دکمه‌ها، CTAها و…

چرخه تجربه کاربری دونالد نورمن

این چرخه توسط آقای دونالد نورمن، یکی از پیشگامان دانش طراحی و تجربه کاربری ui ux، ارائه شد. آقای نورمن اوایل دهه 90 میلادی در شرکت اپل (احتمالاً به عنوان یک مشاور) اعلام کردند که ما تجربه کاربری خوبی ارائه نمی‌کنیم. از آن زمان به بعد و به مرور، این تخصص به دانش IT افزوده شد. تخصص تجربه کاربری یک گرایش آکادمیک تحت عنوان HCI هست که زیرمجموعه IT بوده و در خیلی از کشورها امروز به عنوان رشته آکادمیک شناخته می‌شود.

چرخه طراحی و تجربه کاربری دونالد نورمن

البته آقای نورمن، طراحی را در دو مرحله ارائه کرده است. یعنی بعد از پرسونا و تحقیق تجربه کاربری، طراحی ابتدا در مقیاس‌های ساده‌تری (اسکچ و وایرفریم) با استفاده از نرم‌افزارهای طراحی ui ux اجرا می‌شود. این مرحله تحت عنوان low-fidelity نام گذاری شده است. پس از آن، طراحی وارد جزئیات بیشتر شده که به آن high-fidelity گفته می‌شود. بعد از اتمام این فرآیند، حالا با استفاده از تست‌های کاربردپذیری، باید بسنجیم محصولی که برای آن تحقیق و طراحی انجام دادیم، به‌درستی مسیرش را طی کرده است؟ پس باید تست و ارزیابی را به‌دقت انجام دهیم.

آیا همه چیز اینجا تمام می‌شود؟ قطعاً نه. نرم‌افزارهای بزرگ مانند اسنپ بارها بروز شدند و تغییرات ظاهری و باطنی داشتند. این موضوع بیانگر این است که سلیقه و نیازهای کاربر در گذر زمان تغییر می‌کند. همچنین دانش و اطلاعات ما نیز افزایش می‌یابد. پس این چرخه، بارها و بارها تکرار می‌شود و هیچ وقت قرار نیست تمام شود. مانند چرخه‌هایی که در زیست شناسی و… می‌شناسیم. البته آن 7 موردی که بالا معرفی کردیم در واقع همین چرخه هستند که با جزئیات و عناوین بیشتری تعریف شده‌اند. حتی می‌توانند با جزئیات بیشتری نیز بیان شوند که در ادامه دوره این کار را می‌کنیم.

تفاوت Low-Fidelity و High-Fidelity

این تصویر شاید مثال خوبی برای بیان تفاوت وایرفریم و پروتوتایپ باشد. در وایرفریم که طراحی low-fi (مرحله دوم چرخه نورمن) هست، هدف ما این است که با هزینه و زمان کوتاه‌تری اسکلت پروژه را اجرا و سپس، با کارفرما و ذینفعان (stakeholders) گفتگو و پس از تایید آن‌ها، سراغ High-fi (مرحله سوم چرخه نورمن) برویم. در واقع در مرحله سوم ما رنگ‌ها، استایل‌ها، دیزاین‌سیستم، تایپوگرافی دقیق، گرید بندی، اینترکشن و… را به طرح اضافه می‌کنیم.

Left ImageRight Image

نقطه اول دوره طراحی رابط و تجربه کاربری

ما در این قسمت از دوره طراحی رابط و تجربه کاربری به تعاریف مختلفی از جمله ui و چرخه دونالد نورمن پرداخته‌ایم. شاید این مباحث در قدم اول، برای برخی عزیزان دشوار به نظر برسد. اما صبور باشید و پرانرژی ویدئوهای آموزش دوره طراحی رابط و تجربه کاربری ui/ux را دنبال کنید. اطمینان داشته باشید که با مطالعه و تمرین، هر دانشی (که به آن علاقه داشته باشیم) را می‌توانیم فتح کنیم. هر سوالی داشتید از بخش دیدگاه‌ها، از متخصصین آژانس نوآوری رسام بپرسید. همچنین خوشحال می‌شویم از پیشنهادات و تجربیات شما در این زمینه استفاده کنیم.
موفق باشید 😍

4.7/5 - (25 امتیاز)

27 پاسخ

  1. بسیار عالی . خسته نباشید
    فیلم اموزشی خیلی خوب توضیح داده شده و کیفیت بالایی هم دارد.

    1. درود بر شما
      خوشحالیم که از مطالب راضی بودین.
      موفق باشید.

  2. درود و خدا قوت
    سپاس از سایت و آموزش خوبتون، این کارتون واقعاً با ارزشه که به فکر ارتقاء سطح سواد هموطنان هستید و این کار رو با ارائه‌ی محتواهای مفید و کاربردی به صورت رایگان انجام می‌دهید، مطمئناً تولید این آموزش‌ها با این کیفیت پر از زحمت و هزینه بوده و قیمتی نمیشه براشون گذاشت، این‌ها رو گفتم که به نوبه‌ي خودم از رسام تشکر کنم تا پر قدرت ادامه بدید 💪💪💪 با این انرژی که بهتون دادم ***رسامی‌ها*** بی‌صبرانه منتظر آموزش و ویدئوهای بعدی‌تون هستم😂😎

    1. درود بر شما حامد عزیز
      بسیار خوشحالم که محتوا مورد تایید و استفاده شما قرار گرفته. قطعا در این موضوع استمرار خواهیم داشت.

      از لطف و مهربانی شما سپاسگزارم.

    2. عالی استاد مثل همیشه مرسی از بیان خوب و توضیحات کاملتون .

  3. ممنون از وقتی که گذاشتید و زحمتی که کشیدید.
    محتوا خیلی کامل و جامع و باکیفیت بود.

  4. سلام و درود
    من که لذت بردم از جلسه اول
    خیلی سپاسگزارم که این فرصت رو در اختیار ما گذاشتین.

  5. سلام خیلی ممنون از دوره خوبتون.
    میخواستم بدونم جلسات ادامه داره یا مباحث کامل تموم شده؟

    1. درود و عرض ادب
      سپاس از لطف شما.

      این دوره تکمیل شده. دوره وردپرس و سئو هم در حال تهیه است. در آینده دوره فروشگاه آنلاین هم اضافه می‌شود. دوره‌های مذکور، رایگان هستند.
      این دوره تکمیل شده اما بعدا بروزرسانی می‌شود در گذر زمان.

  6. سلام، جا داره تشکر ویژه کنم از دوره آموزشی که قرار دادید

    میخواستم بدونم امکانش هست جزوه این دوره آموزشی رو در قالب PDF برای دانلود قرار بدید؟

    ممنون

    1. درود بر شما. وقت بخیر
      سپاس از لطف شما.

      تمام مطالبی که در فایل pdf بود، همگی رو به صورت متن و عکس و حتی با کیفیت و کمیت بالاتری، در صفحات دوره نوشتم بنده. می تونید مثلا اکستنشن گوگل کروم نصب کنید و از صفحات خروجی pdf بگیرید.
      علی‌رغم این موضوع اگر باز همان فایل رو مدنظر داشتید، به آیدی تلگرام داخل فوتر پیام بدید براتون ارسال می‌کنم.

      موفق باشید.

  7. سلام، وقت به خیر.
    انشالله خداوند به شما توان و برکت بده. همین که این زحمت رو کشیدید و بصورت رایگان در اختیار مردم قرار دادید جای تشکر داره. من به نوبه خودم از شما قدر دانی میکنم و وب‌سایت شما رو به دانشجویانم معرفی می‌کنم. انشالله بتونید ادامه بدید. حق یارتان.

    1. درود بر شما. عرض ادب
      سپاس از لطف و مهربانی شما

      بنده از شما استاد گرامی سپاسگزارم که افتخار دادید و مشاهده فرمودید.
      موفق باشید.

  8. سلام وقت بخیر جناب حمداللهی عزیز

    بی نظیر بود ممنونم از ارائه این دوره ارزشمند

    من چند تا سوال برام پیش اومده الان که نمیتونم یو ایکس رو به خوبی یاد بگیریم نمیتونم یو ای رو تمرین کنم چون من احساس میکنم اونجور که باید متوجه موضوعات یو ایکس نمیشم حالا ممکنه کم کم که جلو برم درست بشم

    بعد اینکه اگر محبت کنید درباره گرفتن اولین پروژه اینکه چجوری بگیریم چه کارهایی باید توی اولین پروژه انجام داد مسیرش رو یه توضیحاتی بدین ممنون میشم

    موفق باشی جناب حمداللهی عزیز

    1. درود بر شما. وقت بخیر
      سپاس از لطف شما.

      مباحث تحقیق کاربری، معماری اطلاعات، کاربردپذیری، دسترسی پذیری، تجربه‌نویسی و… همگی مشابه بحث UI زیرمجموعه‌ای دانش تجربه کاربری هستند. اما خب در این دوره ما بیشتر روی مباحث UI تمرکز کردیم. روش بدی هم نیست چون بهتر از ابتدا کلیاتی از همه مباحث UX را بدانیم (مباحث 10 جلسه اول دوره) و سپس کمی در UI عمیق بشویم. فیگما را بیاموزیم و اصول UI مانند تایپوگرافی، سلسله مراتب، دیزاین سیستم و… را نیز بیاموزیم. در واقع هدف این دوره تا اینجا هست. اما به هرحال هیچ دانشی را نمی‌توان در یک دوره گنجاند. باید بازهم مطالعاتی در زمینه تجربه کاربری داشته باشید. اما نگران نباشید. به شما اطمینان می‌دهم که اگر تمرین کنید و نمونه کار قوی خلق کنید هم در این دانش را می‌آموزید و هم به پروژه نیز خواهید رسید.

      نمیدانم چقدر از محتوای دوره را مشاهده فرمودید. در خصوص گرفتن پروژه جلسه آخر من مفصل عرض کردم نکاتی رو. حتما آن جلسه و محتوای متنی آن جلسه هم بعدا مشاهده بفرمایید.

  9. سلام وقت بخیر جناب حمداللهی عزیز

    من دوره رو کامل دیدم دارم از اول مرورش میکنم حتی جلسه اخر که سایت های رو معرفی کردین برای پروژه
    پس من باید در حین تمرین یو آی در رابطه با یو ایکس هم مطالعه کنم و اطلاعاتم رو بیشتر کنم

    از درگاه خداوند برای شما ارزوی موفقیت و سربلندی می کنم
    باز هم ممنونم از شما استاد عزیز

    1. درود و عرض ادب

      بله درست فرمودید. دانش تجربه کاربری بسیار گسترده هست و بدیهی است که حتی اگر دوره خوبی را هم مشاهده کرده باشیم، نیاز می‌شود در گذر زمان نیز مطالعه و تمرین داشته باشیم. امیدوارم نتایج ارزشمندی بگیرید.

      سپاس از لطف و مهربانی شما.
      موفق باشید

  10. درود
    من دوره رو الان تموم کردم و قصد دارم دوباره از اول ببینم و این دفعه با تمرین و تمرکز بیشتر. خیلی خیلی تشکر میکنم ازتون بابت این دوره ی عااااالی. همیشه بدرخشید.
    خدا قوت

    1. درود بر شما. وقت بخیر

      عمیقا خوشحال هستم اگر مفید واقع شده. بنده سپاسگزارم که برای یادگیری وقت صرف می کنید. من نیز گاهی پیش آمده که یک یا چند ویدئو را بیش از یکبار ببینم و این مقوله عجیب نیست. گاهی باید برخی مباحث را تکرار کرد و در حین تکرار نیز تمرین کرد که یادگیری عمیق‌تر بشود.

      موفق باشید.

  11. سلام وقت بخیر.
    با تشکر از شما برای این دوره خوب و رایگانی که در اختیار ما گذاشتید.
    یک مشکلی هست که ویدیو ها به صورت کامل دانلود نمیشه ، با سیستم های مختلف و اینترنت های متفاوت امتحان کردم اما نشد.
    اگر امکان داره بررسی کنید لطفا.

    1. درود بر شما. وقت شما بخیر

      من چند مورد رو بررسی کردم مشکلی وجود نداشت (اگر جلسه خاصی هست اونو بفرمایید چک کنم). ویدئوها با کیفیت بالا هم در یوتیوب و هم در آپارات هم درج شده. اگر خارج از کشور هستید پیشنهاد می‌کنم از یوتیوب ببینید براتون سریع‌تر باز میشه. اگر داخل کشور هستید پیشنهاد اولم سایت هست. البته اگر به هر دلیل باز هم مشکل وجود داشت، داخل آپارات هم ویدئوها هستند. لینک ها را برای شما درج می‌کنم.

      https://www.youtube.com/@alireza.hamdollahi
      https://www.aparat.com/rasam.agency

      موفق باشید.

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

متخصصین آژانس نوآوری رسام
فرم درخواست پروژه و مشاوره
تماس با کارشناسان رسام: 09351436045