中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

編輯導(dǎo)語(yǔ)：向?qū)I(yè)的人學(xué)習(xí)，不但可以節(jié)約我們的時(shí)間，而且可以學(xué)到具有專業(yè)水準(zhǔn)的知識(shí)。本文作者從實(shí)際工作出發(fā)，結(jié)合自身工作經(jīng)驗(yàn)，對(duì)UI、UE需要掌握的專業(yè)知識(shí)進(jìn)行了總結(jié)，希望對(duì)你有用。

因?yàn)楸酒恼率俏铱偨Y(jié)梳理具有代表性和價(jià)值的6條專業(yè)知識(shí)點(diǎn)，耐心看完后一定會(huì)有所收獲。

這6條內(nèi)容知識(shí)點(diǎn)分別為：

1. 頂部導(dǎo)航和左側(cè)導(dǎo)航的用法
2. 返回、取消和關(guān)閉的用法
3. 如何判定功能強(qiáng)弱
4. 網(wǎng)頁(yè)打開規(guī)則
5. UI轉(zhuǎn)交互
6. 作品集

01 頂部導(dǎo)航和左側(cè)導(dǎo)航的用法

頂部導(dǎo)航：顧名思義導(dǎo)航在頂部，這也是目前網(wǎng)站最常見的主導(dǎo)航模式。頂部導(dǎo)航一般會(huì)含有個(gè)人中心和一些功能入口。

頂部導(dǎo)航常作為一級(jí)導(dǎo)航。

如下圖貓眼PC網(wǎng)站，頂部導(dǎo)航包含首頁(yè)、電影、影院、演出、榜單、熱點(diǎn)和商城等導(dǎo)航功能模塊。

如果導(dǎo)航里面存在二級(jí)導(dǎo)航則可以聚合在下拉菜單里面，鼠標(biāo)hover出現(xiàn)下拉菜單，點(diǎn)擊下拉菜單里面的選項(xiàng)，進(jìn)入對(duì)應(yīng)的功能界面。如下圖所示的ant design導(dǎo)航組件，鼠標(biāo)hover出現(xiàn)二級(jí)導(dǎo)航，導(dǎo)航里面還進(jìn)行了分組。

側(cè)邊欄導(dǎo)航：多用于二級(jí)導(dǎo)航（相對(duì)于頂部導(dǎo)航而言）。側(cè)邊欄導(dǎo)航里面的功能一般會(huì)進(jìn)行分組，默認(rèn)展示出來(lái)，方便用戶可以全局知道所有的導(dǎo)航功能。

當(dāng)然只有極少的業(yè)務(wù)需求為了節(jié)省內(nèi)容區(qū)域空間默認(rèn)收起，有的側(cè)邊欄會(huì)提供點(diǎn)擊收起左側(cè)欄功能。

如下圖微信公眾號(hào)后臺(tái)，該網(wǎng)站只有側(cè)邊欄導(dǎo)航，沒(méi)有頂部導(dǎo)航。

頂部導(dǎo)航和左側(cè)導(dǎo)航的用法總結(jié)：

1. 頂部導(dǎo)航一般作為一級(jí)導(dǎo)航，左側(cè)欄導(dǎo)航一般作為二級(jí)導(dǎo)航；
2. 當(dāng)網(wǎng)站只有一層導(dǎo)航建議使用頂部導(dǎo)航；
3. 當(dāng)網(wǎng)站導(dǎo)航存在父子層級(jí)，需要默認(rèn)展開子層級(jí)的話，則用左側(cè)欄導(dǎo)航；
4. 當(dāng)網(wǎng)站既有一級(jí)導(dǎo)航，又有二級(jí)導(dǎo)航則兩個(gè)導(dǎo)航一起使用。

02 返回、取消和關(guān)閉的用法

我們?cè)谑褂肁pp的過(guò)程中，點(diǎn)擊進(jìn)入下一個(gè)界面的時(shí)候，有時(shí)候?qū)Ш綑谏鲜欠祷兀袝r(shí)候是取消，有時(shí)候是關(guān)閉。

那么什么時(shí)候使用返回、取消或者關(guān)閉呢？他們有沒(méi)有規(guī)則呢？

如下圖微信朋友圈，點(diǎn)擊朋友圈，進(jìn)入下一頁(yè)，新頁(yè)面從左往右出現(xiàn)，這時(shí)候?qū)Ш綑谏鲜欠祷亍?/p>

如下圖，發(fā)朋友圈，點(diǎn)擊從手機(jī)相冊(cè)選擇，這時(shí)候新頁(yè)面從屏幕底部出現(xiàn)，導(dǎo)航欄上為取消。

如下圖，用戶點(diǎn)擊鏈接，通過(guò)微信內(nèi)置的瀏覽器打開，這時(shí)候?qū)Ш綑谏献優(yōu)榱岁P(guān)閉操作。

返回，取消和關(guān)閉三個(gè)的用法總結(jié)：

1. 下一頁(yè)從右到左轉(zhuǎn)場(chǎng)用返回；
2. 新頁(yè)面從底部出現(xiàn)覆蓋當(dāng)前界面，用取消或者關(guān)閉。當(dāng)需要填寫表單內(nèi)容時(shí)，用取消。當(dāng)非表單內(nèi)容填寫用關(guān)閉；
3. 進(jìn)入微信瀏覽器用關(guān)閉，這個(gè)比較特殊。因?yàn)橐裱脚_(tái)規(guī)則（如微信瀏覽器或小程序等）。

03 如何判定功能強(qiáng)弱

在設(shè)計(jì)界面的過(guò)程中，會(huì)遇到哪些功能或元素該強(qiáng)化，哪些功能或元素該弱化，如何去衡量和判定呢？

設(shè)計(jì)功能強(qiáng)弱依據(jù)有以下2點(diǎn)：

1. 功能價(jià)值大，如果這個(gè)功能對(duì)產(chǎn)品來(lái)說(shuō)具有很強(qiáng)的變現(xiàn)能力或者戰(zhàn)略意義，那么就算這個(gè)功能使用人數(shù)不多，數(shù)據(jù)不大，那么也要將它重點(diǎn)對(duì)待和設(shè)計(jì)。
2. 用戶使用使用是否高頻。當(dāng)用戶使用是高頻時(shí)，需要強(qiáng)化該功能或元素，增加用戶體驗(yàn)，為產(chǎn)品留存更多的用戶。

04 網(wǎng)頁(yè)打開規(guī)則

設(shè)計(jì)師在設(shè)計(jì)PC端網(wǎng)頁(yè)的時(shí)候，經(jīng)常會(huì)遇到一個(gè)困擾，點(diǎn)擊一個(gè)功能或者操作，下一個(gè)頁(yè)面究竟是新窗口打開還是當(dāng)前頁(yè)面打開。其實(shí)這個(gè)有一個(gè)原則：

看新頁(yè)面是否有明顯的返回上一層的入口，有的話，當(dāng)前頁(yè)面打開，沒(méi)有的話，新窗口打開。

05 UI轉(zhuǎn)交互

目前很多UI都想轉(zhuǎn)交互設(shè)計(jì)，但是在小公司沒(méi)有交互設(shè)計(jì)師，UI設(shè)計(jì)師不知道交互設(shè)計(jì)師需要哪些技能和工作輸出物，更加不知道如何轉(zhuǎn)行。

對(duì)于UI設(shè)計(jì)師來(lái)說(shuō)，可以在現(xiàn)有工作中，嘗試先畫交互原型，多思考交互流程，盡量別過(guò)度關(guān)注單個(gè)界面元素，養(yǎng)成原型流程思維。

多關(guān)注設(shè)計(jì)規(guī)范，這里的設(shè)計(jì)規(guī)范不僅包含視覺(jué)也包含交互。

UI設(shè)計(jì)師嘗試梳理有價(jià)值的項(xiàng)目，然后嘗試去思考復(fù)盤。推導(dǎo)出整個(gè)項(xiàng)目，例如接到需求，如何做需求分析，如何確定產(chǎn)品目標(biāo)，設(shè)計(jì)目標(biāo)，如果通過(guò)數(shù)據(jù)去優(yōu)化現(xiàn)有方法，如何通過(guò)其他設(shè)計(jì)策略提升產(chǎn)品設(shè)計(jì)的得到方案如何走查等等

關(guān)于什么是產(chǎn)品目標(biāo)，設(shè)計(jì)目標(biāo)，數(shù)據(jù)分析和設(shè)計(jì)，設(shè)計(jì)方法論有哪些，這些都可以在我的歷史文章找到。

轉(zhuǎn)行的具體做法如下：

1. 梳理一套符合你們項(xiàng)目的設(shè)計(jì)規(guī)范，里面包含交互和ui組件，可以參考ant和element。在做的過(guò)程中可以看看我的web端設(shè)計(jì)規(guī)范文章做為參考：設(shè)計(jì)規(guī)范 | Web端設(shè)計(jì)組件篇－文本與選擇器
2. 梳理幾套從接到產(chǎn)品需求，如何做設(shè)計(jì)推到最后設(shè)計(jì)方案的的方法。這個(gè)可以放在以后的項(xiàng)目中。不知道如何做設(shè)計(jì)推導(dǎo)可以看篇文章：體系化設(shè)計(jì)流程與思路
3. 多和產(chǎn)品和需求方對(duì)接，并讓pm將畫原型的活交給你。根據(jù)UI規(guī)范組件直接搭建，提高人效。
4. 內(nèi)部多主動(dòng)推動(dòng)一些事情，例如可用性測(cè)試，設(shè)計(jì)體驗(yàn)優(yōu)化等。

06 作品集

作品集主要體現(xiàn)4點(diǎn)：

（1）項(xiàng)目?jī)r(jià)值。多思考項(xiàng)目的價(jià)值，做了哪些好點(diǎn)的項(xiàng)目，將這些項(xiàng)目拿出來(lái)，然后嘗試去思考復(fù)盤。

（2）設(shè)計(jì)方案推導(dǎo)能力。推導(dǎo)出整個(gè)項(xiàng)目，例如接到需求，如何做需求分析，如何確定產(chǎn)品目標(biāo)，設(shè)計(jì)目標(biāo)，如果通過(guò)數(shù)據(jù)去優(yōu)化現(xiàn)有方法，如何通過(guò)其他設(shè)計(jì)策略提升產(chǎn)品設(shè)計(jì)的得到方案如何走查等等

如果是UI作品集的話，努力將視覺(jué)圖做的好看點(diǎn)。然后做項(xiàng)目的時(shí)候，建立一套自己的設(shè)計(jì)推導(dǎo)法。例如如何定義產(chǎn)品風(fēng)格，如何確定主色、輔色。圖標(biāo)如何制作（圖標(biāo)設(shè)計(jì)方法）、流程設(shè)計(jì)的思考等等。對(duì)項(xiàng)目多思考，闡述下自己的理解等。

（3）團(tuán)隊(duì)影響力，如何通過(guò)個(gè)人的一些推進(jìn)，對(duì)團(tuán)隊(duì)產(chǎn)生影響，這些影響和促進(jìn)團(tuán)隊(duì)發(fā)展，對(duì)團(tuán)隊(duì)成正反饋。

（4）項(xiàng)目驅(qū)動(dòng)能力，如何驅(qū)動(dòng)產(chǎn)品經(jīng)理、開發(fā)和業(yè)務(wù)角色，做設(shè)計(jì)推動(dòng)優(yōu)化，把控設(shè)計(jì)進(jìn)度和流程。

以上6條內(nèi)容是我覺(jué)得UI或UE都可能需要的，具有一定的價(jià)值，所以我分享出來(lái)，希望對(duì)大家有所幫助。

如果你有其他意見和建議，歡迎在評(píng)論區(qū)留言一起交流。

#專欄作家#

UX，人人都是產(chǎn)品經(jīng)理專欄作家。前美團(tuán)點(diǎn)評(píng)高級(jí)交互設(shè)計(jì)師。微信公眾號(hào)：Echo的設(shè)計(jì)筆記，歡迎關(guān)注

本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可，禁止轉(zhuǎn)載。

題圖來(lái)自 Unsplash，基于 CC0 協(xié)議