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

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

手機界面ui設計經驗有什么? 讓你成為高手

Time: 2020-02-13

手機界面ui設計經驗有什么?你是不是也很了解這個問題的答案呢?接下來就需要跟隨著我們一起好好的研究下,如果你也想要讓自己的界面更具有特色的話,自然就需要看看下面的內容。

  1、UI設計

  UI設計是指對軟件的人機交互、操作邏輯、界面美觀的整體設計,也叫ui界面設計。UI設計分為實體UI和虛擬UI,互聯(lián)網說的UI設計是虛擬UI,UI即User Interface(用戶界面)的簡稱。

  好的UI設計不僅是讓軟件變得有個性有品位,還要讓軟件的操作變得舒適簡單、自由,充分體現軟件的定位和特點。

  2、手機界面ui設計經驗分享

  首先選擇基本單元:8像素網格

  為了使整個設計看起來更簡潔,最好先設置基準單位,然后再確定所有的尺寸。具體選擇多少本來應該由你來定,但通常,最好的選擇是堅持一些經過驗證的規(guī)則。其中一條規(guī)則是以 8 像素的倍數來調整和移動元素的大小。這條規(guī)則會使決策更有效率。

  px 和 dp:「dp」這個詞也被用在界面設計和原型設計中?!竏p」是「密度無關像素」的縮寫。「這個單位是以 160 dpi 的屏幕為基準的,1 個 dp 等于 160 dpi 屏幕上的 1 個像素,等于320 dpi 屏幕上的 2 個像素,以此類推。數學換算公式是’ px = dp * (dpi/160) ‘。

  注:如果使用的是較小的元素或對象,也可以使用 4 像素的增量,而不是 8 像素的增量——偶爾可以根據需要進行進一步的調整。

unnamed (1).png

 ?。▓D片來自網絡)

  但為什么是8像素呢?

  這里有幾個原因可以解釋為什么 8 經常像一個「神奇的數字」:

  8 像素是一個足夠的最小「增量」。

  8 是一個很好的數,因為它能被 4 和 2 整除。

  如果使用 8,就可以輕松地調整任何元素的大小,而不會出現半像素,比如 8 / 2 = 4、4 / 2 = 2 和 2 / 2 = 1。另一方面,如果你從 10 開始,你會得到 5 個像素,然后是 2.5 個像素,然后是 1.25 個像素。在設計界面時,盡可能避免一半像素。通過使用完整像素,設計中的元素將對齊到精確的像素邊界,最終看起來更清晰。

  8 的倍數(8、16、24、32、40、48、56、64、72、80等)與二進制值(1、2、4、8、16、32、64、128、256、512等)交織在一起。

  最后,這些數字也很容易記住。

  使用8像素網格的優(yōu)點是什么?

  作為設計師,決策時間是非常寶貴的。這將使你更快、更有效率。

  如果跟開發(fā)對接,這能創(chuàng)建一個體系幫助團隊提升效率。如果開發(fā)需要進行一些快速修改,他可以將值調整為 8 像素的增量。這能確保一致性和有規(guī)律。

  當人們訪問你設計的網站時,他們會感到很舒服,增強信任感和用戶體驗度。

  1. 水平網格

  我相信你在設計網站時已經使用過網格了,使用網格可以幫助你準確地將所有元素放置在界面上。

  網格形成界面的骨架,并決定可以將元素放置在何處。模板化定義了清晰的邊界,這樣設計就會更加一致。用上網格系統(tǒng),可以更容易地決定將元素放在哪里。當經驗越來越豐富時,調整界面就會更加得心應手。

  但是如何創(chuàng)建這個網格呢?我們將在下面討論具體問題。基本上,列的數量和大小可能是隨機的,這取決于你的需要。設計越細致,網格需要的列就越多。如果還是拿不準,就應該向有經驗的同事尋求幫助。

unnamed.png

  (圖片來自網絡)

  2. 垂直網格

  與水平網格類似,在設計中保持垂直距離的一致性也很重要,就像電子表格中的行一樣,它們可以幫助保持文本的均勻間隔。

  這些行應該要多大?再說一次,這取決于你的需要。然而,我建議使用 8 像素或 8 的倍數(如 16)重新定義元素或文本要對齊的邊界。

  行高

  一旦定義了所有的字體大小,就要注意行高了。對于行高,再次使用 4 像素的增量。例如,對于 16 像素的文本,我們將行高設置為 24 像素。如果你想讓文字更有呼吸感,那么將行高增加 4 個像素到 28。

  定義項目中的顏色

  顏色的各種組合太多了,如果你不預先定義顏色的深淺,就會浪費太多時間。你不能把自己局限于黑色、白色,藍色這類明確的顏色。對于每一種顏色,都需要其他的色調,提前設置好它們是很重要的,這樣在整個設計項目中顏色是能成體系的。為每種顏色準備5到10種色調,我喜歡為每種顏色定義9種色調。

  手機界面ui設計經驗有什么?以上就是我們?yōu)楦魑慌笥褌兛偨Y的幾點內容,想必大家都有了全面的認識了吧,總之,希望大家參考上面的內容。


合作咨詢

上海(總部)

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

辦公地址地圖

北京

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

辦公地址地圖

成都

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

辦公地址地圖
首頁 | 案例 | 服務 | 關于 | face+ | 智見

Copyright ? 2009-2022 FaceUI design. All rights reserved


滬ICP備13044459號-5

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