Ant Design活學活用，用20+案例教你做Web頁面
時間：2023-07-05 03:00:01 | 來源：網(wǎng)站運營
時間：2023-07-05 03:00:01 來源：網(wǎng)站運營
Ant Design活學活用，用20+案例教你做Web頁面：噔噔噔噔，歡迎刀友們收看本期「素材播報」。
猶記得 Element 組件上線的時候，刀友們一邊夸，一邊發(fā)問 Ant Design 呢？！不是我吹，我們墨刀對于刀友，那必須是一呼百應。
本期就將仔細來聊聊—— 用 Ant Design 做的 20+ 個 Web 頁面，
保證轉手就能用，要多百搭有多百搭。
什么是 Ant Design
在說如何搭建使用之前，先來了解一下 Ant Design
服務于企業(yè)級產(chǎn)品的設計
圖片源自：Ant Design 官網(wǎng)其設計理念是幫助使用者快速產(chǎn)出高質量的產(chǎn)品原型，讓設計者和開發(fā)者有時間專注于更好的用戶體驗，快樂的工作。這一點跟我們素材廣場的想法不謀而合。
圖片源自：Ant Design 官網(wǎng) Ant Design 能做什么
1.注冊登錄頁面 網(wǎng)頁搭建中，注冊登錄頁面必須是第一步。先看看注冊：
簡單明了有沒有？！我們也根據(jù)常用的登錄方式，制作了兩個頁面：手機登錄頁及賬號密碼登錄頁。刀友們，也可以在這個基礎上，模擬第三方登錄的情況。
2.工作臺 登錄注冊之后，當然就是回到工作臺的界面了。這個界面中包含了大量的模塊，還運用了表格、圖表的組件元素，非常的實用。
3.導航欄 任何一個產(chǎn)品都無法忽視的模塊，就是導航欄了。常見的導航欄無非是側邊和頂部。
就像這樣：
展開折疊或者這樣：
展開折疊 4.列表頁 任何一個后臺，都必須要考慮到內(nèi)容的呈現(xiàn)方式。
是以圖片結合卡片形式的呈現(xiàn)：
還是簡單的卡片就行：
也不能忘了，還需要具備檢索性能。
5.表單頁 表單是用戶和 Web 站點或應用程序之間交互的主要內(nèi)容之一。不管是商城后臺，還是財務后臺，或者其他，表單頁面在 Web 頁面中都不可替代。
信息不需要太多的，選擇基礎的表單頁面就行：
針對填寫信息較多的，我們也制作了高級的表單頁面：
為了幫助大家更好的交互，將表單提交的頁面也全部制作了。
表單提交之后的成功、失敗頁面，我們也考慮到啦。
6.表格頁 提起 Web ，怎么能沒有表格呢？
除此之外，我們還制作了報錯頁面，包含：403、404、500，刀友們可以去素材廣場完整體驗。
最后，再附贈一個通用的在線教育管理后臺原型，整個原型包含了在線教育管理后臺的首頁、訂單管理、課程管理、用戶管理（講師、學員）、資訊管理、促銷管理等核心頁面模塊。
刀友們可以運用這些頁面快速搭建美觀的 Web 后臺頁面，也可以參考這些頁面的組件構成，更加熟練靈活地使用 Ant Design 組件庫。
這次的素材上新還滿意嗎？請在留言區(qū)，告訴我們吧～
在線咨詢