摹客
產(chǎn)品
下載
最近室友小胖（苦逼設(shè)計(jì)狗）向我抱怨：明明自己這么努力，時(shí)間卻老是不夠用。雖然經(jīng)常加班，卻也總是因?yàn)楣ぷ魑茨馨磿r(shí)完成而被上司數(shù)落。反觀其他同事，每天一到點(diǎn)就打卡下班，提交任務(wù)卻從來(lái)沒(méi)有延期過(guò)，難道真的是因?yàn)樽约汉懿耍?/p>
事實(shí)上，工作最重要的并不在于你有多努力、用了多少時(shí)間，而在于你的效率有多高。高效率不僅可以讓員工縮短工時(shí)、增加收入，而且可以提高企業(yè)的勞動(dòng)生產(chǎn)率和經(jīng)濟(jì)效益。
那么，如何提高工作效率呢？
古語(yǔ)有云：他山之石，可以攻玉。有時(shí)候工作上并非要完全重新開始，才能彰顯自己的才華。
恰恰相反，那些知道站在巨人的肩上，懂得借別人的力量更進(jìn)一步的人，往往能在較短的時(shí)間里做出更好的成績(jī)。在職場(chǎng)里，比的不是誰(shuí)更努力，而是誰(shuí)更有效率。
以小胖為例，UI設(shè)計(jì)師常常會(huì)為制作原型設(shè)計(jì)而苦惱。而制作原型設(shè)計(jì)初期，選定一個(gè)合適的模板能顯著提升工作效率。以下便是部分原型設(shè)計(jì)案例，小編在此借花獻(xiàn)佛，分享給大家：
該模板采用了卡片式布局，結(jié)合主畫板垂直方向上的空間特性，極大地呈現(xiàn)精美的圖片，從視覺(jué)上給用戶更舒適的體驗(yàn)。此外，本案例也還原了購(gòu)物變現(xiàn)的流程，提升了用戶的模擬體驗(yàn)。
模板選用8px的柵格布局，配合瀑布流式的卡片設(shè)計(jì)，讓原型設(shè)計(jì)更加科學(xué)美觀，也方便原型的復(fù)用。
模板網(wǎng)址：http://www.qtfd.com.cn/example/rp/100054
在微信讀書原型設(shè)計(jì)模板中，這個(gè)案例采用了卡片式設(shè)計(jì)，卡片能提升頁(yè)面的視覺(jué)設(shè)計(jì)感，更符合用戶閱讀的節(jié)奏，綜合地提升閱讀體驗(yàn)。
與此同時(shí)，采用了滾動(dòng)區(qū)、評(píng)分控件、內(nèi)容面板等常用組件，完成了圖片輪播等交互效果，同時(shí)也為頁(yè)面跳轉(zhuǎn)的交互增加了動(dòng)畫，從而讓頁(yè)面之間的交互更加流暢，更接近真實(shí)APP的效果。
模板網(wǎng)址：http://www.qtfd.com.cn/example/rp/100053
通過(guò)摹客RP組件的運(yùn)用對(duì)平安健康A(chǔ)PP進(jìn)行了高度的還原 ，并完整復(fù)現(xiàn)了線上快速問(wèn)診的真實(shí)場(chǎng)景。
在這款原型中，用了面板、內(nèi)容面板、選項(xiàng)卡及視頻等常用組件完成了圖片輪播等交互效果，同時(shí)也為頁(yè)面跳轉(zhuǎn)的交互增加了動(dòng)畫，從而讓頁(yè)面之間的交互更加流暢，以及更接近真實(shí)APP的效果。
模板網(wǎng)址：http://www.qtfd.com.cn/example/rp/100044
Keep是一款運(yùn)動(dòng)健身類APP，同大多數(shù)同類APP一樣，該APP有個(gè)人身體健康管理，大量運(yùn)動(dòng)健身類視頻，同時(shí)能實(shí)時(shí)記錄運(yùn)動(dòng)相關(guān)數(shù)據(jù)。
模板網(wǎng)址：http://www.qtfd.com.cn/example/rp/100003
ROOK是一款專為游客提供全球范圍內(nèi)酒店預(yù)訂服務(wù)的APP，可以讓你不論出門在外或在家附近都能開展探索之旅，并且還可以獲取世界各地獨(dú)特房源、當(dāng)?shù)伢w驗(yàn)及好去處等相關(guān)信息。
模板網(wǎng)址：http://www.qtfd.com.cn/example/rp/100000
小元教育是一套在線教育風(fēng)格的移動(dòng)端APP案例。整套模板風(fēng)格簡(jiǎn)約，頁(yè)面整潔，參考了市面上流行的教育類APP設(shè)計(jì)，盡可能采用了RP的原生組件和圖標(biāo)。
模板網(wǎng)址：http://www.qtfd.com.cn/example/rp/100042
看完介紹后你有沒(méi)有躍躍欲試呢？進(jìn)入頁(yè)面點(diǎn)擊右上角的按鈕開始編輯吧！
下面小編以小紅書模板為例：進(jìn)入模板頁(yè)面，點(diǎn)擊編輯保存（如果沒(méi)登錄賬號(hào)需要先登錄），即可進(jìn)入摹客RP頁(yè)面進(jìn)行設(shè)計(jì)修改和保存，十分方便。
導(dǎo)入模板后就是設(shè)計(jì)師的自由發(fā)揮時(shí)間了，老用戶自然是手到擒來(lái)，不過(guò)新用戶可能一頭霧水。這里小編簡(jiǎn)要介紹下摹客RP的操作頁(yè)面。
RP界面分為上圖紅框四部分：
中間是進(jìn)行原型創(chuàng)作時(shí)的工作區(qū)，是呈現(xiàn)設(shè)計(jì)內(nèi)容的主窗口；
頂部為工具欄，由一些常用的功能和操作按鈕構(gòu)成；
左側(cè)由項(xiàng)目、組件、圖標(biāo)、圖層、設(shè)計(jì)資源五大部分構(gòu)成 ；
右側(cè)則包含編輯及交互兩部分。
摹客RP采用了“頁(yè)面+畫板”，以及主輔畫板的機(jī)制。工作區(qū)可無(wú)限擴(kuò)展，主畫板用于呈現(xiàn)主要內(nèi)容，輔助畫板搭配交互設(shè)置呈現(xiàn)動(dòng)態(tài)內(nèi)容。還可以選擇直接克?。╟trl+D），復(fù)制一個(gè)相同畫板進(jìn)行修改。
在界面中，只需拖一拖即可快速創(chuàng)建交互，使原型設(shè)計(jì)又快又簡(jiǎn)單。你可以在頁(yè)面與頁(yè)面、頁(yè)面與組件、組件與組件間創(chuàng)建交互。還可以通過(guò)狀態(tài)交互實(shí)現(xiàn)懸停、按下、選中等豐富的效果。熟悉之后，還可以做出滾動(dòng)區(qū)，彈窗，輪播圖等進(jìn)階樣式。
完成設(shè)計(jì)后，可以點(diǎn)擊右上的演示，查看整體效果以及交互演示。下面是小編花了3分鐘的“巨作”大藍(lán)書演示：
最后，作為UI設(shè)計(jì)師，深入了解原型的本質(zhì)還是非常必要的。如果是剛進(jìn)入互聯(lián)網(wǎng)行業(yè)的新人產(chǎn)品或者設(shè)計(jì)師，最好在工作之余多多補(bǔ)習(xí)相關(guān)的專業(yè)知識(shí)和基礎(chǔ)理論，才能“好風(fēng)憑借力,送我上青云”。
摹客協(xié)作
摹客RP
摹客DT
摹客超級(jí)版