除了 UI UX,還有哪種 設計師?讓科技業大佬告訴你

使用者介面、使用者體驗、視覺設計、互動設計、使用者研究員、前端工程師、產品設計師?這麼這麼多稱號,卻又聽起來差不多?到底誰是誰,工作職責又是什麼?Pixelapse 的共同創辦人 Lo Min Ming 藉由 Apple、Facebook、Google 等知名科技公司對設計職位的敘述,帶我們一窺不同職責 設計師 之間的差異吧!

圖片來源:http://www.rasmussen.edu/degrees/design/blog/ux-vs-ui-differences/
圖片來源:http://www.rasmussen.edu/degrees/design/blog/ux-vs-ui-differences/

 

沒錯!設計是一個相對廣泛且模糊的詞。當有人說:「我是一位設計師」時,其實無法立即判斷他的工作內容為何?事實上,「設計」這個詞可以劃分出多種不同的任務與責任歸屬。

不同產業需要不同專長的設計師,例如,工業設計(汽車、傢俱)、印刷設計(雜誌及其它出刊品)到科技領域(網頁、手機應用程式)等。近年來,由於科技公司興起投入開發與介面相關設計的潮流,許多新的設計職稱也應運而生,像是使用者體驗(UX)設計師或使用者介面(UI)設計師等職位。不過,往往讓非相關產業的人或其他領域的設計師們感到混淆。

那話不多說,讓我們試著釐清在科技產業中,這些職位的定義與職責吧!

 

UX 設計師 (使用者體驗設計師)

UX 設計師著重在「產品如何被感受」的議題上。設計是沒有單一的正確答案,而 UX 設計師會以跨領域的觀點來探索不同的解決方法,來處理明確的用戶問題。廣義的 UX 設計指的是確保產品的使用流程能依循邏輯性,一步一步地被串聯起來。其中一種研究方法,即透過使用者測試來觀察用戶行為,藉此找出使用者口頭表達及非口語表現出的使用障礙,接著進行一連串重複的設計改善,來創造出最棒的使用者體驗。譬如說,任務是為新用戶創造一段愉快的首次體驗流程。

 

定義互動模型 (interaction model)、用戶任務流程 (user task flow)、UI 規格。運用情境故事法 (Scenario)、端對端流程 (end-to-end)、互動模型 (interaction model) 及界面設計與關係利害人溝通。與創意總監及視覺設計師一起將 Twitter 的視覺識別融入產品特色中。開發並維護線框圖、原型與規格。

—— Twitter 的使用者體驗設計職位敘述

 

UX flow

產出:線框圖、故事板、網站地圖

工具:Photoshop、Sketch、Illustrator、Fireworks、InVision

你可能會聽到他們的設計師在工作時,有這樣的對話:「我們應該在使用者完成註冊後秀出感謝的頁面。」

 

UI 設計師 (使用者介面設計師)

相較於 UX 設計師著重產品整體的感受,UI 設計師更專注於「產品如何被呈現」。他們負責設計每個與使用者互動的頁面,並確保介面能將 UX 的設計流程視覺化。例如:UI 設計師建立了一個分析統計頁面(analytics dashboard),可能會把最重要的資訊預先載入,並放在頁面的上方;或選擇最能讓使用者直覺的方式調整圖表(使用 slider 或 control knob)。UI 設計師通常也必須負責整合設計風格並製作設計準則(style guideline),確保設計語言能一致地被用在不同產品中。保持視覺元素的一致性。此外,也需定義不同狀態的呈現方式,例如呈現錯誤或警告狀況。

 

發想概念並執行 Airbnb.com 的視覺語言,創造及提升全站的風格準則。

—— Airbnb 的 UI 設計師職位敘述

 

UI 和 UX 設計師的界線模糊,常見許多公司都會將兩者合而為一。

UI 介面

工具:Photoshop、Sketch、Illustrator、Fireworks

你可能會聽到他們的設計師在工作時,有這樣的對話:「註冊和登入的連結應該被移到畫面右上角。」

 

視覺設計師 (平面設計師)

視覺設計師致力於其他人忽略的小細節上。

視覺設計師是那位在像素之間細細琢磨的人(1 pixel 的堅持)。如果你問非設計背景的人:「設計師都在做什麼?」,這大概是他們腦中最先出現的畫面。視覺設計師的重心並非在介面間如何彼此連結、及產品與使用者之間如何互動。相反的,他們專注於創造美麗的圖標、按鈕、視覺元素及合適的文字編排。視覺設計師致力於其他人忽略的小細節上,而且經常在遊走在放大四倍到八倍的 Photoshop 畫面裡工作。

 

製作高品質視覺設計 — 從概念到執行,從桌機、網頁到行動裝置上的各種解析度的圖標、圖示及行銷材料。創造並重複演進改善反應品牌形象、強調品牌語言的元素,為產品注入美感與生命。

—— Google 的視覺設計師職位敘述

 

在業界, UI 設計師身兼視覺設計師也是常見的現象(介面 + 視覺)。不過,為求打造完美的設計,有些公司會選擇不將此兩種角色分開。

app_icons

工具:Photoshop、Sketch

你可能會聽到他們的設計師在工作時,有這樣的對話:「間距跑掉了!而且那個按鈕應該要往左偏移1 pixel!」

 

互動設計師 (動態設計師)

還記得 iphone 內建的郵件 app 中,有個下拉刷新頁面的細微彈跳動畫嗎?那就是動態設計師的工作。與處理靜態畫面的視覺設計師有所不同,動態設計師則是打造應用程式中的動態效果。他們負責處理「介面在使用者碰觸後的反應方式」。舉例來說,他們決定選單如何滑入、應該用什麼轉場效果、按鈕該如何扇出。互動設計相當重要,好的動態效果可告訴使用者產品的使用線索。

 

專長於平面設計、動態設計、數位藝術。對字體編排及顏色敏感。對材料、材質擁有廣泛的認知,並理解動畫實作。必須懂 iOS、OS X、Photoshop, Illustrator,並熟悉 Director(或同等)、Quartz Composer(或同等)、3D 電腦建模及動態圖像設計。

—— Apple 的互動設計師職位敘述

 

3032719-inline-orig3914796

工具:AfterEffects、Core Composer、Flash、Origami

你可能會聽到他們的設計師在工作時,有這樣的對話:「選單應該要從左邊以 800ms 的速度漸快進入。」

 

使用者體驗研究員 (使用者研究員)

使用者體驗研究員是用戶需求的擁護者。研究員的目標是回答這兩個問題:「誰是我們的用戶?」、「用戶要什麼?」。一般來說,這個角色必須訪談使用者、研究市場數據並蒐集調查結果。設計是一個持續演進的過程,在這個過程中,研究員可能透過執行 A/B 測試,來找出最能滿足用戶需求的設計。通常在大企業內,才能看到使用者體驗研究員,因為才有資源取得大量數據,讓他們有機會得到具有統計顯性的結論。

 

與產品團隊共同合作制訂研究主題、設計能找出使用者行為及態度的研究計畫。能以多種質性方法及一部份的量化方式(例如,調查研究)執行研究。

—— Facebook 的使用者體驗研究員職位敘述

 

有時也可見 UX 設計師兼任使用者體驗研究員的角色。

產出:人物誌 (Persona)、A/B 測試結果、調查研究 (Investigative study)、訪談

工具:麥克風、紙、文件

你可能會聽到他們的設計師在工作時,有這樣的對話:「從研究結果來看,典型用戶會 …」

 

前端工程師 (UI 工程師)

前端工程師負責製做出能真正使用的產品介面。通常 UI 設計師將靜態原型 (mockup) 交給前端工程師後,工程師會將它轉成可使用、可互動的體驗。前端工程師也負責將動態設計師設計出的互動方式製作出來。

工具:CSS、HTML、JavaScript

你可能會聽到他們的設計師在工作時,有這樣的對話:「我用的是 960px、12 欄位的網格系統」

 

產品設計師

產品設計師是一個包山包海的詞,通常用來描述創造產品外觀和感覺的設計師。產品設計師的角色尚未被完善定義,並且不同公司的認定也不盡相同。產品設計師可能也寫一些前端程式碼、執行使用者研究、設計介面或視覺元素。從專案開始到結束,產品設計師幫助定義問題、設定評量的基準、執行設計、測試、反覆演進改善解決方法。在一些想要讓各設計角色之間能流暢合作的公司裡,會傾向設立這個職位,以鼓勵整個設計團隊集結起來,共同開發使用者經驗、使用者研究和視覺元素。

有些公司會以「使用者體驗設計師」或者單純以「設計師」表達。我們必須細看職位說明,才能清楚了解一間公司究竟如何劃分與定義不同的設計責任。

 

負責設計的所有面向:互動、視覺、產品、原型。創造最終呈現的原型 (mockup)、為網頁及手機版的新功能編寫程式碼。

—— Pinterest 的產品設計師職位敘述

 


 

“我想要找設計師”

這是我從新創公司口中最常聽到的一句話,其實他們通常要找的是一位可以做上述所有事情的人(就像有些公司要找全端工程師)。譬如,這個 設計師 要做出精美的 icon、做出經過 A/B 測試的 Landing Page、有邏輯的將 UI 元件配製於頁面上並且偶而支援一些前端的開發。如上述,設計師在科技業中,有不同的職稱與工作定義。也因此,我們常會聽到小公司要求雇用一位「設計師」,而非針對公司需求而找的專職設計師。

然而,上述的各種設計師的工作內容並非絕對,有些 UX 設計師被期待能做互動設計,通常 UI 設計師也被期待能做出真實產品。找到對的人的最好方法,就是描述你希望在公司開發的流程中,希望 設計師 做什麼,接著再挑選一位最適合的職稱。

 

本文章已獲得作者授權,翻譯自:UI, UX: Who Does What? A Designer’s Guide To The Tech Industry by Lo Min Ming,原文出處 Fast company

 

本文章所屬設計大舌頭與作者所有,未經授權,不得轉載!如需轉載,煩請通知

其他人也看了這些 ...

訂閱設計大舌頭

隨時關注第一手 UX、UI、科技、設計新知

Share on facebook
Facebook
Share on linkedin
LinkedIn
Share on telegram
Telegram
Share on twitter
Twitter