ویرگول
ورودثبت نام
رهام رفیعی تهرانی
رهام رفیعی تهرانی
خواندن ۳ دقیقه·۳ سال پیش

راهنمای شروع وایرفریم. چه موقعی؟ چرا؟ چطور؟


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

سوال اول اینه که چرا وایرفریم؟

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

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


چه ویژگی هایی باعث شد در طراحی های پیچیده و بزرگ، استفاده از وایرفریم مرسوم بشه؟

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


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

دلیل سومش اینه که میشه به سرعت تغییرش داد. شما میتونید طی یک جلسه گفتگو، در خلال تغییرات ساده، طرح ها و ایده های مختلفی رو مورد بررسی قرار بدید. چه تکی چه گروهی. (از خاطرات خودم اینه که از سال 1386، خیلی قبل از اینکه بدونم وایرفریم چیه، وایرفریم میکشیدم و با دیگران در مورد طراحی سایت بحث میکردم که چی کجا باشه و چطوری کار کنه)

دلیل چهارمش اینه که همه چی از اول معلومه و به راحتی میشه برخی از مشکلات در ایده های اولیه رو شناسایی کرد. این ایرادها معمولا نه در نوشته ها خودشون رو نشون میدن و نه در مرورهای ذهنی طرح و ایده.

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


چطوری وایرفریم های بهتری بسازیم؟

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


بجز قلم و کاغذ و گجت های بُرد، نرم افزارهای زیادی به صورت دسکتاپ و تحت وب هست که می تونید برای ساخت وایرفریم استفاده کنید.

  1. وب سایت wireframe.cc
  2. نرم افزار یا سایت آنلاین figma (من شخصا با این ابزار بیشتر کار کردم)
  3. نرم افزار adobexd
  4. نرم افزار uxd
  5. نرم افزار mockflow


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


وایرفریمwireframeطراحی وب سایتui uxطراحی اپلیکیشن
برنامه نویسی یک شغل نیست، یک هنره.
شاید از این پست‌ها خوشتان بیاید