雷火平台-中国知名电竞赛事平台

聯(lián)系我們 face+ 關(guān)于 服務 案例
首頁 案例 服務 關(guān)于 face+

UI設計思路,讓你的設計更有方向感

Time: 2020-01-09

對于ui設計師們來說,設計思路是非常重要的,因為設計思路真的是相當于我們在設計過程中的一盞指路明燈哦!下面我們跟隨小編一起來了解一下UI設計思路的相關(guān)資料吧。


思路一、明確劃分與UI相關(guān)和與UI無關(guān)的部分

  根據(jù)UI設計圖,我們首先要把界面展現(xiàn)的數(shù)據(jù)先抽出去,只看UI的表現(xiàn)。也就是說,把UI相關(guān)的部分抽出來。比如一個界面可能需要分幾部分組成,每一部分大概怎么設計等。


  思路二、劃分屏幕大小,明確出跳轉(zhuǎn)關(guān)系

  要考慮到你的APP所對應的屏幕大小及DPI,不同的屏幕與DPI,你有可能會存在不同的UI布局,最典型的是在3.0以上的SDK版本,可能引入了Fragement元素,手機屏幕與平板的屏幕的UI設計,完全是兩種不同的風格。

  還有,盡可能地明確出跳轉(zhuǎn)關(guān)系,這可以用一些小卡片的形式來標記,一個卡版表示一個畫面,把不同畫面之間的遷移關(guān)系明確出來。同時,還要把這些畫面之前的相同點與不同點找出來,因為這會影響到是否決定提取共通畫面。


1.jpg

(圖片來自網(wǎng)絡)


  思路三、列出需要用到的UI元素(Widget)

  把界面上展現(xiàn)的UI元素列出來,像常用的button, imagebutton這些很簡單,一看就知道,關(guān)鍵是有些UI,可能會涉及到一些自定義的View,這里一定要多考慮。

  另外,有可能為了統(tǒng)一控制,比如也有可能擴展一個Button,派生類里面可能只是改變一個字體大小等,這種做法通常是用于多數(shù)UI的字體大小相同,可以抽象出來個共通的Button,這樣在各個UI里面,就可以不用都來設置這個字體大小。還有,也可以抽出共通的style,比如textview的style,文本顏色,字體大小,是否加粗等。


  思路四、列出哪些UI元素可以用SDK的,哪些則是需要自定義

  通常一個項目里面都會有自定義的組件(View),多數(shù)是組合控件——把不同的Widget組合成一個Layout。這還要需要根據(jù)項目自身的需求來定。

  注意:這里一定要有一個良好的設計,以應地需求變更。比如第一版需求,可能不需要一些組合View,直接使用SDK自身的Widget就能完成,但經(jīng)過一些變動之后,發(fā)展之前的UI設計不合時宜,可能需要提供自定義的View,那么原來用到SDK自身的Widget的地方可能需要改動。這種改動說大也大,說小也小,在設計的時候,要多考慮一下這種需求變更。


4.gif

(圖片來自網(wǎng)路)


  思路五、完成UI界面的繪制

  這一步,其實不一定會用到,通常情況下,不會涉及到自繪制,因為自繪制比較麻煩,而且費時間,但是在特殊情況下,自繪制能提高效率,因為你用View布局,會涉及到layout, measure, touch event, dispatch draw等方面,這些會影響性能。

  UI設計思路六進行內(nèi)部邏輯和UI界面的整合

  通常一個View里面,都會有一些邏輯,特別是自定義的View,可能會封裝一些特定的屬性。在使用這些View的時候,UI的activity會與這些View有一個邏輯的整合。


  其實小編覺得設計師在做UI設計時只要理清了UI設計思路以后,就可以很順利開展設計項目,做好自己的統(tǒng)籌規(guī)劃工作哦!


合作咨詢

上海(總部)

上海市浦東新區(qū)郭守敬路498號22號樓
021-61057328
service@faceui.com

辦公地址地圖

北京

北京市東城區(qū)后永康17號A座
010-64015620
service@faceui.com

辦公地址地圖

成都

四川省成都市錦江區(qū)東大街牛王廟段100號
028-62790929
service@faceui.com

辦公地址地圖
首頁 | 案例 | 服務 | 關(guān)于 | face+ | 智見

Copyright ? 2009-2022 FaceUI design. All rights reserved


滬ICP備13044459號-5

上海辦公地點地圖
北京辦公地點地圖
深圳辦公地點地圖
在微信中搜索faceui
或保存二維碼在微信中打開