Axure原型製作規範

標籤：

Axure原型製作規範

一、 名詞定義：
　　1. Sitemap 導航圖
　　2. Widgets 組件
　　3. Master 庫
　　4. Label 控制項名
　　5. Interactions 互動動作
　　6. Annotations注釋
　　7. Location and size 位置和尺寸

二、 Widgets規範
　　1. 本站常用widgets規範：
　　　1) 命名規範：制定命名規範從而方便搜尋和升級。
　　　　a) 全站使用，則命名方式為：Y+位置。
　　　　　　i. 全站頂部導航：統一為Yheader開頭，包括各種寬導航、窄導航；
　　　　　　ii. 全站右側邊欄：統一以Yright開頭，包括廣告位、內容欄目等；
　　　　b) 單個產品使用，則命名方式為 產品名+位置
　　　　　　i. 空間左導航：y+產品名+left，例如yspaceleft
　　　　c) 頁面子零件：命名方式為：Y+ 頁面或產品+零件名。例如：
　　　　　　i. Tab：統一命名為Yspacetab
　　　　　　ii. 評論：統一命名為Ycomenticscomment
　　　2) 本站的widgets統一放在y.rplib檔案中。在全域搜尋中，輸入y即可查看所有yoka widgets。
　　　3) Y.rplib升級的問題：該檔案放在區域網路公用區中。每次更新完後，需要配備word說明文檔。
　　2. 自行製作widgets製作規範：
　　　a) 最小化切分原則：在製作widgets時，遵循最小化原則，保證新的widgets能進行上下左右擴充、變化字型、增加新的資料項目等。
　　　b) 內部互動原則：如果widgets能內部完成互動，在製作時就要加上互動的命名，減少後期的操作。
　　　c) 遵循設計規範原則：如果產品已經有成形的設計規範，那麼自行製作的widgets必須大體遵循設計規範。製作新的widgets所使用的基本元素也要從設計規範產生。
　　3. 必備widgets清單：
　　　a) Yahoo提供的一套widgets；
　　　b) 表徵圖庫；16,32,48三種尺寸的表徵圖約200個；
　　　c) Ajax.rplib 常見的ajax功能；
　　　d) Y.rplib 針對本站的widgets；
　　4. 升級方式：統一從公用區copy。每當有新的更新時，群發到郵件組[email protected]的方式說明，並附上更新檔案和最後更新時間。

三、 Master製作規範
　　1. 公用地區（具體指頁頭、頁尾、導航條、頁面內的公用元素）：要求採用master，以減少修改量；
　　2. 對於位置固定的master，須設定為：Place in Background
　　3. 根據視覺規範，製作本站通用master。

四、 Sitemap製作規範
　　1. 單個頁面的命名規範：頁面命名全部使用英文。格式為：頁面內容+動作。例如：article_add
　　　1) 頂層頁面：
　　　　　a) 前端頁面統一以user為頂層頁，表示這是使用者使用的頁面。
　　　　　b) 使用admin為管理員的管理頁；
　　　　　c) 使用statistics為資料統計功能頁；
　　　2) 子頁面：
　　　　　a) 匯總頁：list
　　　　　b) 瀏覽頁：view
　　　　　c) 增加資料：add
　　　　　d) 修改資料：edit
　　　　　e) 修改分類：recatalog
　　　　　f) 建立資料：create
　　　　　g) 重新命名：rename
　　　3) 擴充：子頁面的命名可以擴充，格式為：頁面內容+動作+名稱。例如：article_add_draft
　　2. add、del、edit 原則上從屬於list頁面。但必須遵守產品設計思路。另外，如果add在頁面內完成（彈層或ajax區塊）可不遵守此原則；例如：是某相簿的頁面：
　　3. 對於複雜業務，要求單獨提供flow。展示頁面的商務邏輯和判斷條件。

五、 互動動作規範
　　1. 控制項命名：資料區塊+空間類型。由於頁面內的組件無法在其他頁面是不可見的，所以頁面內的各個控制項不需要帶頁面名字。例如：shopmap_pan代錶店鋪地圖的圖層。

　　2. 互動動作規範：
　　　　1) 對於文本型內容的連結：在文字上面增加一個image map region，在該層上面加連結。
　　　　2) Axure的互動動作總有如下幾種：
　　　　a) Onclick
　　　　b) Onmouseenter滑鼠的指標移動到對象上
　　　　c) Onmouseout 滑鼠的指標移動出對象外
　　　　d) Onkeyup
　　　　e) Onfocus 滑鼠的指標進入文字輸入狀態（獲得焦點）
　　　　f) Onlostfocus 滑鼠的指標離開文字輸入狀態 （失去焦點）
　　　　g) Onchange
　　　　h) Onpageload
　　　　3) 對於同一個位置的條件判斷，要求在按鈕上如下提示，以方便技術和製作人員閱讀。對於高保真的原型，則應該加上資料判斷，避免這種提示。
　　　：簡單判斷
　　　：進階判斷：

六、 Annotations注釋規範
　　1. 注釋的內容：一個完整的注釋需要包含以下說明：
　　　　1) 功能說明：說明該對象的主要完成的功能。
　　　　2) 互動效果：說明該對象的互動動作以及產生的互動結果；此處應該包含各種判斷的說明。
　　　　3) 優先順序：也可以理解為重要性。標明該控制項在互動中的重要性。
　　　　4) 關聯關係：包含觸發方式（預設顯示 / 被動觸發），以及其他對象/資料的關聯關係。對於同時擁有管理後台、使用者背景地方，需要說明資料關係。
　　　　5) 測試案例：提供測試方法及測試應該使用的資料。
　　　　6) 注意事項：注意事項。
　　2. 可以針對各個特殊控制項、組件自訂其他注釋。

七、 整體製作要求
　　1. 任何一個完整的產品，包括3部分，這3部分在原型需要獨立展示：
　　　　1) 使用者前端頁面：
　　　　　　a) 使用者在不登陸、登陸情況下進行瀏覽的頁面；
　　　　　　b) 使用者自行管理資料/帳戶的頁面。
　　　　2) 管理員的管理頁：主要資料的增刪改查、審核。
　　　　3) 資料統計功能：主要包括流量統計（IP、PV、UV、登陸使用者數、活躍使用者數）。
　　2. 頁面命名遵守上文提到的sitemap規範(add child page->rename)
　　3. RP檔案命名規範：y+產品名+特性+子項目+日期。例如：
　　　　1) 化妝品庫新版首頁：y_cosmentics_newindex_20100322.rp
　　　　2) 空間新版首頁：y_space_newversion_20100210.rp
　　4. Tab使用：
　　　　1) 選項卡不要超過5個，最多不能超過7個。可以考慮使用2級選項卡來減少數量。
　　　　2) 被選中的選項卡和底下的地區要保持同色或接近同色。
　　　　3) 禁止在選項卡裡面還使用捲軸；
　　5. 頁尾的pagenotes地區：預設使用兩個欄位，在任何文檔中均需要保留著3個欄位。
　　　　1) 功能說明。說明本頁面主要的功能，以及與其他頁面的關係。
　　　　2) 測試案例。說明本頁面使用哪些資料進行常規測試和邊界測試。
　　　　3) 注意事項。說明本頁面在設計、製作、開發與測試中需要注意的事項。

　　6. 逼真度（僅針對前端頁面）：
　　　　1) 創新型產品、產品改版：為了體現新產品的商務邏輯，或展示產品的改進功能，本類原型要求高保真原型。具體包含：
　　　　　　a) 所有頁面有完整的連結，能順利跳轉、關閉；
　　　　　　b) 任何互動均有完整的流程和結束；
　　　　　　c) 關鍵功能、創新點要上色，不得使用內建的灰白色、黑色；
　　　　　　d) 按鈕的點擊變化能即時體現：文字框、輸入框、文字、層的變化。
　　　　　　e) 使用條件判斷，並根據條件做不同的提示。
　　　　　　f) 對於各個控制項有完整的說明文檔；
　　　　2) 傳統產品、新增功能：可以使用一般的線框圖，使用黑白灰原型。具體包括：
　　　　　　a) 對於頁面大部無改進，可以直接截取靜態圖；
　　　　　　b) 對於無關或者傳統功能，可以部分忽略跳轉和互動效果；
　　　　　　c) 提供關鍵的條件判斷。
　　　　　　d) 不要求完整的說明文檔；
　　　　3) 具體逼真度，還可以參考產品文檔的使用人員的知識結構、工作經驗、配合默契度等靈活掌握。
　　7. 全部產品原型文檔均需通過snv上傳到共用中。
　　8. 由axure產生頁面原型說明文檔：按照標準模板產生即可。

　　　結語：工欲善其事必先利其器。axure是一個工具，協助我們更好地表達。但是，沒有必要為了做一個完美的axure檔案（rp檔案），而浪費大量的精力。我們追求不是完美的原型，而是好用的產品，清晰的結構，流暢的互動。

 

 

美視佛雷斯羽毛球俱樂部
濟南高新區國際會展中心E區五層
下午3點30到5點30

Axure原型製作規範