全栈工程师?
嗯.....目前并不是!

產品經理,為什麼要懂點UI設計?

最近工作中總是發現自己與UI設計師溝通不順暢,想要的效果表達不清晰。導致整個項目的界面圖感覺十分違和,開始學習UI方面的知識。刷課刷了一個月,效果十分明顯,基本上可以跟UI設計師愉快而又專業的溝通啦,學了些小技巧還能帶着UI飛~

產品經理為什麼要懂設計?

  • 懂點設計原理,更好的和設計師溝通
  • 讓設計師更準確的把握產品格調

學習過程

刷課,學習地圖:基礎概念 → 設計規範 → 審美 → 提升用戶體驗 → 品牌設計。

看書:

  • 入門:設計心理學(1-4),寫給大家看的設計書
  • 進階:About Face 4 交互設計精髓、用戶體驗的要素
  • 超越:簡約至上:交互設計四策略、社會心理學、情感化設計—移動應用的設計與開發

關於設計的思考

(1)設計是從有效輸入開始

設計師的有效輸入是從臨摹開始,在臨摹中思考。產品經理不需要實際操作,有效的輸入是看大廠產品的界面和產品定位巧妙結合。

在不知道UI方面知識之前,從來不知道為什麼這個App主題色是這樣的?為什麼App會採用這樣的icon樣式?

舉個例子,永輝超市選用橙色作為主題色,其主要的用戶群體是以家庭為主的女性用戶。一般來說,女性喜歡偏亮色,男性喜歡偏暗色。永輝超市的橙色是給人是溫暖的、舒適的,很符合其產品女性群體的定位。

(2)UI設計是有邊界,重視UI規範

UI設計不是天馬行空的,有UI規範約束的產品更有一致性、整體性。按鈕、文字等都需要有統一的規範,細節處的一致性更是展現品牌的穩定性。

如還沒有UI規範,產品經理需給UI設計師施於一定的壓力,哪怕是簡易版本,基本的字號大小、主題色、輔助色的規定,彈窗樣式等。

產品經理驗收時,除了查看有無功能錯漏,更需要注意細節的檢查。如字體是否顯示有序,按鈕注意顏色是否突兀……

(3)格式塔心理學理論應用,使界面被正確的認知

格式塔心理學理論比較龐雜,用在UI設計中,簡單理解:人看圖片是一開始看到的是眼睛和大腦處理過的簡單整體,而後才是細節。

在一個界面里,人只能接收少數不規則的視覺信息,太多的不規則信息如大腦無法形成整體認知,從而會覺得界面不友好。

產品經理升級打怪之路——UI設計

所以,產品經理判斷:

  • 界面的信息第一眼是否呈現成易理解的整體?
  • 相似信息是否保持整體性和一致性(大小、形狀、色彩)?
  • 相似內容(文字、按鈕)要合理布局,有序排版,表達清楚內容之間的關係,是從屬關係還是平行、遞進關係?
  • 信息指引是否精準傳達,視覺的焦點是否在主要內容?

(4)審美的開始是審丑

先要知道什麼是丑的設計,這裡不是指個人審美的美醜,而是是否符合產品調性,是否符合基本的美學原理。如排版清晰有序,不干擾信息的獲取或閱讀,是否帶有時代的痕迹(過時)等。

眼界是一個人審美的上限,平時要多注意提高審美。去看大量好的設計,看能接觸到的最美設計,如一些國際設計大獎的獲獎作品。

關於色彩

(1)每個色彩都有冷暖

產品經理升級打怪之路——UI設計

了解色盤,基本的冷色、暖色是什麼感覺,可能有工作很多年的設計師也不清楚如何判斷冷色、暖色。同樣的橙色,往黃色方向偏點就是暖色;往綠色方向就是冷色。

一個界面里是冷冷色搭配、暖暖色搭配,才會和諧、舒適、順眼。

(2)色彩是有味道的——酸甜苦辣咸

紅色是熱情又侵略的,黃色是陽光、希望,藍色是和平、穩定,白色是簡潔、乾淨,黑色是詭異、奢華……每種顏色都有不同的味道,可以營造不同的氛圍。

看設計圖時,產品經理需着眼整體氛圍,根據其具體的色彩情緒去判斷是否符合產品要求。

產品經理升級打怪之路——UI設計

產品經理升級打怪之路——UI設計

隨意從網易雲音樂中截取了兩張輪播圖,同樣是紅色,前者是漫威的宣傳,紅黑搭配有熱血的氛圍,黃色點睛;後者是Blossoms的輕音樂,歌曲清新自然,紅白的搭配營造清新的韻律。

這就是氛圍的營造,試想下,這兩者紅色反過來搭配,會及其不協調,氛圍很詭異。

(3)配色是可數據化

有一個小技巧,可以搭配出統一風格的配色——HSB調色法。

HSB又稱HSV,表示一種顏色模式:在HSB模式中,H(hues)表示色相,S(saturation)表示飽和度,B(brightness)表示亮度HSB模式對應的媒介是人眼。

HSB模式中S和B呈現的數值越高,飽和度明度越高,頁面色彩強烈艷麗,對視覺刺激是迅速的,醒目的效果,但不益於長時間的觀看。

在PS中,色相就是色盤,0°—360°,飽和度和亮度都是0%—100%。輸入有規律的數值(整十、正數),可以得到有規律的色彩,調配出有規律的統一的顏色。

有興趣的小夥伴可以打開PS嘗試一下,看看輸入同樣的飽和度,有規律的輸入不同的色相、亮度,會有怎樣的變化。與之前憑感覺的色彩搭配相比是不是更穩定,更有規律可循?

以上就是近期學習UI的心得,再總結下:

  • 設計是從有效輸入開始
  • UI設計是有邊界,重視UI規範
  • 格式塔心理學理論應用,使界面被正確的認知
  • 審美的開始是審丑
  • 關於色彩:每個色彩都有冷暖;色彩是有味道的——酸甜苦辣咸;配色是可數據化

如果喜歡我的文字,如果你也是產品小白,一起升級打怪啊~

 

作者:xlin,公眾號:曉途

版权声明:本文采用知识共享 署名4.0国际许可协议 [BY-NC-SA] 进行授权
文章名称:《產品經理,為什麼要懂點UI設計?》
文章链接:https://www.pmbear.com/%e7%94%a2%e5%93%81%e7%b6%93%e7%90%86%ef%bc%8c%e7%82%ba%e4%bb%80%e9%ba%bc%e8%a6%81%e6%87%82%e9%bb%9eui%e8%a8%ad%e8%a8%88%ef%bc%9f/
本站资源仅供个人学习交流,请于下载后24小时内删除,不允许用于商业用途,否则法律问题自行承担。

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

大前端WP主题 更专业 更方便

联系我们联系我们