初見(jiàn)
Element UI 是一套采用 Vue 2.0 作為基礎(chǔ)框架實(shí)現(xiàn)的組件庫(kù)，一套為開(kāi)發(fā)者耐齐、設(shè)計(jì)師和產(chǎn)品經(jīng)理準(zhǔn)備的基于 Vue 2.0 的組件庫(kù)浪秘，提供了配套設(shè)計(jì)資源，幫助網(wǎng)站快速成型埠况。
設(shè)計(jì)原則
- 一致性
與現(xiàn)實(shí)生活一致：與現(xiàn)實(shí)生活的流程耸携，邏輯保持一致，并遵循用戶習(xí)慣的語(yǔ)言和概念辕翰；
在界面中一致：所有的元素和結(jié)構(gòu)需保持一致夺衍，例如：設(shè)計(jì)樣式，圖標(biāo)和文本喜命，元素的位置等沟沙。- 反饋
控制反饋：通過(guò)界面樣式和交互動(dòng)效讓用戶可以清晰的感知自己的操作；
頁(yè)面反饋：操作后壁榕，通過(guò)頁(yè)面元素的變化清晰地展現(xiàn)當(dāng)前狀態(tài)矛紫。- 效率
簡(jiǎn)化流程：設(shè)計(jì)簡(jiǎn)潔直觀的操作流程；
清晰明確：語(yǔ)言表達(dá)清晰且表意明確护桦，讓用戶快速理解細(xì)長(zhǎng)做出決定含衔；
幫助用戶識(shí)別：界面簡(jiǎn)單直白，讓用戶快速識(shí)別而非回憶，減少用戶記憶負(fù)擔(dān)贪染。- 可控
用戶決策：根據(jù)場(chǎng)景可給予用戶操作建議或安全提示缓呛，但不能代替用戶進(jìn)行決策；
結(jié)果可控：用戶可以自由的進(jìn)行操作杭隙，包括取消哟绊，回退和終止當(dāng)前操作等。
導(dǎo)航
導(dǎo)航可以解決用戶在訪問(wèn)頁(yè)面時(shí)：在哪里痰憎，去哪里票髓，怎樣去的問(wèn)題。一般導(dǎo)航會(huì)有“側(cè)欄導(dǎo)航”和“頂部導(dǎo)航” 2種類型铣耘。選擇合適的導(dǎo)航可以讓用戶在產(chǎn)品的使用過(guò)程中非常流暢洽沟，相反如果是恰當(dāng)就會(huì)引起用戶操作不適（方向不明確），以下是“側(cè)欄導(dǎo)航”和“頂部導(dǎo)航”的區(qū)別蜗细。
- 側(cè)欄導(dǎo)航
可將導(dǎo)航欄固定在頂部裆操，提高導(dǎo)航可見(jiàn)性，方便頁(yè)面之間切換炉媒；頂部可放置常用工具踪区，如搜索條，幫助按鈕吊骤，通知按鈕等缎岗。適用于中后臺(tái)的管理型，工具型網(wǎng)站白粉。
一級(jí)類目：適用于結(jié)構(gòu)簡(jiǎn)單的網(wǎng)站：只有一級(jí)頁(yè)面時(shí)传泊，不需要使用面包屑。
二級(jí)類目：側(cè)面最多可顯示兩級(jí)導(dǎo)航鸭巴；當(dāng)使用二級(jí)導(dǎo)航時(shí)或渤，我們建議搭配使用面包屑，方便用戶定位自己的位置和快速返回奕扣。
三級(jí)類目：適用于較復(fù)雜的工具類型后臺(tái)薪鹦，垂直欄為一級(jí)導(dǎo)航，中間欄可顯示其對(duì)應(yīng)的二級(jí)導(dǎo)航惯豆，也可放置其他的工具類型選項(xiàng)池磁。
頂部導(dǎo)航
順應(yīng)了從上至下的正常瀏覽順序，方便瀏覽信息楷兽；頂部寬度限制了導(dǎo)航的數(shù)量和文本長(zhǎng)度地熄。適用于導(dǎo)航適當(dāng)，頁(yè)面篇幅預(yù)期的網(wǎng)站芯杀。
