国外亚洲成av人片在线观看,热99re久久精品这里都是精品,天堂网在线最新版www,国产成人av区一区二区三,51久久成人国产精品麻豆

視覺走查一般分為形、色、字、構(gòu)、質(zhì)五大模塊，而本文也將結(jié)合這幾點講講視覺走查的注意事項。

設(shè)計評審不通過？經(jīng)常讓你改稿？

我們?nèi)粘Ｔ谧鲈O(shè)計的時候往往會不由自主的套用以往的經(jīng)驗，自己沉浸在自己的小世界里，導(dǎo)致方案過于主觀或者理想化，與目標(biāo)不相符。這就會出現(xiàn)評審不通過、效果不完善的情況，因此我們需要依據(jù)一定的規(guī)則進行自檢。

設(shè)計走查

我們都去醫(yī)院體檢過，前臺會給我們一個體檢表，我們根據(jù)體檢表上的項目去一一檢查并記錄結(jié)果最后匯總。而設(shè)計走查就類似于給方案做一次體檢，根據(jù)一定的設(shè)計標(biāo)準(zhǔn)和規(guī)則對設(shè)計方案從頭到尾進行一次問題的發(fā)現(xiàn)與總結(jié)，便于修改和迭代。

如何進行設(shè)計走查？

確定走查角色

設(shè)計走查作為設(shè)計方案的檢查方式，那么我們也需要有一張“體檢表”來確定檢查的做項目，一般情況下，設(shè)計走查分為交互走查和視覺走查，本文介紹視覺走查方式，交互走查將在后面的文章中介紹。

視覺走查一般分為形、色、字、構(gòu)、質(zhì)五大模塊。

制定設(shè)計標(biāo)準(zhǔn)

當(dāng)我們確定“體檢表”的各個項目之后，我們?nèi)绾沃肋@個項目達標(biāo)不達標(biāo)呢？

因此我們需要有一定的標(biāo)準(zhǔn)來確定這個項目的標(biāo)準(zhǔn)，如果達到標(biāo)準(zhǔn)了，則通過，如果未達標(biāo)則說明需要調(diào)整。

（一）視覺走查——形

1. 圖片

由于圖片一般情況下我們都是留坑位給運營上傳，UGC類APP圖片是用戶上傳，因此要保證圖片尺寸、比例合理且統(tǒng)一。例如同為商品圖坑位，如果都是1:1的，那么應(yīng)該都是1:1的。

而具體商品圖是什么比例需要根據(jù)實際情況來定，例如馬蜂窩這類旅游攻略類，用戶一般是手機拍照上傳，因此比例多為4:3或者1.382:1；像電商類APP，商品的主圖一般都是方圖。

下圖是常用圖片比例以及占比：

2. 標(biāo)簽

標(biāo)簽按層級由低到高大致可分為純文字標(biāo)簽、線框標(biāo)簽、淺色標(biāo)簽、純色/漸變標(biāo)簽，檢查中需要注意標(biāo)簽使用是否統(tǒng)一，例如促銷、賣點這類標(biāo)簽一般比較多，所以可以用線框標(biāo)簽，而自營、旗艦店等官方屬性體現(xiàn)正品心智的層級較高，出現(xiàn)頻次可能也相對較少，因此使用純色/漸變標(biāo)簽。在這種情況下，需要確定顏色是否具有統(tǒng)一性。

3. 按鈕

按鈕按層級由低到高大致可分為文字按鈕、線框按鈕、淺色按鈕、純色/漸變按鈕，我們也需要注意按鈕使用是否統(tǒng)一規(guī)范，比如取消按鈕統(tǒng)一都是線框按鈕，而你突然變成純色/漸變按鈕，那肯定是不合理的。

（二）視覺走查——色

1. 層級合理

在上面這個模塊中，一眼就能分辨出來價格的層級是最高的，其次是上方的標(biāo)題部分，最低的是中間的小字部分。不同的顏色代表了不同的層級，頁面中層級要清晰、合理，通俗點說顏色越不顯眼，層級越低。什么樣的顏色不顯眼：根據(jù)背景色而定，下圖中，text1與背景顏色相近，不易于區(qū)分，不顯眼，層級低；text2與背景色有一定差異，易于區(qū)分，因此顯眼，層級高。

2. 統(tǒng)一規(guī)范

統(tǒng)一規(guī)范顧名思義，在顏色使用方面規(guī)范要統(tǒng)一。比如下圖，如果將藍(lán)色作為文字鏈接，那么在一般情況下，所有的文字鏈接都應(yīng)該用藍(lán)色，當(dāng)然，如果因為背景色導(dǎo)致藍(lán)色識別度不高，這種情況下需要酌情調(diào)整。

3. 數(shù)量適中

顏色太多會使人眼花繚亂，因此需要控制顏色使用數(shù)量，一般情況下，除了黑白灰以外，頁面中顏色不宜超過3種，這需要根據(jù)頁面復(fù)雜度酌情而定，但如果出現(xiàn)多種顏色，需要說明理由，并且保持所有頁面顏色使用統(tǒng)一。

（三）視覺走查——字

1. 層級合理

不同的字號、不同的字重代表了不同的層級，眾所周知，字號越大、字重越重，層級越高，因此需要合理運用，例如下圖輔助小字選擇Semibold，主標(biāo)題卻使用Light，明顯的不合理。

2. 行高舒適

單行文本一般行高與字號相同，而多行文本的行高，一般是字號的1.618倍(取整、取偶)，行高過高，頁面內(nèi)容太散，不利于閱讀，行高過低，內(nèi)容過于緊湊，也不利于閱讀，1.618為黃金比例，間距適中，便于閱讀。

3. 數(shù)量適中

除了字號字重以外，可能還會有多種字體，頁面中字體數(shù)量一般不會超過兩種，一種為常規(guī)文字字體(一般為系統(tǒng)字體)，一種為數(shù)字字體。因為中文文字非常多，字體包非常大，所以不建議嵌入第三方中文字體包，數(shù)字字體一般會將多余的英文字體、符號等去掉以精簡字體包。

（四）視覺走查——構(gòu)

此處的構(gòu)為頁面結(jié)構(gòu)，主要分為層級和間距兩大部分：

1. 層級合理

不同的模塊、不同的內(nèi)容有著不同的層級，不同的頁面也有著不同的目的，層級合理意味著這個頁面的層級排列合理。那么如何理解呢？我們來看下圖：

這是一些商品信息，在商品列表頁展示，在這個頁面我們希望能夠快速命中用戶偏好的商品以使得用戶能夠進入到商品詳情頁完成轉(zhuǎn)化。商品信息有商品圖、價格、賣點、商品名稱，那么如何排列優(yōu)先級呢？

商品圖是最直觀最能吸引用戶的地方，因此商品圖優(yōu)先級肯定是最高的，然后我們就需要確定賣點和標(biāo)題哪個優(yōu)先級高呢？用戶什么時候需要看文字？

當(dāng)然是圖片無法識別、用戶不太能確定這是什么商品的時候，這種情況下，我們最先要做的肯定是幫助用戶去識別商品，其次才是展示賣點，如果不能識別出商品是什么，展示賣點的意義是什么呢？

還剩一個價格，用戶在什么情況下看價格呢？

當(dāng)然是知道這個商品之后才會去看價格，因此我們排出了優(yōu)先級：商品圖>商品名稱>賣點>價格。但是在大多數(shù)情況下，用戶是可以通過商品圖識別商品的，因此用戶會立馬去看價格，因此在這種情況下優(yōu)先級是：商品圖>價格>商品名稱>賣點。

注：此處僅推論，并非實際調(diào)研結(jié)果，正常優(yōu)先級排序需要進行一定的調(diào)研。

2. 間距合理

間距方面我們需要充分利用格式塔原理來制定一定的規(guī)范，來保證內(nèi)容之間的間距統(tǒng)一合理，例如主標(biāo)題和副標(biāo)題，這兩部分內(nèi)容是對商品的描述，因此為一組，我們把兩者間距定為6pt，而商品圖跟標(biāo)題也屬于一組內(nèi)容，我們把兩者間距定為9pt，商品與商品之間也是一組內(nèi)容，我們可以統(tǒng)一把兩者間距定為12pt。

注：此處為舉例，實際間距需要根據(jù)頁面內(nèi)容來進行規(guī)范和調(diào)整。

格式塔原理——接近性

格式塔原理——相似性

格式塔原理——連續(xù)性

格式塔原理——封閉性

格式塔原理——主體/背景

格式塔原理——共同命運

（五）視覺走查——質(zhì)

質(zhì)則強調(diào)頁面整體的感覺是否合理：

1. 風(fēng)格合理統(tǒng)一

風(fēng)格合理統(tǒng)一主要是指頁面整體都是同一風(fēng)格的，無論是icon還是按鈕還是整體，例如icon是扁平的，那么按鈕就不能是寫實的。

2. 調(diào)性合理統(tǒng)一

調(diào)性合理統(tǒng)一主要是指頁面整體感覺，例如產(chǎn)品是奢侈品，要做高端大氣上檔次一點，結(jié)果頁面中促銷氛圍濃重，這是不合理的，在這個部分主要是看情緒板的制作和使用是否統(tǒng)一，如果情緒板完成之后并沒有實際使用，那么多多少少會有一點問題的。

三、確定優(yōu)先級

當(dāng)我們找到不達標(biāo)的對象之后，我們通過四象限法則來對這些對象進行優(yōu)先級排序，根據(jù)優(yōu)先級排序來確定優(yōu)化順序：

總結(jié)

1. 確定走查對象
2. 制定走查標(biāo)準(zhǔn)
3. 進行設(shè)計走查
4. 排列優(yōu)先級
5. 修改優(yōu)化

部分圖片來自網(wǎng)絡(luò)，侵刪。

作者：何必復(fù)雜；公眾號：何必復(fù)雜（UXSimple）

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

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