設計交付物,就是設計師交給開發人員最終的文件或者資料。這些文件和資料在各個公司有不一樣的表現形式。這是我我的以爲比較合理的交付物的類型。web
對於不一樣的平臺,提供不一樣的交付物,首先須要知道各自平臺的特色。有針對性的製做和提供交付物,會大量減小設計師的工做。同時也會對流程有一個更加詳細的瞭解。app
針對不一樣的平臺,各個交付物是有差異的。主要的兩個平臺:Web和移動App。框架
界面操做和功能較多 佈局
一個web頁面可能多達20種操做和功能動畫
同一界面展現不一樣內容較多spa
功能多引發的界面展現和切換也就比較多,對話框之類的,頁面的動態更新之類的設計
界面元素多orm
web的頁面有多豐富也就不用說了圖片
頁面尺寸比較大開發
通常web的頁面寬度,最起碼是800像素。高度就更不用說了。
界面跳轉比較單一
跳轉單一表現爲:要麼是進入到另外一個界面,要麼是在本頁面顯示不一樣的內容。
界面操做和功能比較相似
App的界面,基本上是按照功能來區分的,界面和操做基本相同。
同一界面展現內容相似
App的界面內容基本上是內容相關爲主的。
界面元素相似
界面的佈局基本相同。列表或者九宮格。每一項的佈局也基本相同。
界面跳轉單一
通常點擊都是跳轉到另外一個頁面。
交付物的種類,按照不一樣的衡量標準,能夠分紅不一樣的種類。
線框圖
線框圖就是用簡單的線和方框來描繪出框架。
高保真
界面基本上就是和最終的產品界面同樣,能夠看出最終的產品形態。
低保真
介於線框圖和高保真之間的一個交付物。
靜態流程圖
各個界面的切花用線鏈接起來,用於標識兩個界面之間的跳轉狀況。通常全部的交互在一張圖上可以完成。特別大的項目,須要劃分爲各個模塊分別出流程圖。
動態流程圖
用可點擊,可操做的方式,表述界面之間的跳轉。
標註圖
通常在高保真上標住。標註尺寸大小,邊界距離,文字顏色等等。
切圖
對於不一樣的控件和狀態,切的背景圖,圖標之類的。有些可能有動畫效果。
web端因爲有界面跳轉多樣,若是用靜態流程圖去提供交付物,那麼那個靜態圖得有多大。。顯然不是很合適。因此不一樣的平臺對交付物也有必定的影響。通過分析對比,最後的交付物這樣比較合理:
低保真,能夠用線框和高保真組合,既能表達主體框架,又能體現部分產品形態。對於頁面尺寸較大,功能較多的頁面來講,可以提升設計速度。
動態流程圖,避免了靜態流程圖的一張圖上標住全部流程而引發的超大圖片的弊端。同時也可以對web上多樣功能的細粒度的展現和操做。同時還能避免重複拷貝多個只有局部改變的頁面。同時也能反映各類web上鼠標通過的狀態等等。。因此,動態圖絕對是合適web設計用的。動態流程圖能夠用Axure去繪製。
切圖和標註,是每一個交付物必需要提供的。用於造成最終的產品。
高保真,讓開發人員可以直觀的看到最終的產品,同時可以讓開發人員更好的去佈局。因爲app的界面都不是很大, 設計師在出高保真的時候也不會耽誤很長時間。這樣作也能夠爲後來的標住提供一個好的界面。
靜態流程圖,便於利用高保真直接組成流程圖。同時也可以直觀的看出來哪些界面沒有設計的。
切圖和標註,是每一個交付物必需要提供的。用於造成最終的產品。