SketchFlow的原型設計

內容介紹

- SketchFlow的原型設計

- SketchFlow實現

 

預備知識

- 安裝Visual Studio 2010

- 安裝Expression Blend4

- 安裝Silverlight tools for Visual Studio 2010

 

SketchFlow能做什麼

- 設計師和客戶的橋樑

- 快速的UI設計

- 吸引客戶的原型

 

SketchFlow做的原型是能夠交互的,你一點它可以走,你一動它可以做業務邏輯。這樣的原型,用戶看起來非常直觀。Feedback工具可以把所有觀點記錄下來,並導出成文件。

 

Demo

- 建立一個Shopping的原型

 

image

image

image

完成場景頁面設計

image

場景之間的切換只需要雙擊藍色矩形

image

指定鏈接轉向頁面

image

創建新組件

image

image

image

運行效果

image

imageimage

當點擊結賬導航到check out頁面

image

爲確認購買的Grid添加兩個狀態

image

當點擊買下它時,轉到show狀態

image

當點擊再想想時,轉到hide狀態

image

運行效果

image

image

用戶反饋

image

導出反饋

image

image

開發者打開反饋

image

image

image

開發者、設計者和用戶可以通過這種方式來交互。

可以導出爲Word

image

image

導出的Word

image

image

image

 

總結

- SketchFlow的原型設計

- SketchFlow實現

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章