[干貨分享] AXURE-整套高保真UI框架和元件組(暗黑風格)


 


 

寫在前面

在我們的開發團隊里,一般在產品通過策划和需求評審后,在還沒開始設計之前,產品經理和美工會一起定一套UI規范。

一方面用於規范整體界面,防止界面開發過程中出現UI不一致性的情況(有時候標准並不能涉及到每個細節,研發會偶爾跑偏)。

另一方面用於后期其他項目的復用,也就是當有了其他項目的UI規范沉淀之后, 風格相似的項目,其實是不需要美工的,產品經理直接按照規范和項目沉淀下來的元件做出高保真,研發只要按照此規范來實現即可,可適當省去美工出圖和原型標注部分的工作量。

團隊的演變流程


 

任何規范(設計,代碼規范等)都是團隊長期沉淀出來的,適合自己的團隊才是最重要的。

本次共享模板的UI規范(暗黑風格)

注:由於篇幅問題,截圖中省略了部分規范內容(比如語義規范,內容顯示規范,動效規范)。后期會整理出一份完整的規范文檔共享出來,敬請期待。


 

界面整體預覽


 

注:本來做了一個界面操作演示,由於生成gif太大,有10M多,所以就不上傳了,下面分別截圖顯示,具體動效可在元件文件里查看。

主要元件包括:輸入框、數值輸入框、下拉框,滑塊(silder)、時間控件、單選、多選、分頁、頁簽、彈框、提示信息等。


 

時間控件


 

頁簽(tab)


 

彈窗


 

下拉框


 

On/Off Switches


 

slider


 

表格


 

提示元件


 

氣泡


 

以上便是本次分享元件的主要部分,原始文件截圖如下:


 

通過axure的元件導入之后就可以用啦


 

~以上便是本次分享的全部內容~

原件下載

為防止失效,所有下載鏈接都在公眾號維護,請關注公眾號后,回復“A034”即可下載本次分享的元件完整文件。

推薦閱讀:

AXURE-036-整套高保真UI框架和元件組(白色風格)

感謝閱讀和關注!


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM