【軟體工程綜合實踐專題】
——了解原型設計的工具
[Jewish]SHOU 1759223
目錄：
《軟體工程綜合實踐專題》················1
——原型設計的重要性······················1
1.了解移動應用設計工具····················2
2.AxureRP執行個體講解··························3
3.墨刀執行個體講解································4
4.兩個原型設計軟體比較····················5
5.總結············································6
6.感悟············································7
page1原型設計的重要性
一個好的産品，一定離不開原型設計。
①原型設計是什麼？
原型設計是軟體開發的初始階段，根據需求為軟體建立原型的過程，原型通常用于示範，測試，溝通等。原型通常隻是表現了産品的一部分特性，但原型設計的投入在整個的軟體開發過程占比較小，且直接确定了之後的軟體開發方向，投入産出比非常高，是以這個過程非常重要。
②原型設計的類型有哪些？
低保真原型：制作成本低，速度快，修改也友善。适合任務簡單，整個團隊溝通順暢，個人能力較強的情況。
中保真原型：添加了更多細節，界面有一定的細節，而且使用者已經能完整體驗到最終的産品，可以驗證産品的可行性，確定了不會在後面的開發過程中發現重大失誤。缺點是花費時間會多一些。
高保真原型：完全按照最終産品來制作的原型，保真度越高就意味着需要花更多的時間和開發精力，而且一旦有修改也會更加耗費時間。
3.原型設計優點：
可以将設計師的想法和創意形象化顯示出來，讓其他人檢視和回報，進而改進，一定程度上也減少了開發成本。讓使用者實實在在的感受産品，用于測試，提早找到産品的問題。
4.原型設計缺點：耗費時間，做的越細，設計師發揮的空間越小。
Page2了解移動應用設計工具
①Axure RP
a.簡介:Axure RP是一款專業的快速原型設計工具，人們可以通過本軟體快速建立應用軟體或Web網站的流程圖以及原型等，Axure RP有一個特點：可以支援多人協作設計和版本控制管理。
b. Axure RP安裝
下載下傳方式一：
點選擷取安裝包
百度雲盤提取碼：70vx
下載下傳方式二：
官網下載下傳：https://www.axure.com.cn/3510/
啟動AxureRP-SetUp.exe，有注冊Key的使用者可以使用使用者Key激活正式版，在“Welcome”界面上邊框找到“Liscence”，點選注冊，界面如下：
（選擇右上角的Enter License）
以下是激活碼（不過推薦購買正版）：
License：University of Science and Technology of China (CLASSROOM)
Key：DTXRAnPn1P65Rt0xB4eTQ+4bF5IUF0gu0X9XBEUhM4QxY0DRFJxYEmgh4nyh7RtL
c.使用AxureRP建立第一個原型項目，界面熟悉以及結果如下：
站點地圖區域：對頁面進行添加、删除、重命名群組織頁面層次；
界面工具集：拖動向頁面添加元件
子產品區域：在該面闆中可進行子產品的添加、删除、重命名群組織
主菜單工具集：檔案打開、儲存等操作
界面工作環境：可以設計線框圖、流程圖、自定義部件、子產品；
頁面注釋與頁面互動：添加與該頁面有關的注釋
互動設計：設定标簽、樣式，添加注釋
物件注釋：添加、删除動态面闆的狀态
d.部件說明：
e.Axure事件
OnClick：滑鼠點選事件
這個事件用的非常多，使用者許多互動都通過這個完成。
OnMouseOver：當光标在上面時
主要做頁面互動效果，當滑鼠滑過時，它的樣式發生怎麼樣的改變。
OnPanelStateChange：狀态改變時
這個事件針對動态面闆，當動态面闆的狀态改變時觸發。
②墨刀：
a.簡介：墨刀和Axure一樣也是一個快速設計原型的應用，它相較于Axure，也有一些優點：操作十分簡單（小白也會用，也可以快速完成可互動原型）、支援裝置多（相容性好，可以在電腦、手機、微信上直接示範）、界面簡潔、也支援線上共同編輯，支援插件擴充。
b.安裝：
點選該網址擷取下載下傳：https://modao.cc/downloads
使用墨刀建立第一個原型項目，結果如下：
操作界面熟悉：
控件區：提供文本、矩形基礎元件元素，利用基礎元件建立原型，下面的平台元件庫，包括iOS元件庫等已經構造好的元件庫友善使用者直接用。
Page3 Auxure執行個體講解
我們在這裡介紹一下清單頁面的設計與實作：我們在設計原型的時候經常會用到清單表示選項，例如下面的結果圖：
步驟一：在讀書頁面，使用清單展示可以更新的書本内容，在頁面中拖入一個中繼器元件，命名為“讀書清單”
步驟二：輕按兩下“讀書清單”打開中繼器，預設是一個矩形框。點 擊矩形框外的頁面，出現中繼器資料集編輯區域。在中繼器資料集中添加列名，在行中添加内容。
步驟三：接下來我們設計中繼器的項。将原來的矩形框删除，添 加1個Box2作為底色，添加1個Heading1、4個label，分 别命名為：書名、作家、書記類型，并調整其位置、文 字大小、顔色等，最後在底端添加一條水準線分割資料行 （如左圖）。此時，傳回“讀書”頁面，效果如右圖所示。
步驟四：下面将中繼器的項與中繼器資料集綁定。在“讀書”頁面設定觸發 事件，OnPageLoad中添加Case1，選擇Set Text ，設定“标題”的 值(value)為中繼器資料（repeater/dataset）中的“item.title”。用 同樣的方法設定其他字段。
之後點選Preview鍵盤就實作了之前的界面。
Page2墨刀執行個體講解
我們在墨刀執行個體這裡介紹一下輪播的實作，相較于Axure中的輪播闆，墨刀做起來更容易，例如下面的結果：
步驟一：找到元件中輪播闆
步驟二：轉換為母版
步驟三：輕按兩下元件進入模闆設計，右邊放入需要輪播的圖檔即可，可以設定輪播方式和參數，最後運作可以得到我們開始時候效果：
Page5兩個原型設計軟體比較
墨刀和Axure好像是美圖秀秀和photoShop的差別，墨刀操作簡單，入手友善，适合新手上手，而Axure在互動等功能比墨刀更多更細，适合做帶有技術的高保真原型，比如墨刀不能隻做帶有條件的互動效果；墨刀内置更多素材，使用友善，就像美圖秀秀内置很多貼紙及素材等，使用者隻需要拖動就可以實作想要的效果，是以墨刀制作原型時速度更快，操作比Axure更加友好；由于Axure使用基數多，是以Axure通用性會更好一些。
除此之外，墨刀可以說是為了移動端産品原型而生的，免費版自帶部件等功能基本滿足移動端産品原型的設計要求，并且墨刀控件都是基于APP，墨刀也偏線上産品，隻要有賬号密碼，就可以随時随地在不同裝置上設計之前設計的作品。而這正也是墨刀的缺點，墨刀不自由，僅限移動端産品原型，互動效果等也不如Axure靈活，不适用PC端。
Page6總結
以上是基于自己對這兩款軟體學習中的收獲和見解，總的來說，對于原型工具的選擇，可以考慮兩個原則：一是适合産品，及其使用場景；二是适合自己。
Page7感悟
不論移動端UI還是網頁UI制作，使用原型制作是很重要的，可以将設計師的想法和創意形象化顯示出來，讓其他人檢視和回報，進而改進，一定程度上也減少了開發成本。原型設計在軟體開發過程中是非常必要的，應該充分考慮産品的需求和團隊的情況選擇适合的原型設計類型。同時選擇一款優質的原型工具能夠節省大量的時間和成本，可以多嘗試幾款工具後再做選擇。既然原型制作那麼重要，我們也需要擁有一個适合自己的原型設計應用，在這裡我們主要介紹了兩款，墨刀和Axure RP，其中Axure中還介紹了一個執行個體，從上手來說，墨刀更加适合新手，而Axure更加适合追求高保真和技術的人員。
轉載于:https://www.cnblogs.com/Jewish/p/10786032.html