【UI設計】4個視覺介面設計核心秘訣 硬底子實力養成

今日工具箱 最新文章

【推薦本文原因】

UI設計- 視覺介面設計,顯然是目前設計業最熱門的職業之一,設計人紛紛從平面設計轉換到介面設計。該如何自學UI設計?UI設計又需要哪些軟體工具?本文一一告訴你。

大家都透過資源豐富的網路自學UI設計,可是你有確實學到核心技能了嗎? 而視覺介面設計的核心技能又有哪些呢? 雖然大部分的UI設計師都是靠自學,可是要分辨其專業還是業餘,差別就在屬於硬底子功夫的核心技能,以下就來看看硬底子實力養成計畫該有哪些元素吧:


 

1、先學軟體

如果你是一張白紙的狀態,想學UI,但目前還完全不會軟體的話,建議先學軟體,可以從PS開始,先從基礎的教學影片開始學起,或者買書。當然最快的方式是報名補習班,跟著老師和同學一起有系統地學習。雖然網路上的教學影片很多,隨便找找都有,但怕就怕遺漏了核心技能。

先掌握一些核心的功能:

• 形狀工具和布爾運算
學會做線框圖標,和一些簡單的圖形,比如齒輪,坐標等等

好文推薦 ➡ 布爾運算用PPT就能做?!

• 圖層樣式
可以通過臨摹寫實圖片練習

• 遮色片
做一些遮罩,圖像合成之類的技巧練習

• 去背
熟悉鋼筆、魔術棒摳圖等

• 基本的排版
建議先從臨摹現成界面開始練習

• 字體的認識
安裝一些字體,學會認識一些常用的字體,一看就知道是哪個字體

在這個初步學習的階段,先不管做的東西好不好看,先能做出來,操作上沒問題比較重要。至於視覺美感是第二階段的事,第一步要走穩,熟悉軟體操作最重要。

關鍵是:多實作練習,多犯錯,多總結。

 

 

2、提高審美

♦ 多看 ♦

為了提高審美,你必須大量去看別人優秀的APP或網頁作品,在DribbbleBehancePinterest 等設計網站你可以很容易的找到大量高品質的優秀作品。

除了UI設計外,平面、攝影、3D、手繪等全球頂級的作品也都可以看到,找到並收藏它們。一段時間後,回顧這些作品,如果發現三個月前收藏的作品很low,恭喜,說明你的審美提高了!

 

♦ 多做 ♦

當你看過很多優秀的作品後,你可能還是不會設計,所以接下來你要做的就是不斷的練習,第一階段就是臨摹。

對於沒有設計基礎的你來說,最重要的是訓練技巧和敏感度,因此你要做的事就是,現有產品的臨摹練習,也就是說你可以將你平常特別欣賞的作品直接複製! 從臨摹的過程中感受作品的線條,還有設計呈現。

推薦資源 ➡ Sketch app sources

臨摹幾套作品過後,接下來可以進入第二階段—— Redesign。

你可以redesign一個自己版本的iOS系統界面,或者重新設計一個現有品牌 ,加入自己的想法和理念,也就是再製訓練。建議選定一款常用的App,依照此款app的設計流程,分層做再製練習。選定app的用意在於,一方面能練技術,另一方面能搞清楚一套app的流程介面設計。

 

♦ 多想 ♦

在看和做的過程中,設計技巧只是學習UI的一小部分,更多的是要去理解設計背後的思路和原理。比如,這個產品為什麼定義藍色為主色?為什麼要放大和加粗那個數字?整個頁面的結構和佈局是怎樣的?設計的目標有哪些?等等。

不斷去思考,不停去問自己為什麼,只有這樣,才能在今後的工作和創作過程中,使設計有憑有據,沒有破綻。經得起別人的推敲,顯得自己更專業,從而獲得認可和尊重,更順利的使用設計去解決問題。

 

 

3、關於學習方法

這個時候要加強理論和知識的累積,也就是硬底子的部分。比如一些常規的設計方法手段,像是:格式塔原則,菲茲定律、黃金比例等等。

平面設計3大構成也是非了解不可的基本功,常用術語:和諧、對比、對稱、平衡、重心、節奏、韻律等等,這些是最最基本要搞清楚的幾點。

其實很多人都學了很久了,還是經常會不注重細節,該對齊的不對齊,該居中的不居中,該留白的不留白。這些關於硬底子的基本功,最終還是會成為業餘跟專業中間的那一道門檻。

 

 

4、開始行動

UI設計要學習哪些軟體呢?

1 PS- Photoshop

2 AI- Illustrator

3 AE- After Effects

 

以下小編也推薦幾款UI設計的資源網站:

UIparade

UI Parade免費的線上網頁素材設計工具,提供Button按鈕、Form表單、Icon圖示、Ribbon絲帶製作器,讓你可以利用簡單的操作介面,輕鬆自訂元件的顏色、陰影、大小,快速創建漂亮的UI,然後再直接將產生的CSS與HTML程式碼複製到網站中使用。

使用介紹 ➡  點我觀看

MaterialUp

創意UI設計靈感分享網站,每週都會更新最新的網站、應用等創意設計,幫助設計師們尋找極富靈感思維的設計作品。是找創意和靈感的首選。

 

 

本文來源 达内UI培训UE培训 和 优逸客科技,經今日修改轉載,未經許可不得轉載、摘抄、複製及建立圖像等任何使用。
首圖來源 Photo by rawpixel on Unsplash


 

今日Summary

設計行業因網路的發達正飛速的進步,許多網路的視覺介面元素都需要設計師的參與,任何行業都脫離不了網路和設計,因此身為設計業的你,若不想被行業淘汰,只能順應著科技的發達,學習更多軟體技能,同時保留個人的設計風格,充實硬底子功力。

 

 

 

<延伸閱讀> 

【字體轉換】即時字體支援懶人包 拯救我的文宣設計

・【網頁設計】頁面區塊模組分佈邏輯 紮根網頁基本功