12個UI/UX設計工具神助攻,成為網頁設計大師真輕鬆!(1)

12個UI/UX設計工具神助攻,成為網頁設計大師真輕鬆!(1)

12個UI/UX設計工具神助攻,成為網頁設計大師真輕鬆!(1)
12個UI/UX設計工具神助攻,成為網頁設計大師真輕鬆!(1)

掌握好這12個超好用的UI/UX設計工具,要成為網頁設計大師真的超簡單啦!(1)



目錄

1. 網頁設計、網頁開發、UIUX是什麼?

1-1. 網頁設計 (Web Design) 

1-2. 網頁開發 (Web development) 

1-3. 使用者介面設計(UI設計,User Interface)

1-4. 使用者體驗設計(UX設計,User Experience)

2. Adobe XD:整合在雲端上的UI/UX設計

3. Figma:超人氣線上UI/UX設計

4. Webflow:網站編輯,所見即所得

5. Sketch:歷久不衰的經典UI/UX設計工具

6. Mockplus:跨部門神器,讓不同團隊的人都看的懂!

7. Claritee:不會設計仍可從零上手

8. InVision:讓團隊不失去方向,保持工作進度

9. Axure RP:我很醜,可是我有脈絡

10. Framer:解決溝通上的煩惱

11. Origami Studio 打造出 FB 與 IG 的UIUX設計

12. Marvel:產出APP的設計圖

13. Justinmind 節省UI/UX設計的時間

 

網頁設計、網頁開發、UIUX是什麼?

隨著科技的進步,手機介面也越做越人性化,美觀大方的頁面讓你一頁接著一頁的滑。這時你不禁會想:只要會做網站的話,就能輕鬆設計出這樣美觀的介面嗎?其實未必!網站設計與開發的領域其實可細分成使用者介面(UI)、使用者體驗(UX)、網頁設計(Web Design)和網頁開發(Web development)領域,簡介如下:

 

網頁設計 (Web Design) 

網頁設計是一個廣泛的類別總稱,涵蓋各種關於網站視覺效果、網站可用性的領域,包含UI/UX設計等。

 

網頁開發 (Web development) 

製作網站的技術端部分,專注於 coding,也就是擁有第一段所述「做網站」的能力。網站開發可以分為網頁「前端」和伺服器端的「後端」。

 

使用者介面設計(UI設計,User Interface)

網頁設計的項目之一,處理人們與網頁、app互動的元件如按鈕、手勢識別等。

 

使用者體驗設計(UX設計,User Experience)

另一個網頁設計的項目之一,處理用戶在使用網站或應用程序時的行為和感受。其實UX 設計的日常工作中,視覺表現只能算是其中的一個項目。他們需要針對用戶進行深度研究,可說是人類學、心理學、人因工程學等的跨領域學問。

 

一個手機版的網頁,為要兼顧兼顧便利及美觀,因此對於頁面的動線、順序、流程與使用細節上都需要重視。並確認UI所設計出來的視覺,能傳達UX設計師展示的路徑。簡單來說,UI設計傾向於眼睛所看見的「外在呈現」,UX則致力於使用者的「內在使用感受」。UI可以是將UX理念實踐的美學工程師,可以透過以下12款常見的原型設計平台來執行:

 

Adobe XD:整合在雲端上的UI/UX設計

全名為 Adobe Experience Design,是UI/UX設計師最常見的向量繪圖程式,如果原本在平面設計上習慣使用Adobe 出的 Photoshop或Illustrator等軟體,使用 Adobe XD 時對於其操作介面會更直觀、容易上手。

 

框線構成的形式,整合設計師的思維、現有的工作流程,設計出電腦版、行動裝置的網站介面,可以隨時將原型設計圖輸出,直接分享給其他人觀看與操作,即時接收回饋並且修改。

影片連結:https://youtu.be/h4D0GGlYL1o

 

 

下篇請看此連結

 

 

 

推薦文章:
介面、體驗大不同!UI設計/UX設計工作內容完整剖析


疫情加速電商衝擊店面!富比士:2021年5大UI/UX設計趨勢


使用 A/B 測試來改善網站 UI 設計的 30 個例子


UI/UX 按鈕設計基本7個原則,優化電商轉換率


蘋果靠AI偵測兒童情色照,卻讓人擔心隱私疑慮!(上)


沒人陪你聊心事?!臉書AI陪你談心還會記得你說的話!(上)


人工智慧技術大突破!冬奧將引AI裁判為選手評分?!

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *