娶了小老婆Aprilia的Python工程師

UI/UX 按鈕設計掌握7招,提高電商轉換率(下)

疫情時代!富比士:2021年5大UI/UX設計趨勢(上)

UI/UX 按鈕設計基本7招式,優化電商轉換率(上)

2021年最好用的12個UI/UX設計工具(3)

小編在此整理2021年最好用12個UI/UX設計工具!快來看看!!(3)

本文為下篇，上篇請看此連結

Claritee：不會設計仍可從零上手

一款智慧型線框圖UI/UX設計工具，可將想法轉換為可視線框圖，是產品開發的關鍵一步，因為它提供一種低成本的可視化方法，無論設計者僅完成單個頁面還是整個網站，都可自動查看互動式原型。團隊可確認投入時間和資源創建過程中，能在原型設計呈現前解決問題。

InVision：讓團隊不失去方向，保持工作進度

在繁雜的團隊工作中，日復一日，總容易迷失與工作效率低落，藉由這一款強化團隊溝通互動的原型UI/UX設計平台，簡化工作流程、掌握整體專案進度，縮短工作的流程與溝通。InVision提供從線框圖轉換到UI設計所需的所有元素，輕鬆實現團隊合作的呈現和原型設計。同時支持即時設計修改和收集團隊的快速反饋，設計師通常也會用來管理自己的工作流程。

Axure RP：我很醜，可是我有脈絡

有別於Sketch介面的美觀，Axure更專注在使用者互動上，兩者各有特點，但剛開始學習UI/UX設計容易過於注重表面的視覺呈現 (Visual Design) 而非核心的使用者需求 (User Needs)。Axure 的簡陋反而讓使用者能夠在產品設計前期排除視覺紛擾、專注在真正重要的事情上，快速繪製低擬真 (low-fidelity) 的 Wireframe，同時也可以做到中高擬真 (mid- to high-fidelity) 的互動原型 (Prototype)。

Axure RP將 SVG 導入、Sketch 和Adobe XD集成與原型製作功能相結合。可輕鬆的將Adobe XD和Draw共享Axure RP原型和畫板，並在螢幕頂部收集輸入。可檢查佈局介面、獲取CSS片段和下載，同時將靜態圖像轉換為動態Axure Cloud原型。Axure RP還增加綜合文檔、自動化紅線和更完整的移交給開發人員，無需程式語言。

Framer：解決溝通上的煩惱

製作UI/UX設計原型最重要的目的就是「溝通」，近年來許多設計流程裡，開始重視”原型”的重要性，使用Framer原型設計中，使用者可以基礎的想法驗證，再根據測試結果來修正設計方向。這樣的測試循環，可有效降低部分設計錯誤。Framer所撰寫的語言則是 CoffeeScript，因此它的程式語言非常接近口語。但使用介面與工作流程對初學者會有點複雜，需要開發人員和設計師投入大量時間來學習他們的方法。

下篇請看此連結

UI/UX 按鈕設計掌握7招,提高電商轉換率(下)

UI/UX 按鈕設計掌握7原則,優化電商轉換率(上)

富比士:2021年5大UI/UX設計趨勢(下)

2021年最好用的12個UI/UX設計工具(2)

小編在此整理2021年最好用12個UI/UX設計工具!快來看看!!(2)

本文為下篇，上篇請看此連結

Figma：超人氣線上UI/UX設計

在和團隊討論進行時，腦袋靈光一現便可立即記錄下來的線上工具，擁有自由拖曳的編輯器、框線創建，輕輕鬆鬆就將溝通內容即時落實在高擬真度的原型設計中！不僅如此，內建的動畫素材增添身歷其境的呈現效果。

Figma 從推出至今，愈來愈受到UI/UX設計師的青睞。這一款基於瀏覽器的協作式設計工具雖被廣泛稱為UX設計應用程式，但也可使用於快速原型設計的軟體。其他功能包括 Figmotion 和 Autoflow 等外掛程式及Arc Tool和Vector Networks 的可用性。

Webflow：網站編輯，所見即所得

近來流行的線上網頁架站平台，使用者大多介於「外行平面設計師」及「專業網站工程師」之間，即使不會 Coding 和切版，仍可輕鬆建置出個人風格強烈的網站。此平台提供乾淨、語意化的程式語言和設計加速開發人員的工作，內建程式為大眾皆可使用的零編碼，設計者便可直接創建網站的功能與版型，Webflow 會自動轉換為線上可使用的網站，因此不用等全部架構設計完成，便可即時看見在網路上的呈現。

Sketch：歷久不衰的經典UI/UX設計工具

以簡單功能與UI設計專門為訴求，早期成為UI/UX設計師慣用軟體，較資深的設計者大多首選以此為主軸的設計流程。可創建各種形式的使用者介面，例如瀏覽器、行動裝置或程式的按鍵執行，因此使用者已達全球數百萬工程師。

Sketch提供流暢的設計介面與豐富的繪圖功能，設計師可創建高質量圖像。強調介面性能的Sketch和可跨平台線上使用的Figma雖不同特點，但能使設計者專注、快速的解決問題才是重點。

Mockplus：跨部門神器，讓不同團隊的人都看的懂！

簡潔易用並專注於原型設計的UI/UX設計軟體，非常適合跨團隊協作。可幫助專案企劃有效的溝通網頁功能、軟體介面、App 互動，透過畫出原型，讓產品經理、設計師、程式開發、主管、客戶之間能夠了解產品本身的使用流程，把想像或文字化為具體可用的示範。

Mockplus支援不同平台 Axure、Sketch、Adobe Photoshop、Figma and Adobe XD匯入原型設計。同時支援電腦版Windows和Mac的桌面應用程式及行動裝置系統iOS和Android應用程式，所有項目同步到 Mock PlusCloud，快速的組合中就能產生可以互動操作的原型圖。

下篇請看此連結

UI/UX 按鈕設計'掌握7招,提高電商轉換率(上)

疫情時代!富比士:2021年5大UI/UX設計趨勢(上)

富比士:2021年5大UI/UX設計趨勢(下)

2021年最好用的12個UI/UX設計工具(1)

小編在此整理2021年最好用12個UI/UX設計工具!快來看看!!(1)

網頁設計、網頁開發、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

下篇請看此連結