互聯(lián)網(wǎng)的產(chǎn)品視覺(jué)設(shè)計(jì)師有分為界面視覺(jué)設(shè)計(jì)師和運(yùn)營(yíng)視覺(jué)設(shè)計(jì)師，那么，這兩者有何區(qū)別呢？

隨著時(shí)代進(jìn)步，互聯(lián)網(wǎng)的發(fā)展讓我們的生活越來(lái)越便利。用戶(hù)在追求產(chǎn)品功能便利的同時(shí)，對(duì)界面品質(zhì)的追求也越來(lái)越高。視覺(jué)設(shè)計(jì)從傳統(tǒng)行業(yè)走向互聯(lián)網(wǎng)時(shí)代，互聯(lián)網(wǎng)產(chǎn)品的視覺(jué)設(shè)計(jì)既是對(duì)互聯(lián)網(wǎng)產(chǎn)品的包裝，也是對(duì)互聯(lián)網(wǎng)產(chǎn)品的一種解釋。越來(lái)越多的人對(duì)界面的視覺(jué)設(shè)計(jì)產(chǎn)生濃厚的興趣，想進(jìn)一步了解什么是互聯(lián)網(wǎng)的視覺(jué)設(shè)計(jì)。

一、互聯(lián)網(wǎng)產(chǎn)品視覺(jué)設(shè)計(jì)師有幾類(lèi)

• 第一類(lèi)：界面視覺(jué)設(shè)計(jì)師——產(chǎn)品功能方向的視覺(jué)設(shè)計(jì)師
• 第二類(lèi)：運(yùn)營(yíng)視覺(jué)設(shè)計(jì)師——運(yùn)營(yíng)方向的視覺(jué)設(shè)計(jì)師

第一類(lèi)：界面視覺(jué)設(shè)計(jì)師

產(chǎn)品功能方向的設(shè)計(jì)師，從設(shè)計(jì)的出發(fā)點(diǎn)來(lái)說(shuō)，核心以產(chǎn)品功能和服務(wù)設(shè)計(jì)為主，更關(guān)注產(chǎn)品以怎樣的界面呈現(xiàn)。 負(fù)責(zé)產(chǎn)品或網(wǎng)站的圖形、圖標(biāo)、色彩、視覺(jué)風(fēng)格等，決定營(yíng)造出什么樣的視覺(jué)體驗(yàn)。

從視覺(jué)層面把控產(chǎn)品界面設(shè)計(jì)，在分析產(chǎn)品邏輯和交互邏輯后，負(fù)責(zé)簡(jiǎn)潔而優(yōu)雅的傳達(dá)有效信息，并通過(guò)視覺(jué)設(shè)計(jì)制造出愉悅的用戶(hù)體驗(yàn)，好的UI設(shè)計(jì)師肯定要對(duì)交互有自己的理解，能提出更優(yōu)于交互設(shè)計(jì)稿的布局方案。

其實(shí)互聯(lián)網(wǎng)領(lǐng)域中，UI 和 UX 設(shè)計(jì)師的界限相當(dāng)模糊，在很多創(chuàng)業(yè)公司，這兩個(gè)設(shè)計(jì)角色是合二為一的。

（1）界面視覺(jué)設(shè)計(jì)師的工作職責(zé)和內(nèi)容

1. 為產(chǎn)品進(jìn)行前期的視覺(jué)推導(dǎo)并完成設(shè)計(jì)方案。
2. 負(fù)責(zé)為互聯(lián)網(wǎng)新產(chǎn)品與新功能提供創(chuàng)意策劃并提供用戶(hù)界面的設(shè)計(jì)方案。
3. 負(fù)責(zé)參與前瞻性產(chǎn)品的創(chuàng)意設(shè)計(jì)和動(dòng)態(tài)DEMO的實(shí)現(xiàn)。

（2）界面視覺(jué)設(shè)計(jì)師軟件

第二類(lèi)：運(yùn)營(yíng)視覺(jué)設(shè)計(jì)師

運(yùn)營(yíng)方向設(shè)計(jì)師設(shè)計(jì)的出發(fā)點(diǎn)以產(chǎn)品活動(dòng)設(shè)計(jì)為主，設(shè)計(jì)活動(dòng)專(zhuān)題界面，如天貓雙十一、京東618等。這類(lèi)營(yíng)銷(xiāo)類(lèi)型的設(shè)計(jì)是為了吸引用戶(hù)參加對(duì)應(yīng)的活動(dòng)，或加深用戶(hù)對(duì)互聯(lián)網(wǎng)產(chǎn)品的印象，產(chǎn)生參與行為。

運(yùn)營(yíng)視覺(jué)設(shè)計(jì)師不同于UI和交互設(shè)計(jì)師，運(yùn)營(yíng)視覺(jué)設(shè)計(jì)師的工作要求他們更加注重視覺(jué)豐富性的表現(xiàn)，更好的表達(dá)交互邏輯，優(yōu)秀的體驗(yàn)需要視覺(jué)與交互兼顧。

（1）運(yùn)營(yíng)方向視覺(jué)設(shè)計(jì)師的工作職責(zé)和內(nèi)容

1. 基于對(duì)運(yùn)營(yíng)設(shè)計(jì)需求的良好理解能力完成需要的視覺(jué)設(shè)計(jì)提案。
2. 團(tuán)隊(duì)協(xié)作設(shè)定整體活動(dòng)界面視覺(jué)風(fēng)格與創(chuàng)意規(guī)劃。
3. 配合團(tuán)隊(duì)高效地開(kāi)展系統(tǒng)化的詳細(xì)視覺(jué)設(shè)計(jì)。
4. 制定UI設(shè)計(jì)規(guī)范和建立組件庫(kù)。

（2）運(yùn)營(yíng)視覺(jué)設(shè)計(jì)師軟件

二、界面視覺(jué)設(shè)計(jì)與運(yùn)營(yíng)視覺(jué)設(shè)計(jì)最大的區(qū)別

界面視覺(jué)設(shè)計(jì)師最關(guān)心的是產(chǎn)品是否富有舒適的界面、用戶(hù)體驗(yàn)和實(shí)用能力。

運(yùn)營(yíng)視覺(jué)設(shè)計(jì)師最關(guān)心的是視度覺(jué)沖擊力和美觀(guān)度。

1. 色彩

界面設(shè)計(jì)：會(huì)用醒目的顏色來(lái)更好的吸引人的注意力。第一級(jí)別的操作常用顏色作為行為召喚，比如：按鈕。

圖片來(lái)源 Google Material Design

鮮艷的強(qiáng)調(diào)色用于你的主要操作按鈕以及組件，如開(kāi)關(guān)或滑片。左對(duì)齊的部分圖標(biāo)或章節(jié)標(biāo)題也可以使用強(qiáng)調(diào)色。

運(yùn)營(yíng)設(shè)計(jì)：顏色作為情感表達(dá)重要途徑，會(huì)最大化的利用色彩、圖片和文字信息來(lái)提高轉(zhuǎn)化率。顏色能對(duì)用戶(hù)產(chǎn)生情感影響，將用戶(hù)帶到下一步行動(dòng)中。

圖片來(lái)源 Material.io

• 綠色：健康、重生、干凈 ；
• 紅色：熱情、愛(ài)戀、憤怒、危險(xiǎn)；
• 黃色：正能量、快樂(lè)、希望、美食。

2. 層級(jí)

界面設(shè)計(jì)：背景層、內(nèi)容層、操作層、狀態(tài)層。使用清晰視覺(jué)層級(jí)，通過(guò)視覺(jué)差異將信息分類(lèi)，讓界面設(shè)計(jì)，更加透氣簡(jiǎn)潔。

圖中信息層次很分明 | 圖片來(lái)源 學(xué)UI網(wǎng)

運(yùn)營(yíng)設(shè)計(jì)：運(yùn)用良好的視覺(jué)層級(jí)呈現(xiàn)給用戶(hù)，提高識(shí)別效率、激發(fā)用戶(hù)興趣、延遲用戶(hù)在頁(yè)面停留時(shí)間、減少用戶(hù)流失。

3. 字體

界面設(shè)計(jì)：字體、字號(hào)的運(yùn)用不同，可以給頁(yè)面帶來(lái)不同的氣質(zhì)和頁(yè)面關(guān)系。

“主體（Body）”樣式的例子 | 圖片來(lái)源 Google Material Design

運(yùn)營(yíng)設(shè)計(jì)：字體很重要，好的字體設(shè)計(jì)能給頁(yè)面加分。不同的字體給用戶(hù)帶來(lái)不同的用戶(hù)情感，并且增強(qiáng)排版的節(jié)奏感、突出主題，比如：活動(dòng)標(biāo)題。

充分利用春節(jié)的元素，進(jìn)行字體設(shè)計(jì)。節(jié)日的氣氛也到位了

4. 圖標(biāo)

界面設(shè)計(jì)：多應(yīng)用于標(biāo)簽、標(biāo)題、按鈕、導(dǎo)航、信息提示等。圖標(biāo)精致、細(xì)致會(huì)使整個(gè)設(shè)計(jì)感觀(guān)提升，讓設(shè)計(jì)的檔次得到提高。

圖片來(lái)源 Google Material Design

運(yùn)營(yíng)設(shè)計(jì)：富有統(tǒng)領(lǐng)和引導(dǎo)作用，讓畫(huà)面看起來(lái)更活潑、有活力。

圖標(biāo)精確的表述，讓畫(huà)面看上去更加豐富了。

5. 設(shè)計(jì)風(fēng)格

• 界面設(shè)計(jì)：通過(guò)研究分析、設(shè)計(jì)草案、設(shè)計(jì)辯證、設(shè)計(jì)提案后，得出一套完整的UI界面，使用戶(hù)的實(shí)際需求成為產(chǎn)品設(shè)計(jì)的導(dǎo)向，使產(chǎn)品更符合用戶(hù)的習(xí)慣、經(jīng)驗(yàn)和期待。
• 運(yùn)營(yíng)設(shè)計(jì)：根據(jù)目標(biāo)用戶(hù)分析、素材收集整理后，在設(shè)計(jì)前初步的設(shè)定設(shè)計(jì)理念。設(shè)計(jì)理念是設(shè)計(jì)師在構(gòu)思過(guò)程中所確立的主導(dǎo)思想，它賦予設(shè)計(jì)內(nèi)涵和風(fēng)格特點(diǎn)。

參考文獻(xiàn)：

• 《視覺(jué)鏈》，互聯(lián)網(wǎng)產(chǎn)品的視覺(jué)設(shè)計(jì)理念與規(guī)范/吳佳敏著，北京機(jī)械工業(yè)出版社
• 《視覺(jué)設(shè)計(jì)師進(jìn)階所需的17條思考維度》@iYoko0509（愛(ài)奇藝無(wú)線(xiàn)UED資深視覺(jué)設(shè)計(jì)師）

作者：林小小，公眾號(hào)：點(diǎn)融設(shè)計(jì)中心DDC（ID：DR_DDC）

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

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