Sketch for Mac是一款運行在Mac平臺上的專業矢量繪圖軟件，sketch mac 中文破解版提供了豐富的矢量繪圖和文字工具，你可以使用sketch mac 破解版來設計界面、網站、圖標等，非常的實用。Sketch作爲工具已經足夠優秀，但是玩轉Sketch系列不僅僅是工具教程，我們還想借着Sketch教程講解一些不一樣的東西，例如交互設計思考、最一線的項目實操經驗、提高工作效率可行辦法等等。此次小編就帶大家瞭解下Sketch做原型設計。sketch永久激活版獲取方式在文章尾部。
1、虛擬項目說明
爲方便教程的講解，後續教程中會加入一個虛擬的短視頻項目，同時，我們爲這個項目取了一個好聽的名字：夜視。
2、在瞭解這些之前不要打開Sketch
在使用Sketch進行原型設計之前，我們首先需要了解原型設計的三要素，分別是目標、黑白、真實。
（1）目標
原型需要達到什麼樣的目標？驗證我們的想法？是，但不夠細化。臨摹原型？是，學習專用，但缺乏思考。原型設計的目標一定是具體的，細化的並且目標明確的。例如今天我們所學習的夜視項目首頁設計，目標就是通過首頁探討具體的框架定位，實現首頁瀏覽短視頻、搜索短視頻的需求。
（2）黑白
原型黑白就好，不要埋沒了視覺設計師的創意。而且，黑白的原型可以讓我們排除顏色的干擾項，專注於核心業務功能的實現。
（3）真實
原型一定要真實反映最終產品的樣子，按鈕是按鈕的形狀，而不是五角星；真實的文字內容可能出現換行，而不是設計稿規定的同樣的4、5個字；用戶自發上傳的圖片可能很醜，達不到設計稿的精美圖片要求。
3、夜視首頁原型設計
（1）首頁功能分析
瀏覽短視頻：作爲短視頻應用，瀏覽感興趣的短視頻是最優先需要滿足的需求，視頻展示包含兩大模塊：精選（banner）以及push流。push流視頻的信息又應該包括最起碼的視頻標題、發佈時間、上傳者、以及視頻長度。
搜索短視頻：在海量內容中查找感興趣的視頻內容，標準配置。
APP導航：在原型設計時，導航設計一般在首頁就體現出來，夜視使用的是標準的底部tab導航，分爲四個菜單：首頁、夜裏、關注、我的。
（2）夜視短視頻首頁設計
做好功能分析之後，我們就可以利用Sketch來進行首頁的原型設計了。爲了“節約開發資源”，我們先開發IOS版本，所以，在設計中，我們先採用IOS的設計標準。
第一步：框架搭建
還記得第四期中的Artboard（畫布）嗎？它可以很方便的知道iPhone7的尺寸。操作路徑爲插入Artboard，在檢查器中選擇“Apple Device”-“iPhone7”即可看到原型尺寸爲“375*667”。
由於我們不建議使用單獨的Artboard創建單獨的頁面，所以我們可以先新建一個較大尺寸的Artboard，再在Artboard上面畫一個375*667的矩形，就初步完成我們的框架。
第二步：添加狀態欄和菜單欄
第二步就是添加狀態欄（20px）和菜單欄（49px），在Sketch中添加這兩者將變得非常簡單，完全可以不用去網上搜索iOS設計規範，只需要在Sketch菜單欄中選擇“File”-“New From Template”-“IOS UI Design”即可看到Sketch自帶的IOS組件庫，再從中選擇狀態欄(status bar)、主菜單欄(Tab bars)即可，真正的傻瓜式操作。
另外，我們可以適當增加定位線來進行定位，規範我們的設計。
第三步：設計運營banner
短視頻作爲內容輸出產品，首先需要考慮是爲用戶減少決策範圍；另外，在有限的空間內在首屏爲用戶呈現更多的內容，沒有比輪播運營banner更好的方式了。還記得我們的原型設計三要素嗎？使用真實的圖片、真實的文字吧。
第四步：設計短視頻push流
即首頁除了輪播運營banner外，其他需要提供給用戶的內容。展示的方式見仁見智：可以採用九宮格的方式，在有限的空間內展示更多的內容，常見於大型視頻APP，例如騰訊視頻；可以採用富有衝擊力的列表展示方式，每一行展示一個內容，例如開眼。夜視採用的是類似開眼的展示方式，以推薦精品應用爲主。展示內容包括：視頻預覽圖、視頻標題、視頻作者、視頻長度、發佈日期等。
注意：短視頻應用，展示視頻長度是必須的，它能讓用戶心理對短視頻的長度有一個預期，合理安排碎片化時間。
第五步：添加搜索
不要漏了搜索，搜索對於內容應用來說至關重要，搜索的入口，既要實現對用戶瀏覽視頻不造成困擾，又要放在顯眼的位置，方便用戶調用，在首頁頂部的位置放置搜索按鈕是較好的選擇。
以上就是小編爲大家帶來Sketch進階教程-原型設計入門介紹，還有更多詳細、實用的功能以及相關軟件sketch和其他Mac軟件獲取，大家快來Macdown.com自行探索一番吧。