怎么做pc端原型？產(chǎn)品經(jīng)理們你們真得會(huì)嗎？

　　關(guān)于原型注意事項(xiàng)的內(nèi)容，來(lái)到了我們最后一篇，怎么做pc端原型？

　　如果你去問(wèn)一個(gè)畫(huà)過(guò)PC端原型的產(chǎn)品經(jīng)理，制作過(guò)程中，有沒(méi)有什么規(guī)范和注意事項(xiàng)，他可能半天答不上來(lái)。他會(huì)想著，“我好想是在認(rèn)真畫(huà)的，但好像也確實(shí)沒(méi)有什么規(guī)范;但要說(shuō)我是隨便畫(huà)的，那我肯定不服氣”!

　　今天這篇文章，我們主要跟大家介紹一下PC端原型的特點(diǎn)和注意事項(xiàng)。

　　第一，PC端原型的特點(diǎn)，沒(méi)有規(guī)范!可能每一個(gè)制作PC端原型的產(chǎn)品經(jīng)理，他們使用的規(guī)范都不盡相同，比如說(shuō)原型整體的寬度、高度，各種導(dǎo)航、按鈕、模塊的大小等等，根本沒(méi)有統(tǒng)一的標(biāo)準(zhǔn);比如下面圖一和圖二的兩個(gè)PC端原型：

　　(圖一)

　　(圖二)

　　這兩個(gè)原型中，產(chǎn)品經(jīng)理對(duì)于原型的細(xì)節(jié)處理方式有所不同(比如矩形的圓角、字體顏色，按鈕選擇等)，但整體的觀感都是挺不錯(cuò)的。

　　第二，PC端原型的要求，標(biāo)準(zhǔn)統(tǒng)一。很多產(chǎn)品經(jīng)理在聽(tīng)說(shuō)PC端原型沒(méi)有規(guī)范之后，就腦洞大開(kāi)，隨意作畫(huà)!看下面圖三的原型：

　　(圖三)

　　明顯是不可以的，首先，同級(jí)別按鈕的控件，比如圖三中的“查找”、“導(dǎo)出”和“新增品牌”按鈕，大小和樣式都需要保持統(tǒng)一，這樣用戶(hù)體驗(yàn)最好;其次，對(duì)于細(xì)節(jié)的處理，不要間距過(guò)大或者過(guò)小(比如搜索區(qū)域的處理，左側(cè)導(dǎo)航的處理等)，提升原型整體的觀感。如果你想你的PC端原型被同事喜歡，那就使用統(tǒng)一的標(biāo)準(zhǔn)或者樣式吧。

　　第三，PC端原型在設(shè)計(jì)完之后，UI會(huì)出效果圖，產(chǎn)品經(jīng)理應(yīng)該有自己的審美，能評(píng)判效果圖的好壞。有的同學(xué)可能會(huì)說(shuō)，這不是UI的事兒么，跟咱們產(chǎn)品有什么關(guān)系?是，設(shè)計(jì)圖是UI的工作，但設(shè)計(jì)圖選稿是產(chǎn)品經(jīng)理要做的?？磮D四中的兩個(gè)按鈕，你覺(jué)得它可以點(diǎn)擊么?

　　(圖四)

　　多數(shù)的產(chǎn)品經(jīng)理都會(huì)認(rèn)為，這兩個(gè)按鈕是可以點(diǎn)擊的，包括用戶(hù)也會(huì)這么認(rèn)為。但真實(shí)的產(chǎn)品設(shè)計(jì)中，這兩個(gè)只是圖標(biāo)，表示贈(zèng)送的內(nèi)容而已，UI設(shè)計(jì)成了這種效果。如果你是這個(gè)產(chǎn)品的負(fù)責(zé)人，你會(huì)選擇這種UI效果么?不可以，因?yàn)橛脩?hù)體驗(yàn)不好。

　　第四，多使用元件庫(kù)，提升原型制作的效率;如果一個(gè)產(chǎn)品經(jīng)理是做PC端原型設(shè)計(jì)的，那他多半經(jīng)常需要做類(lèi)似產(chǎn)品的設(shè)計(jì)，合理利用元件庫(kù)，能夠極大的提升原型制作的效率，而且盡可能的保證元件使用的統(tǒng)一性;比如圖五中看到的各類(lèi)元件，都是PC端原型中常用的：

　　(圖五)

　　當(dāng)然，需要再次強(qiáng)調(diào)一下，最好的元件庫(kù)是自己做的，很多產(chǎn)品經(jīng)理喜歡從網(wǎng)上下載各種元件庫(kù)，不加修改就直接用，很容易出問(wèn)題。建議大家平時(shí)在工作中，養(yǎng)成優(yōu)化元件庫(kù)的習(xí)慣，這樣你們制作的原型會(huì)越來(lái)越好。

　　第五，其他的細(xì)節(jié)處理。比如輸入框的提示文字、頁(yè)碼、彈窗制作、頁(yè)面標(biāo)題、面包屑導(dǎo)航等，該設(shè)置的，都不能缺失。

　　今天就跟大家分享上面的五個(gè)方面，希望大家在以后制作PC端原型過(guò)程中，能夠盡量避免以上提及的錯(cuò)誤出現(xiàn)，盡量遵守規(guī)范去制作。

　　目前傳智播客的產(chǎn)品經(jīng)理學(xué)科正在火熱招生中，并且上海校區(qū)和深圳校區(qū)已經(jīng)全面恢復(fù)線下。如果感興趣的小伙伴可以來(lái)看看，我們有專(zhuān)業(yè)的師資團(tuán)隊(duì)給大家授課，并且輔導(dǎo)大家就業(yè)，大家快來(lái)吧!


猜你喜歡

IOS移動(dòng)端原型規(guī)范

什么樣的原型是好原型?

6小時(shí)學(xué)會(huì)打造高逼格原型，你與UI交互大師只差ProtoPie

產(chǎn)品經(jīng)理培訓(xùn)課程