20 款免費的線框圖和原型繪制的應用

當人們全身心的投入到某個活動中時，他會對其他不相關的物體視而不見，我們把這種狀態叫做“流”（Flow）。交互設計的過程，無非是把用戶的使用 流或者工作流表達出來，方便研發團隊理解。 產品設計師對于wireframe應該非常熟悉不過，無論項目大小，人員多少，都離不開交互框架的繪制，也就是我們說的wireframe design。

Wireframe是整合在結構層的全部三種要素的方法：通過安排和選擇界面元素來整合界面設計；通過識別和定義核心導航系統來整合導航設計； 通過放置和排列信息組成 部分的優先級來整合信息設計。通過把這三者放在一起，wireframe可以確定一個建立在基本概念結構上的架構，同時指出了視覺設計應該前進的方向。

Justinmind – 用于創建網站交互框圖

iPhone Mockup

Lumzy

Cacoo – 創建在線實時的協作系統的框圖

fluidIA

Serena Prototype Composer

MockFlow – 在線框圖工具

Website wireframes – Mockingbird

DUB – DENIM

Future of Wireframing – HotGloo

Pencil Project

Mockup Builder – Free online web prototyping tools, software

Tiggr Mobile Apps Builder

Frame Box

Mockabilly – App for creating mockups on iPhone

Online UI Mockups and Wireframes

Wireframes and Prototypes for Web and Mobile Applications

Balsamiq Mockups

Online Diagram Software and Flowchart Software

A GUI Design Software for clickable Wireframes

GUI Design Studio

Source: http://designmodo.com/free-wireframe-mockup/