search
尋找貓咪~QQ 地點 桃園市桃園區 Taoyuan , Taoyuan

[ 平面理論教程 ] 巧妙性設計之UI按鈕設計方法論- 其他教程 - 骨子愛創意

教學主題: 巧妙性設計之UI按鈕設計方法論

大家好!! 小編今天來和大家分享關於 其他教程中的平面理論教程教學

今天的這個教學主題是: 巧妙性設計之UI按鈕設計方法論

這教學的重點為這幾點 [ 設計方,按鈕,設計,巧妙,我們,自己,時候,效果,風格,大家 ]

希望你可以從這幾點中領悟到修圖的精華

本文重點

作為一篇關於設計經驗分享的博文,我只有靠自己淺薄的經驗寫出自己個人的看法,關於界面視覺設計,要分類的話能分得很細,所以能寫的就很多,所以我打算先從局部來談談我總結的一些設計方法。

作為一篇關於設計經驗分享的博文,我只有靠自己淺薄的經驗寫出自己個人的看法,關於界面視覺設計,要分類的話能分得很細,所以能寫的就很多,所以我打算先從局部來談談我總結的一些設計方法。

巧妙性設計之UI按鈕設計方法論

經常有同學問我一些關於按鈕設計的問題,怎麼樣做些漂亮又特別的按鈕,我常常會告訴他們怎麼畫按鈕的技法。但是我覺得一個設計師的成長都離不開自己對設計方法的總結。畫按鈕的技法在網上能找到很多,但是很少有人講按鈕設計的方法論,所以今天我把自己總結的按鈕設計的方法和大家一起分享。(既然是按鈕設計的方法分享,所以我在畫案例的時候略顯粗糙了,還請大家多多包含)

一個漂亮的按鈕,我們要看他的表現方式、形態、質感是否符合整個界面所要傳達的整體風格是值得每一個設計師去重視的。隨着網絡媒體的發展。各行各業都在網絡媒體上來展示自己,也相繼出現了許多行業界面,那麼這些界面的設計風格肯定不會千篇一律,那麼涉及到的按鈕設計也是各有風格的。

“藝術來源於模仿”,“設計來源於生活”。這兩句話對我在學設計的時候起到很大的作用,我在畫按鈕的時候主要從生活中發現自己需要的元素。下面我就舉例來談談我的方法。




首先,我們知道按鈕在效果表現上很大一部分我們是從質感的表現上來識別的,比如我們最常見VISTA風格的按鈕就是從玻璃質感上變現。大家可以看我找的玻璃瓶素材,很明顯就能看出玻璃瓶的高光、反光和投影。我們在變現按鈕質感的時候也多是從這三方面出發。

這裡我做了一個實例分析

巧妙性設計之UI按鈕設計方法論

玻璃瓶素材

巧妙性設計之UI按鈕設計方法論

A按鈕我是完全按照玻璃瓶質感的方式來畫的;

巧妙性設計之UI按鈕設計方法論

B按鈕是我經過我對光規律的觀察而總結出的自己想要表現方式的一種藝術處理。主要是為了說明我們在進行參照質感進行按鈕設計的時候要考慮自己需要的藝術效果進行適當的藝術處理。這樣也便於界面製作人員的製作。

下面一種是我們經常所見的蘋果風格的按鈕設計,這種風格的按鈕也是我們在生活中經常能見到的,鍵盤手機就經常採用這種設計方式,但是隨着觸摸屏手持設備的普遍,絕大數的鍵盤界面都採用模仿原來手機實物鍵盤的設計方式,這樣是為了讓用戶對界面產生親切感,同時這樣的設計也看起來更加簡潔美觀。

巧妙性設計之UI按鈕設計方法論




鍵盤素材

巧妙性設計之UI按鈕設計方法論

C按鈕是我參照鍵盤的質感做的樣稿,

巧妙性設計之UI按鈕設計方法論

D按鈕是我選擇了同一色相不同明度和純度所做的按鈕,之所以列舉這個列子,是為了說明我們在做這種風格的按鈕設計的時候,一定要把握住一個很重要的問題,那就是一定是在同一種色相中拉漸變,這樣的按鈕效果才自然,當然除了設計師追求一些不一樣的效果。




巧妙性設計之UI按鈕設計方法論

從這張色譜,大家可以看出色相的微妙關係。有利於我們做漸變類型的按鈕。

巧妙性設計之UI按鈕設計方法論

E按鈕就是我採用的45度角徑向漸變的按鈕,是為了說明漸變方式不同最後按鈕的最後出現的效果也會不同,就這一點我們設計師可以設計出很多不同形式的按鈕。

其它的我會根據我生活中的觀察來和大家分享一些生活中的按鈕設計,如圖所示這個按鈕設計是我仿常見的複印機上面的按鈕來設計的,這種按鈕的設計方法也很簡單,但是效果很好。同時也加強了用戶對界面的親切感,更加有利於用戶的使用。如下圖:




巧妙性設計之UI按鈕設計方法論

下面這個按鈕是我們常見的開關按鈕,我只是按照開關的樣式,粗糙的畫了一個實例,為的就是說明其實在做按鈕設計的時候我們參考的實物是很多的,多觀察周圍的實物往往會得到一些意想不到的收穫,並且我們還可以通過簡單的藝術效果處理得到不同的按鈕效果。如下圖:

巧妙性設計之UI按鈕設計方法論

我覺得界面設計師在做界面設計的時候應該多觀察生活中看到的物品,這些都能給界面設計師很大的啟發。這篇博文希望得到拋磚引玉的作用,希望大家多多發表自己在做按鈕設計的時候總結的方法論。希望和大家一起共同成長!

看完小編分享的教學之後 是不是對平面理論教程中的其他教程教學更熟悉了呢?

希望我們所介紹的 巧妙性設計之UI按鈕設計方法論 這教學會喜歡

文章標題: 骨子愛創意- 巧妙性設計之UI按鈕設計方法論–轉載請註明來源處

本教學分類為平面理論教程中的 其他教程相關教學

文章相關關鍵字為: 設計方,按鈕,設計,巧妙,我們,自己,時候,效果,風格,大家

本文永久連結 :巧妙性設計之UI按鈕設計方法論




本文轉載自 :VIA



熱門推薦

本文由 designhtd01com_0 提供 原文連結

寵物協尋 相信 終究能找到回家的路
寫了7763篇文章,獲得2次喜歡
留言回覆
回覆
精彩推薦