• شاخه: طراحی    ::    بازدید: ۱۸۲۵
  • ۳

تفاوت استفاده بین وایرفریم و پروتوتایپ و مکاپ چیست؟

این مفاهیم معمولا به جای هم به کار می‌روند ولی یکسان نیستند. در این مطلب در مورد تفاوت آنها و نحوه استفاده‌ی آنها توضیح می‌دهیم.

به نظر متفاوت می‌آیند و برای اهداف متفاوتی منظور می‌شوند. گاهی اوقات یک پروژه تنها به وایرفریمینگ نیاز دارد، در حالیکه بعضا به پروتوتایپ نیاز خواهد داشت.

با وایرفریم شروع کنیم

با توجه به Usability.gov  «وایرفریم بازنمایی بصری صفحه وب است… برای نشان دادن اینکه هر آیتم در کجای صفحه قرار بگیرد.» یک طرح اولیه بصری متشکل از جعبه‌های خاکستری، که نشان دهنده‌ی المان‌های اصلی و مشخص کننده‌ی سلسله مراتب سایت است.

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

  • وایرفریم‌ها المان‌های اولیه یک صفحه وب را قابل تصور می‌سازند.
  • آنها به سرعت توسعه و پالایش می‌شوند.
  • آنها تعاملی نیستند.

به هنگامی که یک وایرفریم تعاملی می‌شود، تبدیل به یک پروتوتایپ می‌گردد.

 

پروتوتایپ چگونه متفاوت است؟

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

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

  • پروتوتایپ ها تعاملی هستند.
  • تجربه کاربری را مدل سازی می‌کنند.
  • آزمایش وسیع کاربری را ممکن می‌سازند.

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

مکاپ (Mockup) هم از وایرفریم و از پروتوتایپ متفاوت است. همانند وایرفریم ایستا ولی بیشتر گرافیکی و بصری هستند و برند را بدون قابیلیت‌های تعاملی پروتوتایپ منتقل می‌کنند.

 

آیا نیازی به مکاپ هست؟

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

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

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

 

تفاوت وایرفریم، پروتوتایپ و مکاپ

  • وایرفریم:

زمینه های اساسی: نمایش اولیه المان‌های طرح

قابل استفاده برای: ارتباطات، سند سازی

 

  • پروتوتایپ:

زمینه های اساس: بررسی فعل و انفعالات

قابل استفاده برای: آزمایش فعل و انفعالی کاربر، طراحی UI

 

  • مکآپ:

زمینه های اساسی: مجسم سازی ایستا، برند سازی

قابل استفاده برای: دریافت سریع پیش پرداخت از سرمایه‌گذار

 

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

وسیله هایی اعم از SnapUp و Omnigraffle و Sketch.app و یا Adobe fireworks میتوانند برای ساختن وایرفریم ها و مکآپ ها و پروتوتایپ ها کارآمد باشند.

منبع: +

امین ضیا

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

همچنین ممکن است دوست داشته باشید ...

۳ واکنش

  1. سید گفت:

    چه معلومه از کتاب کپی کردی گذاشتی اینجا !!
    یکم عامیانه توضیح بدید بابا اینا چیه 😐

  2. فرشته گفت:

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

پاسخ دهید

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