編輯導語：我們每天都會接觸到很多APP，每個APP里面的風格以及設計都會有差別，一些APP的頁面設計如果讓你看起來很舒適，這就是用戶的體驗感不錯；本文作者分享了關于一些簡單的小細節幫你提升設計品質的方法，我們一起來看一下。

大家都很喜歡設計小技巧這個環節，想讓我多分享一些設計技巧，那我就多找找我之前的項目案例，和大家拆解下大廠設計師做設計過程的思考給大家，幫助大家提升一下設計技巧。

一、使用灰色增強層級

這是之前做支付寶財富時候一個頁面，當時業務方需要在理財服務下面加2個入口「穩定收益」 和「浮動收益」。

當時也沒在意，那就按照設計規范，直接下面加2個小卡片就好了，樣式和上面保持一致；然后我就這樣做了，但是做完后，發現怎么看怎么奇怪，我們來分析下。

單獨看局部設計，其實并沒有問題，但是從整體看，會發現這里被切割的非常的碎片；這么一個區域有3個卡片設計，同時下面功能和上面還不一樣，但是設計上看著又很類似；所以信息表達肯定是有問題的，于是進行了優化。

樣式雷同，于是我將視覺樣式進行了調整，加了一個色塊的圓形按鈕上去，并且去掉了卡片設計，和上面完全拉開差異了。

但是發現新的問題來了，首先這樣太重，完全搶了頂部的余額寶那5個金剛入口，同時這兩個入口放這里， 兩側視線邊距無法對齊，閱讀起來有很強的鋸齒感。

于是我將下面的背景改為了灰色，在樣式上進行了區分，同時灰色在格式塔「地面原則」里 面相當于視覺底部，從信息層級上也是清晰的；所以平時我們在處理某個獨立模塊設計時候，一定要結合整體去看，有時候如果相鄰的樣式嘗試下用不同顏色去創建區別。

改之前的前后對比，你會發現優化比之前要很多，同時內容在整個頁面的信息里面更加合理。

同理，在頁面的其他地方，我們也運用這個方法，也很好傳遞信息層級同時，頁面也更加合理，希望這個小技能大家能掌握。

二、巧用底紋讓頁面更精致

星球里的同學可能都知道，我們21天的打卡練習， 會讓大家去練習底紋的技法，以及設計的各種圖形的變化效果。為什么要掌握這個呢？因為他是增強設計細節的神器。

上面是我當時做的支付寶尊享理財一個項目，當時頁面差不多定稿了，首頁進去一個深藍色+玫瑰金配色，首頁一個邀請的信封，非常高級；但是因為頁面內容比較少，頁面非?？?，需要增加一些細節。

第一步，我在頁面四周加一個邊框，共兩層，一個深一個淺，目的是增加層次，讓這個頁面更加有邀請函的感覺；同時也能讓細節更豐富一點，加上后，細節豐富多了。

第二步，在頁面的上面和下面角上增加一些金屬流動的元素。因為是理財產品，同時是100萬起投，需要頁面體現出一些尊貴感，所以有時候需要一些濃重的氛圍營造。

改完之后，明顯比改之前細節層次，尊享感更強一些，同時我們把這個設計細節，也一直沿用到整個產品設計中，讓很平的頁面細節豐富起來。

有底紋的運用，和沒有底紋的運用，運用了底紋讓頁面更有質感，整個空間感也會更強烈；所以大家今天如果頁面中沒有細節，可以通過類似方式去添加，但是要注意，底紋元素一定要和品牌有關聯，不能亂用。

我們熟悉的淘寶88會員也是在頁面中大量使用圓形的底紋，這個圓形底紋是基于「88」這個數字圓形抽離出來的，細節非常的強。

三、最后

今天這兩個技巧，就是平時在項目中實際運用的，雖然都很小的點，但是看完就會用，用了就會出效果，希望你們都能掌握這個技巧。

如果對該篇文章有疑問，或者想和我交流設計的朋友，歡迎評論區和我一起交流設計經驗與心得，歡迎多多交流～

#專欄作家#

Sky，微信公眾號：我們的設計日記（ID：helloskys），人人都是產品經理專欄作家。原支付寶體驗設計專家，阿里巴巴天貓設計專家；10年知名互聯網公司設計經驗，對于產品從0到1、品牌定位、金融產品、設計規范、運營規范、大促等有豐富實戰經驗。

本文原創發布于人人都是產品經理，未經許可，禁止轉載。

題圖來自?Unsplash，基于 CC0 協議