Wireframe چیست؟

wireframe چیست؟

وایر فریم ها طرح های شماتیک 2 بعدی می باشد که برای برنامه نویس ها به جهت آن که برنامه نویس از پیش با وب سایت ها و برنامه های طراحی شده ارتباط برقرار کند، طراحی می شود. این وایر فریم ها توسط UI و UX کار و یا توسط گرافیک کار طراحی می شود.

وایر فریم ها طرح های پیشنهادی برای پیدا کردن بهترین طرح برای یک وب سایت می باشد که به کارفرما پیشنهاد می شود.

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

وایر فریم ها عموما رنگ ندارند اما یک ابزار سریع و بسیار قوی برای برای پیاده سازی پیشنهاد و طرح اولیه یک وب سایت می‌باشد که می تواند بهترین راه برای مرتب سازی و همچنین پیاده سازی استاندار های UI و UX وب سایت باشد اما در مرحله‌ی ضعیف پیاده سازی می شود.

ویژگی های یک وایر فریم

• دیدگاه دادن به کاربران و مشتران نسبت به وب سایت.
• ویژگی های یک وب سایت را بیان می کند.
• بسیار سریع و آسان شکل میگیرند و میتواند دیگاه بخش باشد
• وایر فریم ها طرح ها نهایی نیست

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

وایر فریم ها طرح های پیشنهادی برای مشتران بالقوه

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

انواع وایر فریم ها

وایر فریم ها با توجه به جزئیاتشان می توان به 3 بخش عمده تقسیم شود

• وایر فریم های با کیفیت پایین
• وایر فریم ها با کیفیت متواسط
• وایر فریم ها با کیفیت بالا
• وایر فریم های با کیفیت پایین

وایر فریم با کیفیت پایین

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

وایر فریم ها با کیفیت متوسط

این نوع از طراحی بیشتر از جزییات بیان می کند با اینک ممکن است در طراحی عکس ها و یا جزییات بسیار ریز بیان نشود اما باز هم در این صورت نسبت به طراحی وایر فریم با کیفیت پایین بسیار بهتر است.

وایر فریم با کیفیت بالا

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

مواردی که در وایر فریم ها شکل میگیرد

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

تفاوت در وایر فریم ها

در پیش‌تر تا چند سال گذشته همیشه طراحی بر روی دسکتاپ ها اهمیت داشته با مرور زمان طراحی به صورت ریسپانسیو شکل گرفت اما با توجه به اینکه بیش از 70 درصد از ورودی های وب سایت شما توسط موبایل ها شکل گرفته است به همین منظور Mobile-first حرف اول را می زند پس، قبل از طراحی وایر فریم و یا در کنار طراحی وایر فریم برای دسکتاپ حتما برای موبایل ها طراحی وایر فریمی باید انجام داد.

برای طراحی وایر فریم از چه ابزارهایی استفاده می شود.

ابزار اصلی برای طراحی وایر فریم ها، کاغذ و مداد می باشد اما ابزار های زیادی برای طراحی وایر فریم دیجتالی وجود دارد. مانند

• نرم افزار adobe xd
• نرم افزار sketchs
• نرم افزار principle
• نرم افزار figma

سخن آخر

وایر فریم ها ابزار های مناسبی برای طراحی و طراحی بیس یک وب سایت می باشد، می تواند بسیار مناسب برای برای استارت طراحی وب سایت باشد.