更新時間:2022年10月31日14時00分 來源:傳智教育 瀏覽次數(shù):
設(shè)計風(fēng)格可以理解為美的不同視覺表現(xiàn)形式。在UI設(shè)計中,統(tǒng)一設(shè)計風(fēng)格能給用戶呈現(xiàn)整體一致的視覺體驗,既有利于傳達(dá)產(chǎn)品整體的品牌形象,又方便設(shè)計團(tuán)隊制定設(shè)計規(guī)范,減少設(shè)計風(fēng)格不一致帶來的溝通成本。因此確定設(shè)計風(fēng)格往往是UI設(shè)計的第一步工作。確定設(shè)計風(fēng)格主要包括以下幾個步驟。
1.尋找產(chǎn)品特性
每個產(chǎn)品都有自己的特性,表現(xiàn)產(chǎn)品特性的詞匯也有很多,例如柔美、輕巧、陽剛、張揚(yáng)、熱情、神秘、高貴、環(huán)保、科技、時尚等,每個產(chǎn)品特性都會有著對應(yīng)的視覺語言。例如,下圖所示為某發(fā)型設(shè)計App的部分展示頁面。
發(fā)型設(shè)計App界面
該款A(yù)pp整個界面采用灰黑色調(diào),區(qū)別于五光十色的大眾發(fā)廊形象,彰顯高端品位。
2.確定主色調(diào)
在進(jìn)行UI設(shè)計時,必須為產(chǎn)品確定一個主色調(diào),然后根據(jù)主色調(diào)搭配不同的輔助色,設(shè)計各種顏色控。主色調(diào)是視覺風(fēng)格中的靈魂,更是一種可以強(qiáng)化的視覺識別信號,讓用戶只通過主色調(diào)就能識別產(chǎn)品的特性。例如,食品類App界面大多使用紅色、橙色、黃色等暖色系顏色作為主色調(diào),如下圖所示。
食品類App界面
3.選擇圖標(biāo)和字體
在UI設(shè)計,設(shè)計風(fēng)格還反映在圖標(biāo)和字體的選擇上。例如,纖細(xì)的圖標(biāo)和字體顯得設(shè)計高雅適用于高端類產(chǎn)品,而卡通圖標(biāo)和字體更適用于少兒類型產(chǎn)品的界面設(shè)計。然而困擾設(shè)計師的是移動端系統(tǒng)自帶的中文較少,而且沒什么特色。因此內(nèi)嵌字體成為一些追求完美的設(shè)計師的首選。
4.排版設(shè)計
排友設(shè)計是指在有限的版面空間,將UI設(shè)計元素按照所要表現(xiàn)的設(shè)計風(fēng)格進(jìn)行編排組合,形成一個富有藝術(shù)美的整體形象,如下圖所示。