中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

原型的目的在于清楚的表達產(chǎn)品的設(shè)計理念和功能的執(zhí)行邏輯，所以我認為能夠達到這個目的的原型都是合格的。但如果可以把原型做的更加精致美觀些，又何樂而不為呢。然而需要注意的是，我們畢竟是負責產(chǎn)品的，不是負責界面設(shè)計的，所以哪怕是制作高保真原型，也要快。

在需求討論，功能確定階段，我們會畫線框圖，也就是低保真原型。待需求功能流程基本理清后，為保證時間效率，通常會出中保真原型圖給設(shè)計，畢竟出高保真要占用更多的時間。不過，在有些時候我們是有必要甚至必須出高保真原型，比如進行原型測試。

這是我按照簡書IOS端APP做的原型界面，兩個界面沒超過15分鐘。

原型示例

我不會告訴你我是這樣做的

準備篇

素材積累

工作的時候每隔一段時間我會停下手頭的活，休息幾分鐘（番茄工作法）。一般在這幾分鐘我會站起來走兩步，然后就是看看素材類，圖片類網(wǎng)站。因為逛這類網(wǎng)站不用動腦，所以放松挺不錯。順便看到不錯的圖片就保存下來當素材。

列一些我常去的網(wǎng)站：

花瓣網(wǎng) http://huaban.com/

國內(nèi)知名圖片分享網(wǎng)站UI社 http://www.uishe.cn/

素材類網(wǎng)站，免費下載psd文件easyicon http://www.easyicon.net

可以搜索你想要的各種icondribbble https://dribbble.com/

交互類作品分享平臺，國外大神常出沒于此reeoo http://reeoo.com 國外素材類網(wǎng)站，支持免費下載

修圖小技巧

積累的圖片素材有時候不能直接用，可能背景不透明，可能填充色不對等等。所以掌握簡單的修圖技巧還是需要的。通常用的比較多的就是切圖（psd文件切圖標用），剪切，調(diào)整圖片大小，摳圖，修改填充色。

由于MAC下PS比較卡，所以我用的修圖軟件是Affinity Photo(下簡稱AP)。網(wǎng)上不太容易找到AP的使用教程，這里就介紹下AP的切圖方法。其他的琢磨兩下就知道了。

psd切圖

用AP打開psd文件

創(chuàng)建切片

導出切片

原型設(shè)計規(guī)范

剛開始學畫原型圖時，我總是在字體的大小，顏色等等這些細節(jié)上很苦惱。如果太隨意，雖然省事，但效果實在不堪；如果扣細節(jié)，卻又要花很多時間，得不償失。

后來我發(fā)現(xiàn)，不同的產(chǎn)品原型完全可以用一套設(shè)計標準，因為不管原型如何，UI最終會針對APP出相應的視覺設(shè)計規(guī)范。于是我制定了我的設(shè)計標準，管你什么APP，直接套，即便捷又美觀。

比如我的文字大小顏色等等是這樣設(shè)置的。可以根據(jù)自己的需要制定自己的規(guī)范。

自定義組件

雖然Axure已經(jīng)提供了一些方便使用的基本組件，但為了提高效率，我們需要自定義常用的組件。比如iPhone的navigation欄和tab欄，跟大寶似的天天見。那我就做成了組件，隨時用，隨時拖。

我的一些自定義組件

注意，自定義組件本身也是遵守原型設(shè)計規(guī)范的。另外，看到圖中方案1下面的那幾個組件了嗎？有什么用呢？待會說，先賣個關(guān)子。

Axure使用篇

常用快捷鍵

想要快速，盡然不用快捷鍵？別逗了。分享下烏金老師整理的Axure RP7.0快捷鍵中英文PC和MAC對照版http://vdisk.weibo.com/s/sRCuwKXDvAjWC

輔助線

Axure有全局輔助線和局部輔助線。全局輔助線在所有頁面都有效，局部輔助線只在當前頁面有效。

在開始制作原型圖前，我會先布局好主要的輔助線。比如我做的原型界面是375×668（iphone6屏幕像素的一半）的大小，控件距屏幕邊緣20px寬，為方便布局，我會先設(shè)置幾條全局線。

創(chuàng)建全局輔助線

移動左邊兩條輔助線

移動后

選中所有輔助線，設(shè)置鎖定

這樣基礎(chǔ)的輔助線就設(shè)置好了，再在具體使用中靈活運用局部輔助線，我們就可以愉快的布局玩耍啦。

利用輔助線快速布局

對齊分布和等間距分布想要多個控件的位置擺放合理美觀，我們常常用到對齊分布或等間距分布。

對齊分布有三種方法：

• 一，利用Axure的提示對齊線移動控件的過程中，提示對齊線會自動出現(xiàn)（原諒我截不了圖），按提示操作即可，很傻瓜式。
• 二，利用輔助線關(guān)于輔助線，前面已經(jīng)說到，不羅嗦了。
• 三，利用對齊動作比如我想讓控件2對于控件1進行左對齊，先選中控件1，再選中控件2(注意順序)，然后去點右上角紅圈處的對齊按鈕，選中左對齊即可?？梢杂涀R快捷鍵，那操作就很快啦。

對于2兩個以上的需要等間距分布的控件，我們可以利用等間距操作。比如tabbar，通常有4、5個按鈕。我們在設(shè)置好一個按鈕后，直接復制粘貼，如圖

把最兩邊的按鈕位置放好，選中全部按鈕

頂部對齊

進行水平等間距

完成

取色

這里正是我前面賣的關(guān)子。我們制定好了規(guī)范，每個界面的背景色都是#F7F7F7，現(xiàn)在我要修改一個藍色背景的矩形組件，怎么該顏色呢？輸入色值？當然可以，但慢啊。用取色筆？屏幕里沒有我要的顏色??？瞧我的。

我根據(jù)規(guī)范的顏色，分別自定義了矩形組件。這樣會在Axure的組件欄里顯示出來。

這些組件不是用來拖的，而是方便我取色的

接下來用取色筆就可以方便的取色啦，是不是很機智。

temp頁寫代碼講究復用，講究ctrl+c,ctrl+v。做原型也一樣，要學會“懶”。有時候某個界面的控件在其他地方也會用，對于這樣的控件，我會把它放到temp頁里。

temp頁是做作原型過程中的臨時頁面。它就像個復用池，里面的控件隨時準備被我拿來ctrl+c，啦啦啦。

作者@許洵的昵稱

來源@簡書

本文由 @許洵的昵稱?授權(quán)發(fā)布于人人都是產(chǎn)品經(jīng)理?，未經(jīng)許可，禁止轉(zhuǎn)載。