大家都知道產(chǎn)品經(jīng)理和設(shè)計(jì)師，對(duì)于產(chǎn)品的開發(fā)設(shè)計(jì)有著舉足輕重的作用，理想狀態(tài)里：兩個(gè)人相視一笑就心有靈犀地把彼此的任督二脈相互打通，共同攜手完美完成一個(gè)又一個(gè)的項(xiàng)目。

可是現(xiàn)實(shí)情況往往卻不是這樣的，以我們組為例，在項(xiàng)目特別多的情況下，產(chǎn)品經(jīng)理經(jīng)常追著設(shè)計(jì)師滿世界的跑，好話說盡，只為改一個(gè)頁(yè)面布局。

為什么會(huì)造成這種情況？，一般公司都是好幾個(gè)項(xiàng)目同時(shí)進(jìn)行，項(xiàng)目多時(shí)公司里的設(shè)計(jì)師簡(jiǎn)直就成了稀缺資源，產(chǎn)品經(jīng)理滿世界的求著設(shè)計(jì)師，為什么呢？因?yàn)闆]有了設(shè)計(jì)師，下面工作根本無(wú)法開展。

那設(shè)計(jì)師負(fù)責(zé)的交互設(shè)計(jì)和頁(yè)面布局工作，產(chǎn)品經(jīng)理直接自己做就好了嘛～這樣就不用求著設(shè)計(jì)師了。

說起來容易，可是在現(xiàn)實(shí)生活中，產(chǎn)品經(jīng)理雖然能搞定產(chǎn)品的內(nèi)容歸納和功能流程，但缺乏設(shè)計(jì)知識(shí)和能力，所以沒法通過頁(yè)面布局和交互設(shè)計(jì)良好的表達(dá)出來，很難完成設(shè)計(jì)師的工作，所以才會(huì)出現(xiàn)上述產(chǎn)品經(jīng)理滿世界追著設(shè)計(jì)師的一幕。

那有沒有什么辦法可以在設(shè)計(jì)師資源匱乏的情況下，產(chǎn)品經(jīng)理依舊可以自己獨(dú)立完成頁(yè)面布局和交互流程設(shè)計(jì)呢？

有！有！有！

在這里要感謝一下我們的阿里爸爸，開發(fā)出了Ant? Design 這個(gè)神奇的框架，無(wú)私的貢獻(xiàn)出各種頁(yè)面組件以及配套的代碼，產(chǎn)品經(jīng)理因此輕松獲得了不錯(cuò)的頁(yè)面布局和交互設(shè)計(jì)能力。

Ant? Design 里面有大量的頁(yè)面布局參考，還有非常豐富以及種類繁多的優(yōu)秀頁(yè)面范例，而且這一切都可以直接拖拽使用，所見即所得，大量的節(jié)省了制作原型的精力和時(shí)間，加快了產(chǎn)品研發(fā)的效率。

在沒有設(shè)計(jì)師的情況下，產(chǎn)品經(jīng)理可以直接進(jìn)行頁(yè)面布局和交互設(shè)計(jì)，來表達(dá)產(chǎn)品的內(nèi)容歸納和功能流程。然后制作完成后直接交付給開發(fā)工程師，開發(fā)工程師可以直接引用Ant? Design 上面的規(guī)范代碼進(jìn)行產(chǎn)品的開發(fā)。最最重要的是減少了溝通的成本，開發(fā)工程師一目了然的看懂產(chǎn)品經(jīng)理的思路和需求，產(chǎn)品經(jīng)理和開發(fā)工程師就可以用同一種語(yǔ)言對(duì)話，減少了不少的溝通成本。

怎么用Ant? Design快速構(gòu)建產(chǎn)品原型

1、準(zhǔn)備工具

原型圖設(shè)計(jì)工具平臺(tái)：http://www.xiaopiu.com

全套Ant? Design組件庫(kù)：

2、組件演示

這個(gè)組件庫(kù)到底有多么方便我們一起來看一下這個(gè)動(dòng)圖效果演示：

完整的頁(yè)面布局，還自帶豐富動(dòng)效！這樣的組件庫(kù)可以超快速地滿足你產(chǎn)品原型和設(shè)計(jì)需求了。

以前完全沒有想到Ant Design 這個(gè)前端框架，竟然可以神奇地解決了產(chǎn)品經(jīng)理設(shè)計(jì)能力受限這個(gè)問題。是不是有些躍躍欲試，趕快把引用組件下載下來，自己操作試一下吧！

這些組件這么好，我該怎么使用呢？

1、進(jìn)入 xiaopiu 精選廣場(chǎng)的組件庫(kù)/頁(yè)面庫(kù)，搜索「Ant Design 」，在搜索出的組件庫(kù)右下角點(diǎn)擊「引用為我的公用庫(kù)」。（搜索頁(yè)面庫(kù)時(shí)，記得在右側(cè)切換為web端）