起點(diǎn)課堂會(huì)員權(quán)益
職業(yè)體系課特權(quán)
線下行業(yè)大會(huì)特權(quán)
個(gè)人IP打造特權(quán)
30+門專項(xiàng)技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導(dǎo)直播
12場專業(yè)技能直播
會(huì)員專屬社群
榮耀標(biāo)識提升設(shè)計(jì)細(xì)節(jié)的三個(gè)小技巧
編輯導(dǎo)語：如今我們每天都要接觸到很多款A(yù)PP，用戶在進(jìn)行選擇時(shí)，會(huì)注意到讓自己更加便捷舒適的一些小細(xì)節(jié)，這些小細(xì)節(jié)可以給用戶留下比較深的印象；本文作者分享了三個(gè)關(guān)于設(shè)計(jì)細(xì)節(jié)的一些小技巧，我們一起來看一下。
細(xì)節(jié)決定成敗，今天很多設(shè)計(jì)商業(yè)模式，設(shè)計(jì)方式，以及設(shè)計(jì)表現(xiàn)手法都呈現(xiàn)同質(zhì)化，設(shè)計(jì)師需要幫助業(yè)務(wù)在同質(zhì)化競爭下脫穎而出；除了產(chǎn)品上需要?jiǎng)?chuàng)新，商業(yè)模式也需要不斷創(chuàng)新。
其中還有一個(gè)很重要的點(diǎn)就是設(shè)計(jì)細(xì)節(jié)的提升，那么今天和大家分享一些提升細(xì)節(jié)小技巧。
一、巧用描邊讓頁面更干凈清晰
設(shè)計(jì)干凈利索是展現(xiàn)界面精致度的一大重要指標(biāo)，經(jīng)?？春芏嘣O(shè)計(jì)師作品集，對于細(xì)節(jié)處理很粗心，投影要么太大，要么太弱，導(dǎo)致整體畫面不夠干凈，降低印象分。
▲投影過重會(huì)讓頁面看著非常的山寨感，風(fēng)格顯得陳舊。
▲投影柔和會(huì)稍微好一些，但是感覺邊緣不夠利索干凈清晰。
▲如何變的清晰利索，有兩個(gè)小技巧，第一個(gè)方法是在卡片邊緣加一個(gè)1px的描邊，描邊顏色稍微比投影更深一點(diǎn)，這樣會(huì)讓頁面投影看著更加清晰。
▲如果覺得加描邊還有點(diǎn)重，那么可以把背景由灰色改為白色，投影不用描邊，這樣卡片和背景對比也足夠清晰。
▲看看頁面中落地效果，左側(cè)是很多設(shè)計(jì)師設(shè)計(jì)容易出現(xiàn)的情況，投影過重看著不清晰利索，右邊兩個(gè)方案會(huì)更加清晰，邊緣銳利。
二、通過字重讓界面層級更清晰
▲上圖這個(gè)案例是很多設(shè)計(jì)師設(shè)計(jì)時(shí)經(jīng)常出現(xiàn)的，為什么感覺沒那么精致，問題出在哪里呢？
仔細(xì)分析一下，你會(huì)發(fā)現(xiàn)問題出在缺乏對比，所有字體的顏色都一樣，大小也差不多，信息堆在一起缺乏設(shè)計(jì)重點(diǎn)。
▲怎么處理讓他看起來更舒服，可以加大標(biāo)題的字重，同時(shí)商品卡片的標(biāo)題進(jìn)行弱化；因?yàn)橛脩粼谶@個(gè)場景，更關(guān)注是物料信息，看商品圖就能一目了然，所以沒有必要再去強(qiáng)調(diào)商品內(nèi)容本身；如果什么都重要，那么最后就會(huì)變得什么都不重要。
▲最后來一個(gè)效果的前后對比，其實(shí)通過文字來突出或者強(qiáng)調(diào)層級，不僅僅在界面設(shè)計(jì)中，在平面設(shè)計(jì)，海報(bào)設(shè)計(jì)都是大量運(yùn)用的一個(gè)設(shè)計(jì)技巧，大家可以多看多靈活運(yùn)用。
三、善用疊加提升圖文設(shè)計(jì)效果
▲做電商的設(shè)計(jì)師對上圖場景應(yīng)該很熟悉，我們在做這些設(shè)計(jì)時(shí)，會(huì)用到大量白底圖，但是在使用時(shí)候總是怪怪的；因?yàn)閳D片商品各種形狀都有，視覺上無法很好形成對齊，沒有達(dá)到平衡感；那么這個(gè)時(shí)候就可以善用一些疊加方法，讓設(shè)計(jì)更加精致。
▲通過在圖片上疊加一個(gè)黑色2%的透明度，這樣整個(gè)圖片上就會(huì)蓋上一層淺淺灰色，同時(shí)這個(gè)灰色也不會(huì)影響圖片的質(zhì)量；頁面對齊也會(huì)更加清晰，節(jié)奏感更好。
▲最后看看頁面中效果，是不是右邊加了灰色的底部感覺看起來更高舒服，對齊更加精致。
▲知名產(chǎn)品Pinterest也是通過這個(gè)的方式來處理白色照片的，在圖片上疊加一層黑色透明度的灰色，整體宮格對齊更加的規(guī)范。
四、最后
以上都是一些很小的細(xì)節(jié)，但是現(xiàn)下的產(chǎn)品設(shè)計(jì)就是由這些無數(shù)的小細(xì)節(jié)組成的；如果大家的每個(gè)設(shè)計(jì)都是經(jīng)得起推敲的，那你就能成為一個(gè)思維有格局，設(shè)計(jì)輸出有技巧，成為你身邊那個(gè)最厲害的那個(gè)人。
#專欄作家#
Sky，微信公眾號：我們的設(shè)計(jì)日記（ID：helloskys），人人都是產(chǎn)品經(jīng)理專欄作家。原支付寶體驗(yàn)設(shè)計(jì)專家，阿里巴巴天貓?jiān)O(shè)計(jì)專家；10年知名互聯(lián)網(wǎng)公司設(shè)計(jì)經(jīng)驗(yàn)，對于產(chǎn)品從0到1、品牌定位、金融產(chǎn)品、設(shè)計(jì)規(guī)范、運(yùn)營規(guī)范、大促等有豐富實(shí)戰(zhàn)經(jīng)驗(yàn)。
本文原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理，未經(jīng)許可，禁止轉(zhuǎn)載。
題圖來自?Unsplash，基于 CC0 協(xié)議
陰影那個(gè)細(xì)節(jié)學(xué)到了，自己畫原型都是直接弄個(gè)陰影就完事有考慮不能太重但沒想過那么細(xì)。