کاربرد وایر فریم و معرفی آن : وایرفریم» (wireframe) که در اصل طرح اولیه نامیده می شود یک شمای کلی از اجزای تشکیل دهنده سایت می باشد. از جمله چیدمان قرارگیری انواع مختلف تصاویر محتوا و سایر امکانات سایت، که پس از مرحله بررسی نیازهای مشتری توسط طراح سایت برای مشتری رسم می شود. این شمای کلی از سایت که در برگیرنده امکانات سایتو نیازهای مشتری است توسط نرم افزارها ی مخصوص و یا سایت های رسم وایر فریمآنلاین و یا در برگه ای سفید توسط گرافیست سایت طراحی می شود.
با وایرفریم ساختار بصری پایه سایت ترسیم می شود که قرارگیری عناصر مختلف در صفحه وب را نشان می‌دهد. به عبارت دیگر یک طرح کلی از طرح بندی دموی صفحه وب است که با وجود این طرح اولیه مراحل بعدی طراحی سایت ساده تر می گردد.
هدف از رسم وایر فریم، هم پیش رفتن بهتر و آسانتر جلسه مشاوره است و هم بررسی و تمرکز بر اصل نیاز های مشتری. در ادامه مطلب به برخی از مهم ترین مزایای طراحی سایت با وایر فریم می پردازیم.
کاربرد وایر فریم در طراحی سایت
مشخص شدن نیازهای مشتری:
طراحی سایت با وایر فریم قبل از مرحله طراحی و کد نویسی باعث مشخص تر شدن دقیق نیازهای مشتری می شود و باعث می شود که طراح در مرحله طراحی و برنامه نویسان در مرحله ی کد نویسی فارغ از تحلیل نیازهای مشتری به کار خود بپردازند.
اجرا ایده هایی بهتر در زمان کم تر:
طراحی سایت با وایر فریم باعث می شود تا ایده های خود را در کمترین زمان ممکن و بدون مواجه با مشکلات کدنویسی به تصویر درآورید و به راحتی آنها را تغییر دهید. تکنیک طراحی سایت با وایرفریم منجر به تمرکز ذهن طراح و مشتری بر روی قسمت های اصلی قالب سایت همچون هدر، منوی ناوبری، نوار سایدبار، ستونهای کناری صفحه، بخشهای مربوط به محتوا و اخبار، کادر مربوط به جستجو و مواردی از این قبیل شده و از درگیری با جزئیاتی همچون رنگ ها، عکس ها و فونت ها در امان می مانند.
برخی دیگر از مزایای وایر فریم
صرفه جویی در زمان، هزینه و انرژی
افزایش سرعت پیشرفت پروژه
تصویر روشن از اهداف و نیازهای مشتری
مشخص بودن طرح کلی و عدم سردرگمی
تعیین معماری محتوای وب سایت
ایجاد دید بصری از وب سایت پیش از شروع طراحی سایت
مشخص کردن عناصر اصلی قالب و المان های آن
نشان دادن عملکرد و اولویت اجزاء مختلف یک صفحه و ناوبری صفحه
تغییر و تنظیم راحت عناصر و بخش های مختلف
طراحی کاربرپسند توسعه ی محتوا
بهبود عناصر رابط کاربری و عناصر تعاملی و ارزیابی اثر بخشی کلی آنها
مشخص سازی ابزارهای مورد نیاز جهت برنامه نویسی و طراحی سایت
مشخصس ازی تعداد توابع موجود به منظور اعمال در وب سایت
انواع وایر فریم
۱- وایرفریم Low Fidelity
تمرکز بر طراحی و مفاهیم: طراحی ساده و بدون تصاویر و متن واقعی و فقط کادربندی اولیه سایت است که می‌توانید کمتر نگران بخشهای فنی‌تر نمونه‌سازی اولیه باشید و انرژی بیشتری را صرف ایده‌پردازی کنید.
تکرار بی‌درنگ: فرض کنید در حال جمع‌آوری بازخورد مشتری در مورد نمونه اولیه طراحی‌شده خود هستید. در طی این تست، می‌توانید به سرعت بخشی از طراحی را بر اساس نظرات مشتریان در زمان واقعی و تنها در چند دقیقه دوباره انجام دهید.
قابل دسترس برای همه: همه می توانند doodle کنند. با نمونه سازی Low Fidelity، حتی غیر طراحان نیز می توانند در فرآیند طراحی شرکت کنند و از طریق محتوا، منوها و جریان فکر کنند.
۲- وایرفریم Mid Fidelity
۳- وایرفریم High Fidelity
برای کاربران آشناتر: نمونه‌های اولیه با وفاداری بالا برای مشتریان شبیه نرم‌افزار زنده به نظر می‌رسند.
اجزای خاصی را برای آزمایش مشخص کنید: می‌توانید در طول آزمایش کاربر به عمق یک مؤلفه (مانند جریان، تصاویر، تعامل یا پیمایش) فرو بروید. این به شما امکان می دهد تا بازخورد دقیقی در مورد عناصر خاصی از طراحی دریافت کنید که با قلم و کاغذ امکان پذیر نیست.
قابل ارائه بیشتر: مشتریان و اعضای تیم ایده روشنی از ظاهر و عملکرد محصول قبل از عرضه به بازار خواهند داشت. همچنین می‌توانید در مراحل اولیه انتظارات روشنی را با توسعه‌دهندگان در مورد اینکه چقدر زمان برای ساخت نمونه اولیه و داشتن یک محصول نهایی نیاز است، تعیین کنید.
رسم وایر فریم و شمای کلی سایت با توجه به نیازهای مشتری، زمینه کاری مشتری، تخصص و رقبای مشتری
در انتها پس از مشخص شدن طرح اولیه و توافق طرفین بر سر قالب طراحی شده با وایر فریم جزئیات کار با ابزارهایی همچون فتوشاپ و در نهایت کد نویسی تکمیل می گردد. در حقیقت می توان گفت استفاده از تکنیک طراحی سایت منجر به افزایش سرعت پیشرفت پروژه و صرفه جویی در هزینه ها می گردد.
حال که با مزایا وایر فریم و مراحل طراحی سایت با آن آشنا شدید،برای شما پیشنهادهایی بسیار عالی برای رسم شمای سایت با ابزارهای کمکی رسم وایر فریم داریم.
وایرفریم در طراحی وب سایت چیست؟
گرچه شما عزیزان می توانید در مراحل طوفان مغزی خود با استفاده از ابزارهای ساده ای همچون قلم و کاغذ طراحی قالب کلی یک وب سایت را انجام دهید، اما با پیشرفت تکنولوژی امروزه وب سایت ها و نرم افزارهای بسیاری در این زمینه مطرح گردیده اند که با استفاده از آن ها می توانید با دقت بسیار بالا به انجام وایرفریمینگ بپردازید. در ادامه برخی از این ابزارها را معرفی می کنیم.
ابزارهای دسکتاپ وایرفریم:
برخی از ابزارهای وایرفریم به صورت نرم افزار بوده و دارای قابلیت دانلود هستند. این نرم افزارها دارای عناصر گرافیکی و الگو های متعددی جهت ایجاد طرح اولیه می باشند. از نمونه ابزارهای محبوب در این زمینه می توان موارد زیر را نام برد:
ابزار Pencil
ابزار iPlotz
ابزار MockFlow
ابزارهای مبتنی بر وب وایرفریم:
علاوه بر ابزارهای دسکتاپی برخی ابزارهای مبتنی بر وب وجود دارند که می توانید با استفاده از آن ها در سایت ها و به صورت آنلاین به رسم و ایجاد وایرفریم در آنها پرداخته و حتی با افراد تیم خود آنها را به اشتراک بگذارید. لازم به ذکر است بدانید استفاده از امکانات برخی از آنها رایگان بوده و برخی دیگر مستلزم پرداخت هزینه می باشد. نمونه هایی از این ابزارهای مبتنی بر وب در زیر مطرح گردیده اند:
بنابراین اگر می خواهید از طراحان برتر جهان و رقبای خود عقب نمانید و مشتریان خود را از دست ندهید همین حالا دست به کار طراحی سایت برای کارفرمایان خود شوید. تیم طراحی سایت اصفهان وب یار پس از بررسیدقیق نیازهای مشتریان در جلسه مشاوره تخصصی و رایگان، وایر فریم سایت مشتری را رسم نموده و پس از آن طرح psd اختصاصی سایت مشتری را با تمامی امکانات و جزئیات رسم کرده و قبل از کدنویسی به مشتریان عزیز تحویل می دهد. تا آن ها نیز فرصتی برای ویرایش قالب سایت شان و اظهار نظر برای آن داشته باشند. پس از تایید طرح توسط مشتری قالب اصلی سایت طراحی و کد نویسی می شود، برای بیشتر درخشیدن در دنیای وب با تیم طراحی سایت اصفهان وب یار همراه باشید. و چنانچه شما هم تمایل به یادگیری طراحی سایت حرفه ای دارید در کلاس های طراحی سایت وب یار شرکت کنید.
