8.11日(rì)音(yīn)訊,最容易忽略的(de)APP設計(j¶±Ωì)小(xiǎo)細節,随著(zhe)移動優先的(de)趨勢,APP設™ >計(jì)也(yě)越來(lái)越受到(dào)公司重視(s↑ αhì),不(bù)斷地(dì)提高(gāo)★≥∞APP的(de)設計(jì)質量是(shì)每個(gè)設計(jì)師± ™(shī)的(de)追求,有(yǒu)哪些(xiē)設計(←£♥"jì)中的(de)細節被你(nǐ)忽略了(le)呢(ne)?讓我♦$÷們一(yī)起來(lái)看(kàn)看(kàn)這(zhè)∏些(xiē)細節你(nǐ)都(dōu)把握住了(le)嗎(ma)。
視(shì)覺表現(xiàn)型問(wèn)題
1.統一(yī)的(de)圖标設計(jì)風(fēng)格
圖标設計(jì)在整個(gè)APP設計(jì)中是(shì)比重較大₩¥(dà)的(de)闆塊之一(yī),圖标設計(jì)風(fēng∑™®)格有(yǒu):線性圖标、填充圖标、面型圖 "γ€标、扁平圖标、手繪風(fēng)格圖标和(hé)拟物(wù)圖标等σ"≥。無論我們選擇何種表現(xiàn)形式的(de)圖标都(dōu)請( ₹↕ qǐng)保持統一(yī)性,相(xiàng)同的(d♣≈e)模塊采用(yòng)一(yī)種風(f≥$γ'ēng)格的(de)表現(xiàn)形式,如(rú)果是(δ←shì)線性圖标就(jiù)保持一(yī)緻的(de)描邊∏✔←數(shù)值。
圖标在配色上(shàng)面也(yě)要♥★ε♣(yào)保持有(yǒu)規律的(de)統一(yī),采•×用(yòng)相(xiàng)同顔色是(shì↔£<£)比較常用(yòng)的(de)配色方式。如("δ↔rú)果你(nǐ)采用(yòng)不(bù)同色相(xiàng)的(d "e)配色方式,要(yào)保持整體(tǐ)的(de)配色協 ¥調,不(bù)要(yào)出現(xiàn)飽和(hé)₽>≥ 度、明(míng)度反差過大(dà)的(d®≥£§e)配色而影(yǐng)響整體(tǐ)的(de)視∑←₹∏(shì)覺協調。
2.圖标大(dà)小(xiǎo)的(de)視(sσφ←±hì)覺平衡
同一(yī)個(gè)界面出現(xiàn)多(duō)個(gè≤✘♣®)圖标時(shí),我們需要(yào)保持整體(tǐ)的(de)視(shì)覺λ™平衡。并非是(shì)所有(yǒu)圖标都(dō≠®u)采用(yòng)相(xiàng)同的(♠ →de)尺寸就(jiù)能(néng)達到(dào)平衡,由于圖标的(↑↓↕de)體(tǐ)量不(bù)同,相(xiàng)同尺寸下(xià)不(bùΩ₹∞♠)同體(tǐ)量的(de)圖标視(shì)覺平衡也(yě)不(bù)相(β≤£xiàng)同,例如(rú)相(xiàng)同尺∏寸的(de)正方形會(huì)比圓形顯得(de®±)大(dà)。因此,我們需要(yào)根據圖标的(de©&)體(tǐ)量對(duì)其大(dà)小(xiǎo✔↑)做(zuò)出相(xiàng)應的(de)調整。
3.優化(huà)你(nǐ)的(de)分(fēn)割線
界面設計(jì)中往往細節的(de)處'✔ 理(lǐ)最容易被忽略,根據界面配色的(d®βe)不(bù)同,我們在分(fēn)割線色彩的(±βde)選擇上(shàng)面也(yě)要(yào)做(zuò)出相(xγ↕βiàng)應的(de)調整。由于分(fēn)割線的(de)作(z×≤uò)用(yòng)是(shì)區(qū)分(f→ēn)上(shàng)下(xià)信息層級和(hé)界面裝飾,配色的(←↔$de)表現(xiàn)力要(yào)低(dī)于文(wén)←¶€字信息的(de)力度,通(tōng)常我©"÷們會(huì)選擇淺色而否定深色,這(zhè)樣界面會(huì)更加簡潔通☆€(tōng)透。深色的(de)分(fēn)割線要(y≤₩§ào)慎用(yòng),除非在一(yī)£←些(xiē)特定的(de)産品場(chǎng∏∏ )景下(xià)。
4.合理(lǐ)的(de)運用(yòng)投影(y✘☆☆ǐng)的(de)顔色與透明(míng)度
通(tōng)過對(duì)按鈕、卡片等進行(xí¥β™ng)投影(yǐng)運用(yòng)可(kě)以增強立體(tǐ)感與層次感>£♣。我們在制(zhì)作(zuò)投影(yǐng)時(s×≤hí),需要(yào)根據不(bù)同背景≥$ ₽改變投影(yǐng)的(de)顔色、透明(míng)度。
淺色背景下(xià)投影(yǐngδ₽ )的(de)顔色會(huì)選擇拾色器(qì)偏左上(shàng)角的(d>¥e)位置和(hé)透明(míng)度在1¶♥"0%~40%(個(gè)人(rén)經驗)✔¥♥之間(jiān)進行(xíng)調整。深色背景下(xià)投影★ Ω(yǐng)的(de)顔色會(huì)選擇拾色器(qì)偏右下(xi≥>∏à)角的(de)位置和(hé)透明(míng)度在20%~40%(•₽>個(gè)人(rén)經驗)之間(jiān)進行(xíng)調☆"整。
投影(yǐng)的(de)權重要(yào)符合頁面設計(jì)的(de)→¥氛圍,投影(yǐng)的(de)運用(yòng)是(shì)為(wèi)了∞<(le)增強元素的(de)立體(tǐ)感與層次感,而不(bù)是(shì±✘)影(yǐng)響整個(gè)頁面的(de)視(shì)≈≥覺平衡。
5.不(bù)要(yào)過度裝飾,讓界面更簡潔©≤
設計(jì)需要(yào)準确的(de)把握€✘♥∑“度”,過度的(™♣de)設計(jì)會(huì)幹擾信息的(dα✔e)傳達。減少(shǎo)不(bù)必要(yào)的(d•₽↕e)設計(jì)元素,讓信息脫引而出,整個(gè)界面将會(huì)更加簡潔λ'清爽,也(yě)不(bù)會(huì)分(fēn)散用(yòng)戶的∞'(de)注意力。
6.圖片比例&視(shì)平線的(de)統一(yδ≠λφī)性
在人(rén)物(wù)展示的(de)設計(jì)中,如(rú)果并列出♥<現(xiàn)多(duō)個(gè)人(rén)物(w≠←$Ωù)形象,為(wèi)了(le)保持視(shì)覺平衡我們需↔α要(yào)調整并列圖片的(de)大(dà)小(xiǎo)比例,就(j↕σ€→iù)像所有(yǒu)角色都(dōu)是(shì)在相(xi ₩×₹àng)同焦距下(xià)拍(pāi)攝的(de)。在人(rén)物(wù)₹£©上(shàng)下(xià)位置的(de)調整上(shàng)面我們要(yàφ₽o)盡量控制(zhì)視(shì)平線的(de♣↔)方向,讓他(tā)們的(de)眼睛處于相(x★→¥₩iàng)同的(de)位置左右。
一(yī)個(gè)界面中出現(xiàn)3種左右的(de)配色'↓÷ 是(shì)相(xiàng)對(duì)比較容易把控的(d©∏e),如(rú)果超過3種以上(shàng)的(de)配色,是"©(shì)非常考驗設計(jì)師(shī)功底的ε↑γσ(de),如(rú)果顔色的(de)處理(lǐ)不λ≥(bù)到(dào)位就(jiù)會(huì)出現(x£>$λiàn)五彩斑斓的(de)“視(±←×shì)覺盛宴”。
在選擇配色組合時(shí),使用(yòng)相(x£ iàng)似色的(de)配色方案可(kě)以使σ★顔色更加協調和(hé)交融;如(rú)果希望更鮮明(míng)σ§♦←地(dì)突出某些(xiē)元素,對(duì)比色是(shì) ™不(bù)錯(cuò)的(de)選擇。無論選擇何種配色方案,都(dōu® )要(yào)控制(zhì)好(hǎo)界面ελ中的(de)配色比重,使信息傳達不(bù)受幹擾。
APP設計(jì)還(hái)有(≈ε↓yǒu)很(hěn)多(duō)需要(yào)設計(≈×jì)師(shī)注意的(de)細節,這•÷ (zhè)裡(lǐ)就(jiù)不(bù)一(yī)一(₩ •yī)列舉。
邯鄲網絡公司首創網絡告訴告訴大(dà)家(jiā)設計(jì)是(s£€hì)一(yī)條很(hěn)漫長(cháng)的(de)路€♦(lù),沒有(yǒu)任何結論是(shì)一(y₩σī)成不(bù)變的(de),作(zuò)為(wèi)'互聯網時(shí)代下(xià)的(de)設計ππ(jì)師(shī),我們要(yào)不( ✔bù)斷的(de)反思總結,打破常規與束縛,接受更多(duō)新的(de)元素✔↔,做(zuò)出更加符合這(zhè)個(gè)時(shí)代下(xià)的☆←♦♠(de)設計(jì)作(zuò)品。