فرهنگ Document کردن کامل یک پروژه پیش از آغاز فاز پیاده‏سازی معمولا کمتر در ایران جا افتاده است. درباره پروژه‏های کوچک تقریبا در ابتدا هیچ مستندی با استفاده هیچ روش مدل‏سازی (مانند SSADM یا روشهای جدیدتر مانند UML) نوشته نمی‏شود. برنامه‏نویس می‏نشیند پای ابزار Development خود و همین طور عشق و الله بختکی اینترفیس برنامه را طراحی می‏کند. بعد ابزار Database خود را باز می‏کنند و Tableهای مربوط به اینترفیسی که روی آن کار می‏کند را درست می‏کند.

کسانی که خودشان به این شکل پروژه‏ای را تولید کرده‏اند یا این روند را در سازمانها مشاهده کرده‏اند، می‏دانند که این روش چقدر هزینه‏بر، زمان‏بر و غیر بهینه است. برنامه نویس در طول دوران توسعه، بارها مجبور به تغییر جداول و تغییر اینترفیس‏ها می‏شود و آخر سر هم خروجی مطلوب و استواری را دریافت نمی‏کند.

در این نوشته می‏خواهم چند ابزار طراحی Wireframe یا اینترفیس را معرفی کنم. کاربرد Wireframe این است که اینترفیس یک سایت یا یک برنامه بدون این که وارد زرق و برق‏های گرافیکی شویم، قابل طراحی است. در واقع در این برنامه Layout یک اینترفیس که مهمترین بخش آن نیز هست قابل طراحی است.

MockFlow

MockFlow امکانات کاملی را در اختیار شما قرار می‏دهد. همچون چون با Adobe Flex نوشته شده است، امکان استفاده به صورت Offline با Adobe AIR وجود دارد.

Axure

برنامه خوبی است اگر چه خیلی چشم من را نگرفت. این برنامه افزون بر طراحی Wireframe کارهای دیگری مانند طراحی دیاگرام نیز انجام می‏دهد. به همین خاطر نسبتا برنامه بزرگتری است.

Balsamiq Mockups

این برنامه 75 کنترل در اختیار شما قرار می‏دهد و به همین خاطر تقریبا امکان طراحی هر چیزی با آن هست. این برنامه نیز با Flex طراحی شده و نسخه آنلاین آن رایگان است. ولی برای نسخه Desktop باید پول پرداخت کنید. اگر چه، من دنبال یک ابزار رایگان هستم.

Pencil Project

این یکی واقعا محشر است. Pencil در واقع افزونه Photoshop است و از قابلیتها Canvas جدید در HTML 5 استفاده می‏کند. بسیار سریع، راحت و با امکانات بسیار بالایی است و در مرورگر محبوب شما یعنی Firefox کار می‏کند. نیاز به برنامه جداگانه‏ای نیست.

HotGloo

HotGloo هم کاملا تحت وب است و برنامه قدرتمند و زیبایی است ولی متاسفانه رایگان نیست.

Mockingbird

این برنامه تمرکز زیادی روی Collaboration یا کار تیمی دارد. به شما اجازه می‏‎دهد که با هم تیمی‏های خودتان روی طراحی یک اینترفیس کار کنید، برای هم دیدگاهایتان را بنویسید و آن را تغییر دهید. تمام برنامه با JavaScript نوشته شده است و هیچ خبری از Flash نیست.

Cacoo

این ابزار افزون بر Wireframe، امکان ساخت دیاگرام، UML و چارتهای شبکه را هم به شما می‏دهد.

ProtoShare

این برنامه هم امکانات کار گروهی خوبی را در اختیار شما قرار می‏دهد. از جمله امکان نوشتن دیدگاه بر هر یک از عناصر موجود در Wireframe وجود دارد.

iPlotz

این برنامه با سرعت زیاد امکان ساخت Wireframe را در اختیار شما قرار می‏دهد.

OmniGraffle

این برنامه برای Max OS طراحی شده و فکر می‏کنم به درد کمتر کاربری در ایران بخورد.

مزایای طراحی Wireframe

اگر همه اینترفیسها را در ابتدا طراحی کنیم مزایای زیر را به دست خواهیم آورد:
1- همه اینترفیس‏ها با هم هماهنگ خواهند بود.
2- امکان افزایش Usability اینترفیسها با حذف و یا ادغام و تغییر نحوه عملکرد اینترفیس به سادگی وجود دارد.
3- زمان طراحی Wireframe بسیار کمتر از طراحی اینترفیس در نرم‏افزارهای توسعه است. به این ترتیب پیش از پیاده‏سازی می‏توان Wireframeها را به پیمانکار یا رئیس نشان داد و از او تایید گرفت.