很多學(xué)習(xí)UI設(shè)計(jì)的伙伴們會(huì)在做界面的時(shí)

?今天，我們就

一張背景圖和四張人物圖像圖片

線性圖標(biāo)

準(zhǔn)備字體

界面色值

字體

在UI設(shè)計(jì)中，避免使用有襯線，iOS中英文使用Helvetica,中文使用冬青等一些無線襯字體，盡量使用一些與iOS自有字體相似的字體做設(shè)計(jì)。

選色

基本選擇兩個(gè)顏色，主色、輔色。而高光、陰影基于主色，高光向左上角去選擇合適的色值，陰影像右下角選擇暗一些的色值。主色選擇時(shí)很重要的，每一個(gè)主體都有一個(gè)合適的顏色。

畫界面

準(zhǔn)備好要用的色值、字體、圖片素材后，我們就來開始做頁(yè)面。界面畫布尺寸設(shè)定：750*1334px，狀態(tài)欄高度設(shè)定：40px，導(dǎo)航欄高度設(shè)定：88px，導(dǎo)航欄兩側(cè)按鈕大小設(shè)為36*36px。

圈畫的地方，相對(duì)于新手來說是難點(diǎn)，歸類起來為兩類：一個(gè)是蒙板，一個(gè)是圖層樣式的漸變。

上看都是涉及圖層蒙版的，圖層蒙板是什么？簡(jiǎn)單來說就是，你想要一片區(qū)域消失，只顯示你想要的部分。蒙板就是蓋住其他你不想看到的區(qū)域。

畫一個(gè)320*320px的正圓，關(guān)閉3.1的填充，打開描邊，設(shè)置描邊為6px，選擇3.2的漸變描邊，設(shè)置角度為90度，根據(jù)自己的需要在3.5中設(shè)置色塊，就得到2.5的效果。

圖片處理

將圖4拖入后轉(zhuǎn)化為智能對(duì)象，調(diào)整色彩飽和度和明度以及圖層樣式，疊加的顏色用的是基于主色又相對(duì)較暗的顏色。

視覺包裝

?做完界面后，還有最重要的一步：視覺包裝。給自己做的頁(yè)面做個(gè)簡(jiǎn)單的包裝，美化一下自己的界面吧！

?初學(xué)UI不要一開始就盲目的去學(xué)實(shí)操，而忽略了設(shè)計(jì)理論。

?UI設(shè)計(jì)是設(shè)計(jì)什么產(chǎn)品的？

? UI設(shè)計(jì)除了設(shè)計(jì)APP，還設(shè)計(jì)哪些產(chǎn)品？

??UI設(shè)計(jì)和平面設(shè)計(jì)的區(qū)別在哪？

UI設(shè)計(jì)的過去發(fā)展與未來趨勢(shì)？

每晚八點(diǎn)分享UI直播知識(shí)：http://h5ip.cn/2s96