مقالات و ترجمه‌ها - مدیریت محصول
وقتی از طراحی محصول حرف می‌زنیم از چه می‌گوییم؟
وقتی از طراحی محصول حرف می‌زنیم از چه می‌گوییم؟
وقتی از طراحی محصول حرف می‌زنیم از چه می‌گوییم؟
💡 خلاصه: خیلی‌ها فکر می‌کنند طراحی تجربه کاربری (UX) و رابط کاربری (UI) فقط یعنی نقاشی دکمه‌ها و رنگ‌های قشنگ در فیگما! اما اگر زیباترین اپلیکیشن دنیا نتواند کار کاربر را سریع راه بیندازد، عملاً شکست خورده است. در این مقاله به زبان ساده و دور از کلمات قلمبه‌سلمبه، تفاوت واقعی UI و UX را با مثال‌های ملموس (مثل اسنپ)، ۷ ستون اصلی دیزاین، چرخه طراحی دان نورمن و فرق طرح اولیه (Low-Fi) با طرح نهایی (High-Fi) مرور می‌کنیم.
خیلی از افراد وقتی اسم طراحی محصول یا UI و UX را می‌شنوند، فکر می‌کنند کل ماجرا یعنی باز کردن فیگما و کشیدن چند تا دکمه و کارت خوش‌رنگ! اما واقعیت این است که طراحی رابط کاربری فقط بخش بیرونی ماجراست. اگر قشنگ‌ترین اپلیکیشن دنیا را هم بسازید ولی کاربر نتواند به راحتی کاری که می‌خواهد را انجام دهد، آن اپلیکیشن شکست خورده است.
۱. تجربه کاربری (UX) در برابر رابط کاربری (UI)
تجربه کاربری (UX): یعنی حس و خاطره کلی کاربر بعد از استفاده از سرویس یا اپ شما. آیا کارش راحت راه افتاد؟ اذیت شد؟ گیج شد یا حس خوبی گرفت؟ این حس ممکن است برای هر کسی فرق کند.
رابط کاربری (UI): یعنی ظاهر ماجرا؛ همان دکمه‌ها، فونت، رنگ و فرم‌هایی که روی صفحه می‌بینید و لمس می‌کنید. رابط کاربری مثل منشی یک مطب است که شما را به دکتر وصل می‌کند؛ ولی تجربه شما حاصل کل ویزیت، برخورد دکتر و فضای مطب است.
۲. هفت بخش مهم در طراحی تجربه کاربری
وقتی می‌گوییم کار ما فقط نقاشی کشیدن نیست، منظورمان این است که پشت صحنه باید حواسمان به این ۷ مورد باشد:
۳. چرخه طراحی دان نورمن؛ چرا طراحی هیچ‌وقت تمام نمی‌شود؟
آقای دونالد نورمن (از مدیران و مشاوران سابق اپل) برای اولین بار این موضوع را جا انداخت که طراحی یک کار یک‌باره نیست، بلکه یک دایره و چرخه همیشگی است. این چرخه، قلب تپنده طراحی محصول است:
هیچ محصول موفقی (مثل دیجی‌کالا یا اسنپ) پروژه‌اش تمام نمی‌شود؛ چون سلیقه و نیاز کاربران در طول زمان عوض می‌شود و طراحان مدام با تست و بازخورد، مسیر را اصلاح می‌کنند.
۴. تفاوت طرح اولیه (Low-Fi) و طرح نهایی (High-Fi)
برای اینکه وقت و سرمایه تیم الکی هدر نرود، از همان اول شروع به رنگ‌آمیزی و اضافه کردن جزئیات سنگین نمی‌کنیم. ابتدا اسکلت را مشخص کرده و بعد از توافق، سراغ رنگ و لعاب می‌رویم:
تبدیل وایرفریم اولیه (Low-Fi) به رابط کاربری نهایی (High-Fi)
| مرحله | کار ما چیه؟ | چرا این کار رو می‌کنیم؟ |
|---|---|---|
| طرح اولیه (Low-Fi / وایرفریم) | اسکلت سیاه و سفید و جای دکمه‌ها را روی کاغذ یا فیگما می‌کشیم. | خیلی سریع و ارزان است. راحت می‌توانیم با کارفرما یا تیم سر چیدمان توافق کنیم. |
| طرح نهایی (High-Fi / پروتوتایپ) | رنگ، عکس واقعی، فونت اصلی و انیمیشن‌ها را اضافه می‌کنیم. | طرح آماده تست نهایی با کاربر و بعد از آن تحویل به برنامه‌نویس می‌شود. |
منبع اصلی
این نوشته بر پایه و بازنویسی آزاد از مطلب مرجع منتشر شده در Nielsen Norman Group & Figma Design Library است. متن فارسی، ساختار بخش‌ها و مثال‌ها متناسب با بافت اجرایی و نیاز متخصصان بازتولید شده‌اند.
مشاهدهٔ مطلب اصلی
نویسنده و مترجم: امین محرمی
مدیر محصول ارشد و معمار نرم‌افزار. تحلیل و بازنویسی تخصصی مطالب حوزهٔ مدیریت محصول، طراحی سیستم و پلتفرم‌های مقیاس‌پذیر سازمانی.
دربارهٔ من