Quantcast
Channel: 嫁給 RD 的 UI Designer
Viewing all 448 articles
Browse latest View live

千萬不要這樣幹的簡歷與面試過程-1

$
0
0

群裡有位特別的設計主管,我們看到他浮出水面都會纏著他問最近收到什麼簡歷、又面試到什麼樣的人。這位主管大概天生專門吸引奇葩,看他面試新人這麼久,就是遇不到個正常人。

乾脆整理一下,讓大家看看面無表情麻木不仁的面試官是怎麼被逼出來的。想當年他剛入群時還是位青春活潑少年郎呢…

以下是我篩選出來的群裡對話。大部份出自那位面試官口中。


「想讓人事下次教育經歷時間都寫錯的直接刷掉算我太嚴格嗎?」
「看見這種錯誤想讓別來了。」
「簡歷一點工作經驗也沒寫。」
「附上作品集是常識吧。」


「人事來個簡歷,2015年畢業的。」
「基本流程和該有的全放上面了。」
「但感覺這麼短時間內全部拿下,時間上可能性不高。」
「就像是大項目她參與了一部份,把全部內容都放到自己作品集了的感覺。」


「說了一堆沒用的感覺…」

「都畢業這麼久了,在學時期得獎就別寫了吧。」
「培訓中心也別寫,感覺水。」
「這樣的文字簡歷我基本不會看,就看工作經歷那邊。」


「剛面試完,感覺像是培訓班出來的。」
「畢業一年不到、作品集一堆,該有的全有。」
「妹子說自己畢業前實習了三個月的電商,做 xx 廣告。」
「給了原始檔,打開圖層全是英文和中文名混雜。」
「估計是下的 psd 改的。」


「最後我問了個問題,你自己平時手機玩的有比較喜歡或者覺得交互做得很棒的APP有哪些?」
「妹子說不怎麼玩,主要做公司專案和學習,不怎麼玩APP…」
「這基本判斷其他都是假的吧?」
「說是很喜歡交互設計,但居然說不出來自己喜歡的一兩個app?」


「10 年經驗,寫設計經理、產品經理、互動設計都能幹。」
「但我一看作品,感覺跟 5 年的常規差不多。」
「主要作品覺得有點太水。」
「我現在總結了,先直接看作品聊作品。」
「然後讓講幾個自己手機平時把玩覺得比較優質的應用。」
「如果作品很豐富但對app不能簡單講出來自己的判斷,也是個雷感覺。」


「人事撇過來簡歷。」
「發現作品集裡有網路上別人的作品,這個直接刷掉吧。」
「培訓班貌似都不教學生設計規範。」
「出一堆帶模板的視覺效果。」

「還有這種,網上一模一樣的老外作品。」
「膽真肥!」



「看見這就不想讓她來面試了…」


「面試到現在,發現還是得重思路和流程。」
「視覺真的很表層,半天看不出多少。」
「但是聊思路和流程立馬就知道到底有料沒。」
「視覺可以抄、或者改。」


「不要再抄這張圖了,泥馬已經看到 3 個人說這他畫的!」
http://creaturebox.com/
「以圖搜圖很容易的。」


「像 Lee 姐說的,最重要的還是想法和流程這些展示。」
「純視覺稿太初級了,不好判斷是個什麼情況。」
「再就是,面試官貌似看作品的時候都很倉促。」
「所以不要放太多作品。」

「還有這種命名…」
「合作的說明下就行,但見到很多說自己作品的,問細才說是合作,也說不清楚哪部份是自己的。」

「我問這個趨勢圖表做設計時和開發怎麼溝通的。」
「說他們公司只負責視覺外包。」
「客戶自己找開發團隊實現。」
「我問那最後實現出來沒、上線了嗎,說不知道…」


「今天面試的年輕人,一個挺帥的,一個挺美的。」
「然後公司的測試那邊和運營那邊私聊我說趕緊招進來…」


備註

才爬了一個半月的對話紀錄就有一大堆可以整理,本來想拆成上、中、下三篇應該可以寫得完…搞不好還不夠= =

各位笑歸笑,自己的簡歷千萬不要這要搞,面試的時候請好好和對方交談啊。


勸敗!文字插畫設計線上教學

$
0
0

Marcelo Schultz 是位巴西設計師,他的作品相信有在翻 Behance 或 Dribbble 的人大多看過。風格強烈讓人印象深刻,同時也是少數我喜歡到有把他記住的大師級人物。

上個月看到他在做調查,說即將推出線上教學,有興趣的人請留下 Mail,二話不說馬上填好資料。推出教學的當天我就掏錢結帳了…

線上教學官方網頁: Curso Online de Lettering “Do Sketch ao Digital”

對設計師來說,作品集扔出來馬上知道水平。Marcelo Schultz …直接看他的作品吧,應該也不用我多介紹了,就是位世界級高手。


Marcelo Schultz - Dribbble


Marcelo Schultz on Behance

關於課程

課程費用 US$ 97.00,大約台幣 3,100 左右。可以看到 8 堂課, 7 個多小時的影片。

  • 材質與重要性
  • 插畫及工藝
  • 素描與刻字
  • 視角的概念 - 3D
  • 光照概念 - 光與影
  • 從草圖到數字 - 向量
  • Photoshop:光與影刻字
  • 紋理和表面處理

所有影片都是「葡萄牙語」,沒有字幕,不要問我為什麼巴西人講葡萄牙語,也不要問聽不懂怎麼辦。

課程進行一個段落後,Marcelo Schultz 會出作業,學員可以把作業寄給他講評。不過作業題目是用葡萄牙語寫的,還存成一張.jpg 圖,我得自己手工打一遍扔去 Google 翻譯才看懂作業內容。

看起來有交作業完成課程的會獲得他親筆簽名的結業證書一張,不過我的作業畫得很醜正努力練習還沒寄,不確定最後會收到什麼。

上課心得

反正葡萄牙語完全聽不懂,我就把聲音關了配飯、或是睡前催眠看(喂)。前半段在教素描、手繪字體、透視的部份因為語言不通,只能透過動作和繪圖過程來猜測他在講什麼,有看但不知道有沒有懂。

進到電繪階段,只要有點 PS 和 AI 基礎的人都能看懂他在做什麼,個人覺得在刻圖技術上大有斬獲。

問我推不推薦買…我在上線的當天就買了,還把所有影片全看過才來寫文,不推的話我寫這篇幹嘛?

光電繪那部份就非常值得了,世界級高手的經驗+技巧啊!

備註

任何有關課程、付費、語言不通、身高體重、安安你好給虧嗎之類疑難雜症,請去 Marcelo Schultz 的 FB 粉絲團 https://www.facebook.com/schultzdzn/直接找當事人處理。

線上教學官方網頁: Curso Online de Lettering “Do Sketch ao Digital”

先瞭解使用者操作,還是先畫 Wireframe?

$
0
0

設計 UI 的思考順序各位覺得該是什麼樣子的呢?

  1. 先出 Wireframe,再來想使用者會怎麼操作。
  2. 先確認使用者會怎麼使用產品功能,再來思考 Wireframe 怎麼畫。

課堂上我很強烈要求學員,做任何思考都要有「依據」,沒有依據憑空想像出來的設計很容易被推翻,也無法說服別人、讓別人理解自己的思考邏輯和原因。所以我的答案會是「2」,先確認使用者會怎麼使用產品功能,再來思考 Wireframe 怎麼畫。

如果你有了功能,就直接開畫 Wireframe ,再拿 Wireframe 來確認使用者怎麼操作功能,恭喜,你會陷入無限漏圖補畫面的囧境。

使者怎麼操作功能這件事和視覺沒有絕對的關係,「操作功能」和使用者的邏輯比較有關。今天在什麼畫面都不給你的情況下,要你憑空說出「會員註冊」的操作流程,你會怎麼思考?

(請不要腦海裡浮現某某網站或 App 的註冊頁畫面…)

以下是某篇文的訪客留言

1.UI Flow 主要就是規劃頁面層級的彼此關係, 所以在其上並不會規劃其頁面中有哪些哪些內容, 因為那些”內容”並不是頁面, 除非那些”內容”有個整體概念(例如使用者點擊頁面上某個按鈕跳出Contact相關的資訊, 但不會從UI Flow上知道Contact裡具體包含什麼) ?

內容=文字、圖片、聲音、影片。
光 UI Flow 這份文件,的確看不出來這一頁包含哪些「內容」。

但是所有的文件都不是獨立存在,每一份文件皆環環相扣關連性很大。當你在看 UI Flow 時,要把其他文件攤在桌上一起對照。參考 讀者來信:UI 設計流程

從上圖中可以看到 UI Flow 在塔中間位置,下方還有 User Story、Functional Map、Flow Chart 這三份文件。更多關於 UX 研究的文件我就沒列入了。

即使 UI Flow 看不到「內容」,但其他文件會補完這個部分。

2.其實UI Flow就是在規劃頁面了, 到底一個網站會有哪些頁面, 就是這時候要規劃完畢(當然之後有可能會因為討論Wireframe後回來再修), 其實在UI Flow之前的所有規劃也不見得很具體知道需要哪些頁面, 例如在Functional map也是整理歸納顧客想在這個網站內包含的內容, 以及功能, 除非他自己有說我一定要有什麼什麼頁面, 而且裡面要有什麼資訊, 不然在UI Flow階段, 這時候頁面到底有幾層, 有哪些, 都必須自己想 ?

你忘記有 Flow Chart這份文件了。有寫 Flow Chart,根本不用煩惱 UI Flow 怎麼生出來。

本文一開始我就有提到,做設計有「依據」,沒有依據或跳過步驟就會發生「不知道資料怎麼來」、「這玩意我要怎麼腦補生出來」的情況。

在「沒有 Flow Chart」的情況下就開始規劃 UI Flow,等於在自己不曉得功能和使用者之間的關係、不知道使用者怎麼操作功能、不知道使用者在操作任務過程中會發生什麼事,就要思考要提供哪些頁面給使用者…通靈啊!

(當年我在不知道 Flow Chart 的時候也是有了功能就直接跳去 UI Flow…事後補畫面補到死各種出包漏東西。驚覺自己肯定忽略什麼不然怎麼 UI Flow 可以用這麼沒頭沒尾的方式冒出來,圖還畫得這麼痛苦。)

就 UI Designer 的角度可以把 Flow Chart 看成「這個情境下使用者怎麼操作完成任務、軟體怎麼回應」,把 UI Flow 延伸為「因為使用者這樣操作、以及我們有這些功能和資訊要呈現,所以頁面和頁面之間如此串接」。

請參考 Flow Chart 和 UI Flow這篇文,有 Flow Chart 的圖例。

如果先畫 Wireframe 再來思考使用者怎麼操作呢?

這和「精心準備菲力牛排招待客人,但客人不吃牛肉」有什麼不一樣啊?

「對~我們猜使用者會怎麼操作,畫了這些 Wireframe,再做 Prototype 讓使用者實測驗證,就不會出錯了唷~」

除非是已經套程式的 Prototype ,不然測不出「錯誤狀態」的啦,不要以為什麼都可以靠使用者測試找出問題好嗎?而且專案都進行到做套程式階段,再來抓漏不覺得太晚了嗎?萬一測出來發現有問題,打掉重練?當套程式的 RD 吃飽很閒嗎?沒事就陪著 UI 一起改來改去?

為什麼不一開始就調查好客人不吃牛,都上菜了才發現他不能吃,連忙補洞生出其他料理充數?

現在 UI、UX、UCD 什麼的一堆新興名詞,都在強調「以使用者為中心」,依使用者的操作習慣去設計。然後在畫 Wirefream 上卻是自己先弄個什麼出來再來想使用者怎麼操作,順序錯了吧。

套一句去年我在 Mopcon 演講的內容:「有這個功能,我們產品一定會大賣啊!」

最好有功能就會賣,使用者要的不是功能,要的是解決他問題的方法。

「有畫 Wireframe,使用者就會配合操作啊!」
「我們要教育使用者!」

所以你知道產品功能怎麼解決使用者的問題、使用者如何操作產品完成任務的操作流程沒有?

沒有,我只是負責畫 UI 撸圖的。

UX 研究方法實戰班 延伸思考

$
0
0

第一屆 UX 研究方法實戰班告一段落了,感謝這班學員的心得回應。我想講的東西太多,時間太少,壓縮到分組討論和實作的部份。這篇文就來講講為什麼我會這樣子規劃課程。

UX 這詞現在潮到不行,似乎行銷品牌資訊服務都不和 UX 沾點關係就會覺得跟不上時代。網路上太多文章講得很高空,把 UX 當成沒有結構和邏輯的東西等等…所以那堆 UX 研究方法做實驗算數據是神主牌嗎?供起來早晚三柱香有拜有保祐?

可以參考課程大綱,既然是做使用者「研究」,就要提「方法」和「方法論」。所以一定要跟學員說明清楚「How、What、Why」。

  • 什麼是 UX
  • 專案開發流程
  • 研究方法:AEIOU
  • 研究方法:人物誌
  • 研究方法:情境故事法
  • 研究方法:使用者旅程圖
  • 研究方法:利害人關係圖
  • User Story
  • 研究方法:狩野分析
  • Prototype 介紹
  • 研究方法:使用者測試

什麼是 UX

首先,如果連「使用者經驗」是什麼都尚未釐清楚,之後課程全部不用玩了。

根據使用者導向設計一書中指出:使用者經驗(UX)是使用者導向設計所關注的主題之一。它是使用者對產品整體的體驗,包含了生理和情感的感受與反應。

UX 設計之道:以用戶體驗為中心的 Web 設計一書中則說明使用者經驗設計是為特定對象創建並安排使用者體驗相關要素,以影響他們的認知和行為。包含產品或公司進行互動的其他接觸點。

我都告訴學員「UX 不是只存在於手機或網站上,而是日常生活的一切,用自己的生活來代入,會學的更快」。如果能體認到這一點,更容易理解「我遇到什麼問題」、「為什麼會選擇用這種研究方法」、「這種研究方法能怎麼幫助我找到答案」這樣子的思考方式。

專案開發流程

來上課的幾乎都是業界人士,在專案執行上會遇到各種困難,最直接的就是「如何把使用者經驗設計融入專案開發流程」。但在回答這個問題前,必須先了解專案開發流程。

專案開發中有哪些階段、產出什麼文件、大公司和小公司的差異、接案與自有產品、新產品與改版…等等,專案開發沒有「一定要這樣做」的方式,只有「這樣做比較適合」。

我也只能舉出數個開發流程的範例,說明一定要做的部份,以及為什麼該公司會用這種作法。每間公司都有不同的企業文化和制度,不能照抄別人的。(要抄也要先了解對方為什麼這樣做再抄啊!)

研究方法:AEIOU

產品開發可以粗略分成 2 類:新產品、舊有改版。UX 研究方法實戰班中教的所有方法不管是新產品、舊有改版都可以活用。

不管是新產品開發或舊有產品改版,都會遇到同一個問題:你怎麼知道使用者需要什麼?他遇到什麼困難或麻煩待解決?

當然是蹲在現場觀察使用者的行為、習慣,進行使用者訪談

沒有現場觀察使用者,怎麼會知道使用者真實狀況?猜看看?就算是客服人員回報使用者客訴,也要去現場確認實際狀況。

好,我們到了現場,然後呢?要怎麼觀察?終於有個光明正大的理由可以專挑帥哥美女搭訕了?

AEIOU 其實是種「觀察與訪談」的方法,網路上很容易找到記錄表單,從「活動、環境、互動、物件、使用者」這 5 個部分著手,可以清楚了解使用者有關的人事物。

研究方法:人物誌

課前報名表單上滿多學員提到「即使做了 Persona 仍然失敗,產品開發方向沒辦法照著期望進行」。首先我會問的問題就是:「你的 Persona 依據怎麼來?」

Persona 最常見的失敗原因之一就是「沒有參考價值」,大家對目標族群的認知有落差,即使有了結論擺在那兒,但說服力不足,無法讓全體專案成員相信「他就是我們的目標」。

這就是為什麼我會安排「AEIOU」的原因,當觀察夠多人後,才有辦法從中發現共通性,進而整理成範本。

實地觀察使用者、將使用者的共通性整理成一個或數個 Persona,足以代表產品的目標族群。

研究方法:情境故事法

這也是我會問「你怎麼知道使用者會在這種情況下如此操作」的狀況。沒有實地觀察使用者,就是猜猜看。猜對了很好,猜錯不也很理所當然嗎?

「AEIOU」從「活動、環境、互動、物件、使用者」這 5 個層面觀察或訪談使用者,才有真實情況的資料模擬使用者的操作情境。

有本很硬的書「為真實世界設計」,就字面上來看…沒有去現場觀察使用者,怎麼為「真實的使用者」做設計?

研究方法:使用者旅程圖

這大概是我最喜歡帶學員做的研究方法之一了,新鮮有趣好玩,成果又很容易看見。

目標族群(Persona)在執行某項任務中遇到個各種狀況(Scenarios)和行為、情緒變化。從中發掘使用者的痛點。

各位在看網路文章的時候,會不會冒出這種疑問:「使用者的痛點怎麼來?怎麼找到?」

使用者旅程圖是個進可攻退可守,要難可難要簡單可簡單的研究方法。結合 Persona 和 Scenarios,可以看到「使用者遇到什麼狀況」、「我們該怎麼幫助使用者」。

我很討厭把研究方法講的很學術很硬,太硬的東西很難推廣,在講完很硬的使用者旅程圖版本後給學員操作的當然是簡化過的歡樂版,不那麼制式化,大家可以玩得很開心但該有的通通都有。

(學員上完課回公司很有可能要帶團隊跑一次,初學者操作簡化版的使用者旅程圖成功率比較高,比一開始就來硬的好上手。看到成果之後要在公司內部推動和 UX 有關的改變會更容易。)

研究方法:利害人關係圖

「設計師容易忽視產品以外的人事物」,這是我的刻板印象。所以我排了這個研究方法,希望學員能注意到產品和使用者以外的部份。

一開始在說明「什麼是 UX」時就提到 UX 設計包含產品或公司進行互動的其他接觸點。利害人關係圖能發現使用者和產品之間的關係,找出哪些人事和設計結果利害相關的重要組成份子。

講個實際點的,要如何降低一項決策被推翻的機率?站在對方立場思考、讓對方覺得這項決策對自己有益,就能降低被推翻的機率。但對 A 好的決策 B 搞不好會大力反對,如果能越早了解是不是就能在各種限制下找出大家都能接受的方案?

User Story

剛做了那麼多研究方法、找出使用者的痛點,我們要怎麼將其整理成使用者需求?再從使用者需求變成功能需求?這些已經很麻煩了,更麻煩的是專案成員對「需求」、「功能」認知上的不同,光是溝通就飽了。所以需要 User Story 幫助團隊建立共識、並從中排定開發優先順序。

使用者需求 = 使用者要什麼
功能需求 = App 要什麼

(順便念兩句,使用者故事對照是本好書,但寫得太瑣碎零散,閱讀得有點痛苦。)

研究方法:狩野分析

這時候就得提一下「MVP 最小可行性產品」了,不是使用者要什麼開發者一次做到好全包啊!事情總有輕重緩急的。

問題又來了,你認知的輕重緩急和我認知的輕重緩急一樣嗎?

狩野分析是種可以幫助開發者釐清功能重要度、排定工作優先順序的方法。不難,就是要做點統計算點數學。

Prototype 介紹

功能能確定後下一步是什麼?動手寫程式畫圖寫文件等等,這部份在 UX 研究方法實戰班不提,來到使用者測試階段。

做使用者測試前要先了解 Prototype。Prototype 也分很多種,不是越擬真的越好,要依時間、資源、需求等限制,製作不同的 Prototype。

注意:如果要測試使用者操作「錯誤狀態」,只有和工程師合作、已套程式的 Prototype 才測的出來,很費工花時間,最好在產品開發初期就畫 Flow Chart 確保各種狀態都有規劃考慮到,不要拖到最後一刻。

研究方法:使用者測試

未上架產品可能拿 Prototype 、要改版的產品可能直接拿線上那個,總之要有個東西讓使用者實際操作看看。

使用者測試往往會配合使用者訪談。事前需要準備問卷,問卷怎麼設計,怎麼訪談、要問什麼問題也需要點技巧。

要問使用者「開放式」的問題,不能誘導或二選一。

問:「你喜歡養貓還是養狗?」
使用者:(我不能喜歡養魚嗎?)

測試前、中、後,事情的準備、訪談、使用者的反應等等,要注意的細節很多。我直接讓學員跑 2 次實驗,輪流當受訪者和記錄者,會更清楚使用者測試該怎麼著手。

最後

其實啊~這些研究方法都不重要,重要的是要知道自己現在遇到什麼問題。連現在遇到什麼問題都不知道,連挑研究方法來解決的機會都沒有。

所以在課堂上,比起教學員怎麼執行研究方法,我更看重「現在遇到什麼問題」、「為什麼選擇這個方法」、「它能怎麼解決問題」、「下一步是什麼」。

UX 研究方法非常多種,而且一直在變化出新款,追不完的啦!請挑適合自己現況的來用,不是「因為大家都這樣做所以我也跟著做」。這就像有人在北投公園隨便大喊一聲「有卡比獸」然後看著一群人衝來…

2016 年 38 本好書推薦

$
0
0

最近又買了個書櫃,之前還很開心櫃子有空間能夠買買買,然後就買爆了…最大的問題還不是買爆,而是書太多做筆記很辛苦、時間不夠用,體力也不夠。所以買了支蒙恬掃譯筆,加快做筆記的速度。

個人閱讀習慣

我一個月大約會買 5 ~ 10 本書,入手當下就急著全部看完。導致一本書在手上至少會看 3 次,不然囫圇吞棗吸收效率太慘。

  • 第一遍速讀。
    內容較輕鬆的書是用頁當單位,視線掃斜對角在閱讀。求在最短時間內知道這本書在幹嘛。

  • 第二遍畫重點。
    因為已經大略知道這本書在講什麼了,第二遍會重點畫螢光筆記號。可以加深印象,之後複習時能更快找到目標。

  • 第三遍做筆記。
    以前傻傻的手工打字,慢死了。買了掃譯筆,用掃的比較快。存進 Evernote 還可以用關鍵字搜尋,省得之後寫文做簡報需要參考資料時翻不到。


以下書單依個人喜好分類評星等,優劣和排列順序無關。我覺得很棒的書不一定符合你胃口。

推薦度:推薦你買的程度
難易度:給初學者還是資深人員看的

我有把握只要是繁體中文的 UI/UX 書,4 年內出版的全部翻過。所以這份書單列出來的都是 1.我看完了 2.值得買且都是我自己掏錢的 3.覺得幸好我有買的書。

(不要問我某本書值不值得買,買書是投資自己的最便宜方式了,買買買。)

UX 設計

設計的方法

Universal Methods of Design
貝拉。馬汀(Bella Martin)布魯斯。漢寧頓(Bruce Hanington)
推薦度 ★★★★★
難易度 ★★

(開啥玩笑,做 UX 設計的不買這本?不然你要買啥?目前市面上所有中文 UX 書如果只能買一本,就是這本了。)


UX 策略 設計讓人夢寐以求的創新數位產品

Jaime Levy
推薦度 ★★★★
難易度 ★★★

(這本比較適合設計部主管或公司創辦人看,前半本在講公司策略,後半本才在說明使用者研究方法。很詳細實用。)


行為改變科學的實務設計 活用心理學與行為經濟學

Sthen Wendel
推薦度 ★★★
難易度 ★

(非常非常非常詳細地說明使用者的行為和認知心理學、UX 研究方法、測試實驗,一小部份在講研究完使用者後怎麼做專案生出產品。)


圖解設計思考:好設計,原來是這樣想出來的

GRAPHIC DESIGN THINKING: BEYOUND BRAINSTORMING
推薦度 ★★★
難易度 ★★

(圖大漂亮是這本書的特色,研究方法講得比較淺,附帶不少案例。)


設計思考改造世界

Tim Brown
推薦度 ★★★
難易度 ★★★★

(推過很多次這本書,但它不適合初學者。書裡講的是種「概念」,是戰略不是戰術,雖然舉了很多例子,但看完只能喊喊口號,除非公司你說了算。)

Donald A. Norman

就是位大神,在國外念設計的朋友說,學校開出來的書單有好幾本他的著作。所以各位就看吧,雖然看完對目前手頭上的工作沒有太大的幫助。他的書主要在「建立觀念」,就是看得當下懂懂懂,自己可以怎麼做,不知道。但之後某一天突然被雷劈到,想通為什麼他會這樣寫、自己可以用什麼方式實踐的觀念。

好設計不簡單 和設計師聯手馴服複雜科技,享受豐富生活

設計的心理學一人性化的產品設計如何改變世界

情感 @ 設計 為什麼有些設計讓你一眼就愛上

一貫他的文風,一些實例、一些很硬的理論、講講故事…非常適合拿來當大學的上課教材,光一個章節就能延伸很多方向出來,夠學生每週交報告傷透腦筋了。

互動設計

微互動 Microinteractions

Dan Saffer
推薦度 ★★★★★
難易度 ★★★

(互動設計這本必買!我上課拿這本當教材的。舉例很多,但光看書很難融會貫通,搭配 Flow Chart 會好懂一些。)


行動介面設計模式

Designing Mobile Interfaces
Steven Hoober、Eric Berkman
推薦度 ★★★★
難易度 ★

(雖然出版很久了,但初學者看這本還是能抄到些東西,實用。但 PM 也可能拿著這本跟你說我要 A+B+C+D…)


About Face 4:交互設計精髓

About Face 4: The Essentials of lnteraction Design
Alan Cooper
推薦度 ★★★★
難易度 ★★★★

(超棒的這本,寫得很細又很硬,厚得跟磚頭一樣,會邊看邊打瞌睡。要 UI 有 UI、技術有技術、要 UX 有 UX,包山包海的。)

UI 設計

不是你太笨,是爛UI的錯!非設計師也該學的產品設計常識

中村聰史
推薦度 ★★
難易度 ★

(各種爛 UI 的實例,講得非常淺顯易懂,超級初學者、PM、傳產老闆適用。)


打造最強網頁 UI/UX 設計腦:設計師都該懂的絕佳設計溝通法則

秋葉秀樹、秋葉ちひろ
推薦度 ★★★
難易度 ★

(之前在 FB 上推薦過,完全不懂 UI 的平面設計師想轉網頁設計的話可以看這本入門,切圖切到被 F2E 罵的設計師也請參考下。)


別做天兵設計!傾聽、思考、表達,滿足使用者體驗的 0 盲點設計關鍵

劉津、李月
推薦度 ★★★★
難易度 ★★

(大方向概論,包含一間公司的 UI 設計流程,適合 0~3 年左右的 UI 設計師。)

平面設計

創意設計的基礎訓練:100%的思考圖解力

原田泰
推薦度 ★★★
難易度 ★

(初學資訊視覺化,這本很不錯,從最簡單的手繪線條 icon 開始,教你怎麼表達。)


設計的邏輯: INFOGRAPHICS 深入人心的視覺法則

木村博之
推薦度 ★★★★
難易度 ★★★

(不愧是日本人寫的,針對各種資訊視覺化技巧分類,跟你說什麼情況下可以採用什麼圖表、用什麼方式表達。可以當成是上面那本「創意設計的基礎訓練:100%的思考圖解力」的跳級進階版。)


好 LOGO,如何想?如何做?

Logo Design Love A Guttle to Creating Iconic Brand Identities, Second edition
大衛.艾瑞 David Airey
推薦度 ★★★★★
難易度 ★

(不管是平面設計師還是 UI 設計師,我都大推這本,實例真的很實用秒懂,和客戶溝通的技巧是本書重點。只要你需要接案、提案,可以給你很大幫助。)

遊戲設計

触摸屏游戏设计

罗杰斯 Rogers,S
推薦度 ★★★★
難易度 ★

(想開發一款手機遊戲又不知道怎麼做,這本提供很多範例和思考方向、實作技巧。)


游戏设计的236个技巧:游戏机制、关卡设计和镜头门

大野功二
推薦度 ★★★
難易度 ★★★★

(硬得要死,看完會想對作者大喊「請收下我的膝蓋」。雖然有看沒有很懂,但書裡的例子我都很熟啊!比如魔兵驚天錄、生化危機、戰神…)


遊戲改變世界,讓現實更美好!

Reality Is Broken : Why Games Make Us Bener and How They Can Change the World
簡。麥戈尼格爾(Jane McGonigal)
推薦度 ★★★
難易度 ★★

(解釋為什麼大家願意出門走 10 KM 孵蛋、卻不願意為了健康運動…以及我們可以怎麼運用這樣的心理模型到產品裡。)

字體設計

設計師的字體應用術:117款設計師必知的好用字體造型辨識、實用圖例解析

The filed guide to typography: Typefaces in the urban landscape
彼得。道森(Peter Dawson)
推薦度 ★★★★★
難易度 ★

(就是本圖鑑,對於完全不熟字體的設計師們而言,非常實用。)


設計師的文字力:字型應用、字體設計與文字編排的法則

吉姆。克洛斯(Jim Krause)
推薦度 ★★★★
難易度 ★

(字體初學適用,圖很大、字很大,還講了一些字體可以怎麼變化的設計技巧。)

素描繪畫

念書時完全沒搞懂素描水彩怎麼回事,手繪一路爛到現在,我靠下列這幾本書和跑畫室練習,慢慢救回來了。想把素描畫好靠死命畫沒有用,照著大師建議的方法跟著做比蒙頭苦畫有效。(笨很久最近才開竅)

新手素描完全指南:人物、靜物、動物、場景、寫實—奇幻手繪神技

3DTotal Publishing
推薦度 ★★★★★
難易度 ★

(超高興有買這本,我靠這本救了我的爛素描(跪),短短 4 週進步超大的,有興趣知道我進步狀況的可以追蹤一下我的 Instagram。)


一枝鉛筆就能畫:30天一學會,超有趣又簡單的繪畫技巧

You Can Draw in 30 Days: The Fun, Easy Way to Learn to Draw in One Month or Less
馬克。奇斯勒(Mark Kistler)
推薦度 ★★★★★
難易度 ★

(非本科生想學素描繪畫,大推這本喔!乖乖跟著畫 30 天,效果很好。)


色彩與光線:每位創作人、設計人、藝術人都該有的手繪聖經

詹姆士。葛爾尼(James Gurney)
推薦度 ★★★★
難易度 ★★

(黑白素描之後就是研究色彩啦!這本大推!講很多技法,要跟著練喔~)


光。設計:光和色彩的藝術設計應用全書

Light for Visual Artists: Understanding — Using Light in Art — Design
李察。約特(Richard Yot)
推薦度 ★★★★
難易度 ★★

(光影變化在這本講得非常清楚,和上面那本可以一起配合著看唷!)

設計管理

設計的力量:如何讓百年老牌煥然一新

David Butler
推薦度 ★★★★
難易度 ★★

(這本推薦給所有設計部主管。書裡一章節一小個故事文筆輕鬆易讀,不只是有概念,還有一些實作的方法和技巧、思考方式。)


為什麼他接的案子比我多?設計業界潛規則,讓你接案上班都無往不利

Michael Jaoda
推薦度 ★★★★★
難易度 ★

(是位設計師就該入手!你知道這本的簡中版「设计之外——比修图更重要的111件事」書腰上有我的推薦嗎?快~去~買~吧~)


你該怎麼賣設計/瞭解、定義與行銷設計作品的價值

Jenn Visocky O‘Grady, Ken Visockyon Visocky O‘Grady
推薦度 ★★★
難易度 ★

(圖大、色彩強烈,雖然排版有點花,但內容還不錯,講得不深。)


設計創業學一成功設計師的自我經營寶典

大衛,艾瑞(David Airey)
推薦度 ★★★
難易度 ★

(當 SOHO 族、自己接案的設計師可以看看這本,初學者適用,教你怎麼「推銷」和賺錢。)


設計師求生實用指南

GRAPHICE DESIGN: A USER‘S MANUAL
艾德里安。蕭納希(Adrian Shaughnessy)
推薦度 ★★★★
難易度 ★★

(有點像是「設計詞典」,介紹一些業界常見用語,包含「客戶」。)

經營管理

使用者故事對照

User Story Mapping
Jeff Patton
推薦度 ★★★★★
難易度 ★

(專案管理,這本書把 User Story 寫得非常清楚,應該是為了初學者也能看懂,寫得頗囉嗦瑣碎…)


什麼才是最難的事/矽谷創投天王告訴你真實的經營智慧

THE HARD THING ABOUT HARD THINGS:Budding a Business When Tlzere Are No EasyAnswers
本。霍羅維茲(Ben Horowitz)
推薦度 ★★★
難易度 ★★

(公司經營,這本其實是給創業者看的,關於公司內部經營、員工管理、企業文化、專案執行流程等等。很有趣,是非管理職不會想像得到如此麻煩的另一個世界。)

思考邏輯

從 0 到 1 :打開世界運作的未知祕密,在意想不到之處發現價值

Zero to one : notes On startups, or how to build the Future
彼得。提爾(Peter Thiel),布雷克。馬斯特(Blake Masters)
推薦度 ★★★
難易度 ★★

(各種不同的角度去看待一件事情,用許多故事讓讀者覺得「還有這招喔…」)


思辨的檢查 有效解決問題的終生思考優化法則

麥可。卡雷特 MiChael Kallet
推薦度 ★★★★★
難易度 ★

(寫了很多可以跟著照做的流程和技巧,非常實用,但要習慣並使用這種思考方式需要長時間鍛鍊。)

有空閒可以瞧瞧的推薦設計書

為真實世界設計一人類生態與社會變遷

Design For The Real World: Human Ecology And Social Change
維克多。巴巴納克(Victor PaPanek)
推薦度 ★★★
難易度 ★★★★

(硬得要死的一本設計思考書,看一看會覺得:格物、致知、誠意、正心、修身、齊家、治國、平天下。)


創新科技設計 基因組學、機器人學與物聯網的 UX 設計

Jonathan Follett
推薦度 ★★★
難易度 ★★

(設計師看完此書,你會覺得自己好遜什麼都不會。但工程師會看這本看得很高興,尤其是有科技宅屬性的。)


圖解認知心理學

謝嘉恩
推薦度 ★★★★
難易度 ★

(非常好入口的一本書,簡單好懂,圖很多,輕鬆閱讀無負擔,推薦學習「認知心理學」拿這本當入門。)

跳入草圖筆、工程筆的坑

$
0
0

懷疑是在畫室蹲小板凳和國高中生一起彎腰練素描的關係,我年久失修的腰怎麼可能比得過他們青春的肉體,跑了幾週畫室後耐久值歸零。

意思是說,我閃到腰了…

這幾天所有活動都停擺,乖乖坐在 AERON 椅上護好腰背,求快點痊癒。連睡覺都只能坐著睡,躺床的話 4 小時就會被痛醒連翻身起床都辦不到。

還好世界上有「網購」這回事,我又自備「老公」,有人幫忙送飯領包裹,所以買了很多東西…

有爬 Dribbble 習慣的人應該都知道 Mike | Creative Mints這位大神。

Mike 的繪畫底子很紮實,反觀自己的手繪有點慘,都靠 PS 技巧掩飾,想畫出漂亮的擬物風 icon 手繪功力一定要有。

STAEDTLER 鉛筆組、軟橡皮、松竹素描本相信念設計科系上過素描課的的學生應該很熟悉。我原本也是拿這組在畫圖,畫著畫著不由自主看起大神都用些什麼工具,然後就掉進草圖筆的坑裡了。

看久了會覺得這位大神根本來賣筆的!每張照片都像賣筆的業配圖。

我意志力薄弱,就到處搜型號找店家買下去了…畫不出那種等級的作品,起碼可以拿同樣的筆吧?偶像崇拜不行啊?

草圖筆、工程筆

目前手上有 4 支草圖筆+工程筆。(雖然很想再買但是老公站在我背後他非常火。)

以下為個人繪圖體驗,素描入門程度玩賞階段,手繪素描這塊我完全不是專業人士,只是分享下心得、推更多人入坑,然後店家就會進更多款貨,我才買得到更多種草圖筆工程筆。

(人家 Mike 買了一堆美美的筆,台灣想找漂亮的工程筆或草圖筆有夠難。)


(從左至右)

E+M Holzprodukte

E+M 木質拼接鉛筆 P2809 斑馬木,5.5mm,內附 HB ,購自尚羽堂。

德國知名製筆的品牌,出了很多草圖筆,在台灣想買 E+M 最齊全的店家應該就是尚羽堂了。4 支筆中最貴的就這支,入手價 NT 1,000元,手感最好的也是這支,配重一分錢一分貨沒話說,木頭握起來有種爽感。

KAWECO

KAWECO special 自動鉛筆,2.0.mm,購自一分之一工作室。

這支自動鉛筆分長版、短版,筆芯也有很多種規格,我買最粗的 2.0mm,2.0mm 是工程筆規格,筆芯很好買,文具店幾乎都有。

長版和短版價差沒多少,但因為第一支入手的鉛筆是「北星,大人的鉛筆」(照片最右邊),所以想買支短的試試。

當時本來是想要 Hightide Penco 大人的鉛筆 黃銅版,但摸過實體後瞬間明白為什麼 KAWECO 賣人家的 3 倍價,就變心了。

(KAWECO AL SPORT 3.15mm 全透明那支鉛筆我好想要啊…台灣完全沒貨只能靠淘寶了。)

KOH-I-NOOR

KOH-I-NOOR 草圖速繪鉛筆,5.6MM,內附 2B,購自小品雅集。

這支我超推薦想試試看 5.6mm 這麼粗的鉛筆要怎麼畫的人入手!便宜、手感好、擺出來拍照也大方。不說誰知道它才 NT$ 350元啊!整支都金屬!還有很多顏色可以挑。

因為是我入手的第一支 5.5mm 草圖筆,很喜歡,不過等買了 E+M 那支後,覺得完蛋回不去了,真的一分錢一分貨。E+M 那支都可以買 2 支這個 KOH-I-NOOR 和 2 盒筆芯了。

北星鉛筆

大人的鉛筆,2.0mm,內附 2B,購自露天。

應該很多人都有這支筆,前幾年文具版燒得亂七八糟。我看上它的 2.0mm 筆芯 ,加上台灣長得漂亮的工程筆太少,買來玩看看。

便宜,外觀不錯,還附磨芯器,小缺點都可以包容了。寫字可能還好,畫素描就覺得配重不太適合,感覺好輕啊…

筆芯

一定有人想問 5.5mm、2.0mm 筆芯差別在哪,老實說,我不知道,但是畫起來感覺差很多。

上過水彩課、尤其考術科升學的一定背過考試公式:上清水打底、上點底色渲染後再開始畫。

5.6mm 筆芯粗啊!素描時平拿打底色,塗出來的線不是細麵線、是寬扁麵等級了,接縫不明顯,面積又大,平拿上完底色又可以換種握筆方式開始加細節,很方便。

然後,因為各家買筆的關係,我敗了各家廠牌筆芯玩看看,雖然 B 數不同很難比較,若拿 STAEDTLER 鉛筆當基準來看的話,各家廠商出的感覺不太一樣。

E+M Holzprodukte 5.6mm

5B:說是最黑的部份用軟筆芯,但畫一畫覺得不完全用「畫黑」來當選擇標準,有時候要看紋理材質挑筆芯的硬度。
HB:買筆時會內附一支筆芯,這支畫起來感覺很像 3B。

uni 工程筆芯 2.0mm 4B

4B:uni 4B 和 E+M 5B 畫出來感覺差不多,但草圖筆我比較常拿來塗抹,要用尖端刻細節得用磨芯器削去不少,有點心痛,起碼 2.0mm 的筆芯弄尖要削掉的部份比較少。(小氣鬼)

KOH-I-NOOR 5.6mm Gioconda

2B:拿來打底用的,2B 進可攻退可守,是基本保底盤…講是這樣講啦,但我還是比較喜歡 3B。雖然和 STAEDTLER 的 2B 相同,但這筆芯畫起來感覺有點灰。

北星鉛筆 2.0mm

HB:不知道北星的筆芯是不是偏軟,這支畫起來像 2B。
2B:買筆附的 2B 畫起來像 3B。

KAWECO 2.0mm

HB:買筆附的,畫起來像 2B。

磨芯器

鉛筆用鈍了要削,草圖筆和工程筆也是。手上的筆芯有 2 種尺寸,所以我也有 2 種尺寸的磨芯器。最容易買到的是施德羅上黑下藍那個,磨 2.0mm 工程筆用,但大人的鉛筆附了一個簡易型磨芯器,所以沒另外買了。

E+M Holzprodukte 蛋型磨芯器

5.5mm 筆芯專用,木質手感很好,想放桌上的話開洞那面得朝下,不然會滾來滾去。這表示削完筆要馬上把筆芯屑屑倒乾淨,不像北星的一樣有個儲存空間。

最後

你可以把這篇當成不專業開箱文,我的素描能力不是很好,努力練習中。練習過程放在 Instagram上,別太期待作品水平,有練有進步,有練就有希望。

Mike 是捷克人,爬完作品後發現,他手上一堆 KOH-I-NOOR 這牌子的筆一點也不意外,他還有一堆德國牌子的筆,德國就在捷克旁邊啊!在台灣不太好買,看是找代購或是去淘寶了,不然就存錢衝歐洲吧。

看了 Youtube 上發現很多畫家會邊畫邊轉筆,讓筆尖保持同樣粗細。所以我喜歡六角型的筆桿,畫幾筆就轉一面很方便,圓型筆桿勉強,三角型就算了。

對草圖筆有興趣的可以看這篇當延伸閱讀:Guide to Lead Holders

另外買了個電競用左手小鍵盤,充滿功能美與愛貓之情!畫美少女的村上Yuichi的創作空間文中的影片,因為腰痛所以腦波太弱(藉口), Razer Tartarus Chroma就這樣出現在桌上,搭配 Photoshop 用,不然右手要握筆、又要回來按鍵盤實在不方便,某些快速鍵用左手去按有點彆扭。

初步測試覺得做 Banner 不可能,這才驚覺我打習慣的快速鍵遠遠超過小鍵盤可設定的數量,要撸 UI 之類還是得回到完整的鍵盤上操作。

可能用筆刷畫 CG 或畫向量 icon 的時候會很好用吧,現在還在摸索適應中,如果你們有興趣我再來寫文推坑…

UX 研究方法實戰班 - 學員心得

$
0
0

8 月份開了第一場 UX 研究方法實戰班,從怎麼觀察使用者、使用者要什麼、到如何安排開發流程。感謝各位的心得回應,我會持續修改教材,讓上課內容更適合學員。老話一句:「你們這班給我的回應,會決定下一班的學生上到什麼樣的內容。」

安排課程的原因請參考這篇: UX 研究方法實戰班 延伸思考

可以到 Madders - KKTIX查看最新的課程資訊和報名方式。加入 粉絲專頁較能即時獲得開課訊息。

學員心得依收到的順序排列。(收到的心得數量很多,這裡僅列出部份。)

3.

學員 張※※

★★★★

內容很豐富,而對於人物誌、情境故事法早就了解,但是不知道如何真實的與產品結合。自己本身是開發 app 的職業,對於這些研究方法有更深一層了解。這些方法平時在網路上都可略知一二,但是好像破碎的拼圖,需要把這些知識連接起來。在這堂課能串連這些知識(雖然還是需要回去做更多深入的功課),覺得有收獲。

2.

學員 林※※

1.

學員 黃※※

XSION 論壇 - 第一天上午

$
0
0

XSION 跨界創新國際論壇

  • 如何量化體驗價值並帶動商業成效
  • 打造 UX 創作者的使用者經驗

幾年前參加過北京的 IXDC 設計論壇,貴到爆炸,但有所收穫。這次主辦單位邀請我來參加 XSION 論壇,很高興,前一晚就準備好裝備、充飽電,打算來現場即時聽打。


但現在…我好擔心這篇文貼出來,以後就沒有人邀請我參加活動了= =

XSION 論壇開場

一開場就是「長官致詞」,現在是 10:02 ,不知道會講多久…4分鐘結束不錯不錯,還以為會變成吃喜酒等上菜講 40 分鐘。

學生實習影片

咦?
學生實習訪談,實習後感言,歡迎多多參加比賽。
咦?
所以付錢來參加活動的都是學生比較多?可台下看起來業界人士比較多啊?

10min 左右的影片…

頒獎典禮

頒獎典禮花費 17 min 左右,現場發的簡章議程表寫的是 Special Recommend

想到有很多人是花錢來看上台領獎合照我就覺得主辦單位 GJ ,真不愧是台灣辦的活動,很有台灣味。

「歡迎飛天小女警上台領獎」

(你知道的,取隊名也是種藝術。)

之後頒發高達 10 萬元的最大獎。

得獎隊伍不確定有沒有人去當兵(其他獎項有人因為當兵沒辦法上台),10 萬元頒給 4 個人。

主持人:「怎麼沒聽到大家的尖叫聲呢?」

對於頒獎典禮的心得嘛…根據付費參加的友人傳訊給我…

嗯,還好我因為超期待的,提早來現場,撿到有桌子的位置。

如何量化體驗價值並帶動商業成效

講者:遠藤 直紀(社長 @ beBit株式會社

全程英語演講…日語腔的英語演講。

對不起我英文不太好,不過簡報檔全部拍下來了,之後慢慢整理吸收。簡報檔照片不外流,所以這段演講我沒辦法即時聽打分享什麼心得出來,只能把主要大綱列一列,附上參考資料延伸閱讀了。

一開場,他在講「NPS」。淨推薦分數 (Net Promoter® Score,又稱 NPS),詳細 NPS 介紹:The Net Promoter Score

客戶忠誠度,可參考 Customer Loyalty – What is it? How Can You Measure and Manage It?

使用者旅程地圖,之前 Blog 就有寫過文了。附上 Link 。

最後的 TD Bank 影片,講者播的有中文字幕,一時間我只爬到無字幕版本的。
Bain & Company: Net Promoter System - Trailblazer Videos - TD Bank

心得

真希望有即時口譯人員,這位講者提了非常多的內容,即使只是粗淺介紹,連貫很完整。
講者懂得非常多「方法論」和豐富的經驗,如果能用他最熟悉的語言演講,相信可以再深入介紹,聽眾的收穫會更大。

打造 UX 創作者的使用者經驗

講者:胡煜昌(Director of User Experience@Samsung Electronics)

講得很淺,從自介、三星團隊開始。

快速原型。

產品剛做出來不知道可不可行,所以透過 Prototype 做測試。

Prototype 很棒喔!可以快速做出來測試使用者的回應。

將快速原型導入設計過程,可行性評估、系統設計…(怎麼實做?沒講。)

產品演示
.
.
.
「每一次更動讓你多走很多冤枉路,我們試著讓作業變得很快速了,但還是跟不上時代演進的速度,我們必須要很快地更動,才不會走冤枉路。」

「我們希望每個東西都能夠好好地被試用,每個東西都有他的價值存在。」
.
.
.

「我們希望花時間在跨平台的使用者經驗。」
「我們想設計出更好的使用者經驗,這是我們未來想做的事情。」
「我們遇到困境,系統越來越複雜,我們要用視覺的方式讓使用者看見他想做的事情。有沒有辦法讓我們的介面變的更聰明。比如說大數據,有沒有辦法用在我們的產品上。」
.
.
.

心得

這場演講大概是面向學生,對於業界人士來說,這場講得太淺,就是空氣真是清新世界真是美麗的宣導推廣。

(連想下關鍵字查更深入的資料都不知道怎麼下。)


XSION 論壇 - 第一天下午

$
0
0

XSION 跨界創新國際論壇

  • 洞察情感,给創新設計加點料
  • 運用IBM Design Thinking 為企業作設計
  • 企業組織導入UX的假與真

中午休息外出吃飯,看準時間在 A 廳會場布幕後的休息區等另一場頒獎典禮結束。然後發現場地位子全滿,還有人站著聽。我望不到空位…不是在報名的時候就要選 A 廳還是 B 廳嗎?幸好沒人想坐投影機後面,熱風吹得不太舒服。我總算有把椅子。

洞察情感,给創新設計加點料

講者:陳華(高级研究員、用户研究中心主任 @ 聯想 上海)

中國的 ATM 是先吐錢的,所以 30 秒沒拿卡片就被吃掉了。(台灣 ATM 是先吐卡喔!)

正品 iPhone、山寨 iPhone 售價。

珍奶在中國的售價。

做設計賭運氣?

抄襲和創新是一體的事情,看是由什麼角度來看。

Alessi 的外星人榨汁機。

不是賣果汁機、賣情感,開啟話題。

Nielsen Norman 的設計思考

  • 求真:本能層
  • 從善:行為層
  • 審美,反思層

馬斯洛需求金字塔。

  • 自我實現層:情感屬性(高細節)
  • 尊重審美層:故事屬性
  • 社交層:情境屬性
  • 安全層:功能屬性
  • 生理層:簡便、直接、易取得(低保真)

各種屬性的範例:鋼鐵人玩具、鋼鐵人坐在甜甜圈招牌上吃甜甜圈…等等

冰山理論,Pain Point、Cool Point。使用者不會講,要挖。

Jobs:「知道自己需要什麼,不是用戶的工作。」

意識

感受、觀點、期待、渴望、自我。

潛意識,象徵能力(情感、審美)

(簡報:翻過來的馬斯落金字塔)

(講故事,人腦和機器的差別)

講者:我現在很少去做使用者調研,使用者不會講實話、或講不完整。

找痛點

舉例,講故事。

好的體驗,不是讓使用者自己選。

由情感推動功能。

(講者是心理醫師喔~~說做心理治療很多年了。)

一個好的設計師和好的心理醫師一樣。

從共情到移情,從痛點到爽點

優秀的設計師是一位「情感調味」高手

情感設計並非滿足「功能」、「需求」,而是用戶內心真實的衝突。

(自己寫的書介紹)
(工作坊介紹)

未來科技

(故事)

範例:VR 技術治療病患

最後:鋼鐵人 MARVEL 影片,心理治療
(美國隊長 3 的片段,鋼鐵人在台上用高科技投影他和父母最後離別的場景。)

心得

講者口條不錯,透過講故事的方式,將許多理論大道理拆細,舉出生活中的實例加快聽眾理解的速度。

可是,仍就是個大方向,詳細怎麼實作沒有講。

運用IBM Design Thinking 為企業作設計

講者:江宗哲(資深用戶體驗設計負責人 @ IBM 設計(上海)工作室 )

自我介紹

原研哉的書給講者的影響

「除了引導之外的溝通方法,自然的感受到最優良的清潔而感到安心。」

人心很重要,要知道要為誰做設計。

變電箱設計


圖片出處 http://www.cityyeast.com/passion3_show.php?passion3type_id2=108&passion3_id=1417

使用者的角度;台電工作人員的角度。兩者不同。

變電箱設計 > 我們不要變電箱長這麼醜,但這是真正的核心問題嗎?

用戶體驗

富比士調查:72% 的 CEO 相信客戶體驗很重要。

用戶體驗不是腳踏車零件,而是「人」。

不同的用戶會影響最終的產品是什麼樣子,先認識用戶才能走對第一個方向。

  • 買家:老闆、主管、採購,他們不是用戶。
  • 實施者:部屬系統的團隊,最少花 2 週,你很難想像裝個 Photoshop 要花 2 週。他們也不是用戶。

過去 IBM 就到這裡了。他們都不是「用戶」。

以人為本的開發方式

  • Hills 山丘,目標
  • Sponsor Users 用戶,不是買家
  • Playbacks 設計回顧

每一次迭代,只會訂 3 個目標,訂更多做不完沒有用。

解構目標

Who
What 比競爭對手好

約翰·甘迺迪:「我認為這個國家應該成諾達到這個目標:把送上月球,並且讓他安全返回地球。」

團隊參與

Playbacks 一定要從用戶開始。

突破同理心障礙

用戶:「你一定要有新東西再來找我,不然我不想跟你談。」

聚焦於個人,而非大組織。

任務是由「某些人」去做,必須知道是「誰」「做了某些事」。

各種研究方法

三階段:Understand、Focus、Plan

發散、混合、收斂。

工具:筆、便利貼。足矣。

  • 沒有錯誤的答案。
  • 量比質重要,會議上習慣讓有權力的人發話,但他也不是用戶。一開始量比質重要,先大量發散再收集起來收斂。
  • 先寫下來再說,講少講廢話的時間,廢話沒辦法寫下來。

會議怎麼開始?

  1. 用戶怎麼知道你的產品?
  2. 怎麼上手?怎麼幫助使用者?
  3. 已熟悉產品的用戶,怎麼幫助更快?
  4. 管理很多內容、用戶,怎麼幫我?
  5. 已有既有系統,我覺得你的東西不錯,怎麼幫我整合?
  6. 我遇到問題時你怎麼幫我?

Places

辦公室四週都白板牆,隨時可以更新進度。
不能完美,一旦完美就很難允許他人更動你的東西。
能夠不停地去看別人在做些什麼、說些什麼。
也不需要為了會議橋時間,因為你們隨時都在迭代。

Outcomes:就算是政府官員習慣坐在底下聽,用這種方式也可以讓他們參與產出。

衡量設計

你對這個產業的認知到什麼程度。
你對使用者的認知到什麼程度。

(講者講得很快,不少細節我來不及紀錄)

能源產業

  • 發電
  • 原料市場
  • 儲存配送
  • 配電零售

(實例故事)

使用者流程,故事板

工作流程

設計師主導的產品是這樣運作的。

業務、架構師、技術銷售、PM 等等
暫時先定義:產品目標、用戶、同理心地圖、無幫助之前怎麼做
開工作坊,確認。

人際關係圖

團隊名、職位名、職責、交付什麼

同理心地圖

幫你全局認識用戶。
怎麼說、怎麼做、怎麼想、感覺如何。
逼團隊認識用戶,站在團隊立場思考。

  • 用戶實際上說了什麼
  • 預期與反應
  • 用戶實際上做了什麼
  • 他們覺得怎麼樣?價值

Persona

同理心地圖是為了產出 Persona。
一定要和用戶接觸,不要靠數據瞎猜。

Persona 包含:照片、姓名、職稱、個人背景資料(公司規模、公司營運狀況等等)、一句話描述、痛點、目標、什麼問題一再發生、工作上下游的關係。

找到用戶現在的行為、未來想變成什麼樣的人

不同人會有不同的 Persona。

MAP

Step、Doing、Thinking、Feeling

(講者講不完了,在趕簡報…來不及記錄)

大數據

統計、人為分析、洞見

洞見才能預測未來,才是「大數據」

心得

不愧是掛 IBM 的講者,演講內容深入淺出,資訊資料豐富,多到我來不及拍照和聽打,細節漏了不少。

能讓人相信 IBM 這間公司真的有在「做UX」,且是從公司內部團隊合作就有此概念,並不是少數幾個人在喊高空口號而已。

(這才是有企業內部開發產品標準的 SOP 、文件,知道自己在幹嘛、並親自動手過的講者該有的表現。)

企業組織導入UX的假與真

講者:蔡明哲(首席體驗架構師 / 社群創辦人 @ 悠識數位 / HPX)

自我介紹

悠識介紹

(講者以為主辦單位是台北市電腦公會,現場都是白髮蒼蒼高階主管,自爆簡報方向可能不太適合底下聽眾。)

(講故事)

新加坡的 UX 研討會
中國的 UX 研討會。就業機會在哪呢?(簡報上舉出很多中國在做 UX 的公司)

香港的 UX 研討會

台灣有 UX 部門的企業或品牌。
(我的內心OS:最好是有 UX 部門就等於有在做UX…)

台灣做 UX 的社群介紹。

「UX」 非常難溝通的名詞,但不得己還需要時間沉澱。
一個 UX ,沒有共識,各自表述。

「導入」涉及越多部門,越讓人猶豫
想獲得導入後的好處,也要降低產生的副作用。

缺少量化或質性的研究或驗證,千萬別說導入了 UXD

(各種高空砲 UX 假象的例子)

企業慣性、拒絕改變

導入 UXD 真手段/假目的,換成 Agile、Big Data 都一樣。

先內化到個人的工作習慣。

沒有資源,設法自救。在舒適圈和抱怨圈於事無補。

(講台鐵的故事)

想辦法把 UX 導入開發流程

怎麼做呢?爭取資源,設法

產品(專案)設計開發總預算的 10%~30% 應該投資在 UXD 上

組織內部無法溝通…要先理解他人的位置和價值,使用他人的溝通語言。

萬一團隊中沒人要當領頭羊,你就是領頭羊,無論你是否有被賦予管理職稱。
萬一團隊中沒有人要當烏鴉,你不想當烏鴉,那就讓使用者直接發生吧。

不要說「導入UXD」,要說「聆聽使用者的聲音」,由簡入繁。

(講故事)
(講實例)

.
.
.

你不在意組織管理,你就被組織管理。
UX 路走到後面一定會遇到組織管理、跨部門溝通、利害關係。

導入UX是過成手段,成功的產品才是真的。

沒有一個行業的人像 UXers 一樣,這麼想要改變別人。

心得

公家機關應該很愛這種簡報,心靈雞湯醐醍灌頂。
簡報很勵志,至於怎麼實際上導入 UXD 而不只是「聆聽使用者的聲音」,嗯哼,請洽悠識數位。

XSION 論壇 - 第二天上午

$
0
0

XSION 跨界創新國際論壇

  • 產品設計: 跨出你的舒適圈
  • 以人為本的創新:應用與挑戰

來聽第 2 天的論壇,一大早好想睡覺,昨天即時聽打耗太多心力了。今天還有一天,加油!會場感覺上人少了很多,不用搶都有桌子用啦!

產品設計: 跨出你的舒適圈

講者:夏俊 (產品設計部總監 @ KKBOX)

不是只有做 Mockup

你是在做產品,不只是在做「設計」。

自欺欺人

不是交功課

各單位下指令 A > B > C > D,最後不是使用者要的

.
.
.

日本為什麼還是愛買 CD?

.
.
.

設計師老抱怨 PM 不懂設計,但你有先去了解 PM 要什麼嗎?

.
.
.

KKBOX 設計師們和 Yahoo 設計師們的照片

要找到可以改變這個文化的人,可以跟找到跟著公司改變的人,能找到這樣的人非常難
(OS:為什麼要營造這種文化出來再找人來改變?誰的權限比較大啊?)

.
.
.

心得

這個演講面向學生族群,講述學生腦海中的設計師、和真正的設計師有什麼落差。對於已踏入業界工作的人是已知的「日常」。(所以我恍神了)

提到很多「你會遇到 XXX 問題,應該要知道問題的解決方法」,但沒有告訴我們要怎麼解決。

以人為本的創新:應用與挑戰

講者:陳雅博(執行長 @ PEBBO)

  • Methods
  • Challenges: Individual、Business

跟著使用者,觀察。

  1. 痛點
  2. 隱藏的需求

Methods

  • What do ysers “really” need?
  • Are You Sure?
  • Getting inspured

Prototype

問題切細

MVP

田野調查案例

Layers of Human Centered Design

  • Aesthetic
  • Product experience, usability
  • Holistic UX, User journey
  • Business strategy
  • Culture & mindset

把流程套入企業裡就會產生創新,但不會產出東西。

人才、文化、環境沒到位,沒有一個方法論可以幫助你們創新。

斷層

  1. 產品和使用者的斷層
  2. 產品和使用情境的斷層(沒有解決真正的問題)
  3. 流程、方法論、團隊搭不起來
  4. 願景和實際上做的東西
  5. 不同部門間的斷層(KPI、勾心鬥角)

Design Thinking

Always start with why

Why What How

資料補充:賽門西奈克:偉大的領袖如何鼓動行為

問對問題

要創新就是充滿風險

未知的未知

對與錯、黑與白,不是絕對,同理心

Skill set Triangle

  • Craft
  • Storytelling(Communication)
  • Point of View

團隊合作、溝通

Topdown management

  • Correct
  • Comply
  • Conform

Co-creation benefits

  1. Not about clients vs. consultants
  2. Create synergy
  3. Vetter execution
  4. Mindset, culture change

心得

聽到現在,覺得講者們都在講「概論」。

我的未來不是夢,流著汗水默默辛苦的工作
你是不是像我就算受了冷漠 也不放棄自己想要的生活
我認真的過每一分鐘 我的心跟著希望在動

學生來聽這個論壇應該收穫頗豐,能窺探將來自己會遇到挫折。但對日常生活就已經是「流著汗水默默辛苦的工作」的業界人士來說,只是聽講者重複一次自己遇到的困難。(還不知道該怎麼解決)

XSION 活動主軸將緊扣此三大成功要素-Business(商業策略) ,Technology(創新科技應用) ,User(使用者體驗),並強調要素間的融合應用,期盼帶給國內企業及相關從業人員嶄新的思維啟發。

自學 UI/UX 各階段心路分享

$
0
0

收到很多剛踏入 UI/UX 這個領域的學生或設計師傳訊,他們迷惘,並且擔心自己的未來…我又不是神怎麼會知道你的未來是什麼?只能分享自己自學 UI/UX 各階段的心路歷程供參考了。

剛起步的菜鳥 時期

什麼都不懂,一堆名詞動詞要查 Google 不然完全不知道在講啥。Guideline?蛤?可以吃嗎?

我起步的時間不算早,大約是 iPhone 3GS 那一波。因為英文太差只能看簡中文章,或者整頁丟去 Google 翻譯。繁中文章?這時間幾乎沒有專門的設計站在介紹 UI/UX,全靠 新同文堂把簡中轉繁中。

x 招解決 oo 問題

那時候特愛看「x 招解決 oo 問題」之類文章,似乎只要會這幾招就能搞定了。像是:

与众不同!20个提升品牌效果的平面设计技巧
解锁新姿势!我有50个方法教你做出好看的美食排版设计
用这13个方法,帮你做出真正轻量化的移动APP 设计

算了吧,這種文章看多了除了「感謝大大分享祝大大一生平安」之外,就是累積更多看不懂的專有名詞。但學習新領域一定經過大量看、大量不懂、大量 Google 查單字的時期。

10 招裡有辦法記住 1 招並實際使出來就很偷笑了,初期挫折感很大,怎麼自己什麼都不懂啊~之類。

開始拜大神

隨著閱讀文章量累積,也會看到很多美美的炫圖,知道幾個設計師貼作品的網站,開始崇拜大神。
Dribbble - Show and tell for designers

幾位知名大神的名字朗朗上口,比如:
Mike | Creative Mints
Eddie Lobanovskiy
Marcelo Schultz

神拜再多都沒用啦,自己沒練習光看怎麼會進步?

如何做出 XX 炫圖

身為設計師,理所當然追求視覺稿要多炫有多炫,又看了那麼多大神炫圖,巴不得自己也這麼厲害。但他 X 的我就是個剛畢業的菜鳥,連素描都畫的 2266 是能搞出多炫的東西?剪剪素材拼拼公家單位最愛環保地球風格還差不多。(參考 第一次做研討會主視覺就上手之「環保三寶」的應用

狂爬 Adobe Photoshop Design & Illustration Tutorials by Envato Tuts+的教學。可是他們就算現成寫好好的步驟,自己照做出來還是差了點味道。

而且,要自己原創,在這階段根本不、可、能、多、漂、亮

半懂不懂 時期

爬了 1 年的文,主要常用術語都不知道 Google 多少,進入很少有關鍵字看不懂的時期。但也只是「知道這名詞在講什麼」,離深入瞭解、有自己的見解很遠,所以很喜歡講解某技術專用詞的文章。

不可不知的 XX 技術

針對某個實作運用的主題/名詞深入介紹,像是:

仅此一篇,读懂卡片式设计长盛不衰的秘密
从这3个方面,帮你改善移动端APP的输入体验
专业干货!提高无线端表单可用性的7个设计原则

看的時候都懂,轉頭要自己實作時沒幾招用得出來的。非常令人沮喪的時期,覺得大家都好強怎麼自己都過一年了進步這麼慢。

20xx 年,x 條規則

還是很菜,多少懂一點了但更懷疑自己的方向,不知道現在在幹嘛,更甭提未來產業變化,所以很愛看有人幫忙整理好的「今年流行」、「未來會怎樣」之類的文章。像是:

绝对不能错过!2016 年最流行的8个UI设计趋势分析
2017年,这五条设计趋势将惊艳整个设计圈
未来交互新趋势!6个值得提前学习的「语音交互」设计方法

發現自己看再多還是不知道可以怎麼做。這些規則什麼的,都是其他人整理好的東西,融會貫通的也是別人不是我啊!

看半天除了點頭按讚,覺得「哇~寫文的都好棒啊!好厲害」之外,我學會了什麼?對我手上的工作幫助多少?

感覺有幫助又好像沒幫助,非常疑惑自己的腦子泡了多久的水導致吸收不了新知。

開始自己寫 RWD 、爬國外文章 時期

這個時期簡中文章已無法滿足我,老是那些東西繞來繞去換句話說,同領域文章看多了就算英文再爛,基本關鍵字也能讀懂。

工作上要和 F2E 溝通,不如自己寫比較快!但給 RD 看的文件往往只有英文版,就算有中文翻譯,落差很大:寫 HTML、CSS 用的是英文啊!不看原文根本搞不懂在講啥,

Bootstrap
Susy
Sass

RWD 寫一寫發現自己的英文單字量變多了,卻只能和瀏覽器溝通,沒辦法和人類對話…

質疑專案開發流程 時期

工作 3 年,因為工作上摔過的坑、撞過的牆也多了,慢慢開始把眼光從「視覺」、「Photoshop」放到外面的世界。會思考團隊合作、專案流程、工作時程。像是:

41% 的APP 不合格?可能是你没试过这个快速高效的工作流程!
专业科班的答案!一个完整的交互设计流程是怎样的?

看了一堆發現,自家公司完全推不動,哈哈哈。(淚)

其實是自己太嫩,視角只有正前方 30 度,不知道別人在幹嘛、不懂公司文化,更不知道什麼是商業價值、營運模式。一頭熱想在公司推動改良,根本是來亂的。

起碼有辦法畫出「利害人關係圖」、「價值主張圖」再來說改變工作流程吧…

把眼光放到「視覺」以外的世界

一旦開始質疑專案流程,就回不去只有「視覺」的世界了,像是會不會游泳的差別。會手寫 HTML、CSS 是個很大的分水嶺。

UI 方面會開始爬「互動設計」、「資訊架構」的文章。
UX 方面開始看各種「方法論」、尋找怎麼融入實作的技巧。

就算是簡中,這些方面的文章數量遠遠不足,不看原文都不行。不然就是等歐萊禮出中文書…往往落後國外 1~2 年。

在資訊業落後 1~2 年!?

Swift 年年改版,落後個 1 年都不知道被沖到哪裡去了。UI/UX 更新的速度可能稍慢一點,也沒慢到哪去,你看 Apple 發表會,每年 iOS 介面都不太一樣。

而且看越多越會覺得基本功很重要,比如英文、手繪、情緒管理、時間管理…進入還債階段。以前什麼東西偷懶逃避沒學好,現在都要回頭還債補回來,很辛苦。

大量買書挑錯 時期

雖然網路文章多,但很零散瑣碎,沒有完整連貫且系統性講 UI、UX、互動的文章,還是要靠書籍才行。

看得越多你會發現開始「百家爭鳴」,也就是爬到的文互相矛盾

怎麼辦呢?我還滿慶幸菜鳥時期查關鍵字時,一個關鍵字至少把 Google 搜尋到的前 5~10 頁連結全部點開閱讀。就算有錯誤或說法不同導致理解不能,林北看個一脫拉庫總會總結個概略答案出來吧?

有寫過論文就會知道,「參考文獻」非常重要,誰說過的話、這資料怎麼來都得附上出處。國外書籍頗講究這部份,多少能看得出來是作者自己鬼扯、還是有什麼理論支持他的說法。

書籍能系統性敘述一個論點,去蕪存精。就算論點起衝突…多看個幾本還是能得到一個大略的概觀,加上自己的見解,也能說點什麼唬唬人。

前提是「大量閱讀書籍」,只看一本沒用,參考文獻拿來找延伸閱讀的補完資料,觸角會越伸越廣,到某個程度會覺得「通通串起來了」,有種(好像)通了的感覺。

(到這個時期我才開始大量買書…iPhone 3Gs 時期是有幾本 UI/UX 書可以買啊!?年代不同好嗎?初學者建議網路文章隨便看看就好,先從研讀書籍開始,系統性打點地基再爬文,可以省去我那一口氣連看 10 頁 Link 的土砲作法,前因後果脈絡也比較清楚紮實。)

十大易用性原則

大概自學 UI/UX 3 年後,我就很少在看「x 招解決 oo 問題」之類的文了。這種鎖碎的技巧太多,追都追不完,只會讓自己覺得「資訊恐慌」。

所有的 UI 設計易用性,本質上只有 3 點。由 Jakob Nielsen提出,他是所有 UI/UX 設計師都該知道的人物喔!

  • 易於學習
  • 相對無錯
  • 便於使用

我把 十大易用性原則背下來,所有的「招式」源頭都是這 10 條原則。把它們當成核心理念,再回頭去看「招式」,就會感悟到「招式」不過是為了實現這 10 條規則的技巧。

然後招式就會變得很不重要…

如果你同時學習 UX ,那會發現「招式」可以放一邊去有空再說,理解使用者、戳對痛點,比在 UI 上死刻對產品的效益更大。

做自己喜歡的事

「我是 XXX,現在是設計師/學生/F2E。經歷 XXXXX….對 UI/UX 有興趣但不知道下一步是什麼,我未來可以走什麼方向?」

比起「我未來可以走什麼方向」,是 UI 還是 UX,做自己想做的事,熱情和毅力可以燒得比較久。

會迷惘是正常的,別說 6 年後自己會走到哪裡,我連 6 個月後自己會做什麼工作都不確定了。找出自己最想做的,堅持下去。

迷惘的原因之一包含擔心未來找不到飯吃餓死。

在台灣,好手好腳的設計師就算是菜鳥,要餓死沒有那麼簡單,根本不是擔心未來找不到工作。而是在煩惱週圍的眼光、怕自己下錯決定時間砸下去後薪水不夠高。

說穿了只是對 UI/UX 的興趣沒有大到可以擺脫這些煩惱。

我都和傳訊給我的那些人說:比起煩惱「未來可以走什麼方向」,不如思考「我喜歡什麼」。就算 UI/UX 這個領域薪水比較高,但自己沒興趣的話日子會過得很痛苦,甚至抗拒學習。

有興趣才會砸時間在這個領域上,你的時間花在哪,成就就會在哪。(所以我砸了 100 小時在 PS4 FF 零式上,得到的成就就是搜集完全部的獎杯。)

推薦一本我買了送朋友的好書:阿德勒「被討厭的勇氣」。能幫你思考人生方向,放下許多負擔、堅定自己的信念。

對未來感到迷惘?套句阿德勒的說法…一切都是藉口!有迷惘的只是在煩惱人際關係找說詞而已。根本不是真愛(?)

包含我自己在內,對未來感到迷惘,其實只是不想承認自己太偷懶導致畢業後沒有拿得出手的技藝可說嘴而已。一旦有真愛(?)根本不會迷惘啊!

MOPCON 2016 心得

$
0
0

這是第 2 次參加 MOPCON啦!去年講的是「使用者要的不是功能」,今年來講老闆說:「我也是使用者!」。看標題就知道這是個很深的大坑,而且很多人跌進去過…還有,不要期待我講的內容有多正經…

再次感謝 MOPCON的邀請,讓我能鍛鍊一下心臟,面對幾百人的場子還是會緊張吃螺絲講錯話 orz

今年和去年最大的不同是,那個「傳說中的 RD」來幫我打雜提行李了,真不曉得你們為什麼對我家那隻有這麼大的興趣,是想趁機告狀叫他管管老婆嗎?

專業,就是用對方聽得懂的話,去告訴他不懂的事情

根據 2015 年參加 Mopcon 的經驗,在座有許多學生,設計師、工程師、PM、創辦人等,各種角色身份都有,簡報檔不能寫太深。許多演講教學書裡都提到一件事:「說故事」,讓聽眾融入故事、感同身受。一次只講一個概念,不要講深,讓聽眾有興趣並記住才是演講的重點。






你對手上的產品認知多少?

我完全不敢問各位「你知道為什麼要做這個專案嗎?產品目標是什麼?」。歡樂氣氛瞬間就砸掉了。

大家都知道「建立團隊共識」這種口號,結果連產品目標都不知道。不要跟我說是為了賣錢,產品目標不是指銷售量,而是產品能怎麼幫助使用者

導致許多開發者都覺得自己手頭上的案子莫名其妙,這功能搞成這樣是要給誰用的?我常在演講或課程上問這個問題:「知道手上的專案成品最後要給誰用的請舉手。」可能大家太客氣,通常舉手的不到兩成。

很有趣的狀況對吧?壓力很大都在趕工,開發不知道目標是什麼的產品、也不曉得產品要給誰用。

所以去年主題講「使用者想要什麼」,今年來講「使用者是誰」。如果明年有幸再去 Mopcon,就來聊聊…(呃,坑不要提早一年挖省得埋死自己)。

使用者和目標族群是兩回事

使用者是個很大的範圍,只要是使用你產品的人都可被稱為使用者。但你產品的目標族群會是特定的人物。

比如「兒童牙醫診所」。

兒童牙醫診所的目標族群是誰?家長、兒童。(雖然兒童是診療目標,但掏錢的是家長喔!)

針對家長、兒童這兩個不同的目標族群,他們對「兒童牙醫診所」有什麼樣的期待?希望能解決什麼問題?

成人可以去兒童牙醫診所嗎?(有的可以有的不行,某些診所的診療台是兒童專用。)

成人是「兒童牙醫診所」的目標族群嗎?

成人是「使用者」嗎?

為什麼要做使用者研究?

你喜歡某個女生,要不要去打聽一下她的喜好和習慣?

你的產品要賣給誰?要不要想辦法了解他?

什麼?你不知道喜歡的女生的喜好?活該被打槍啊!

了解使用者的方法

最容易入門的就是「觀察」和「訪談」這兩個方法。使用者都是傲驕口是心非這點大家都知道,怎麼樣挖出使用者真正的想法需要點技巧。

觀察不是讓你有藉口蹲在路邊光明正大看正妹,而是找出「使用者遇到什麼問題」。

訪談時「不要詢問使用者想要什麼」,而是問使用者過往的體驗

最後,附上那段讓大家笑到翻的影片。

題外話

為了找切題又有趣的影片範例,找影片爬了超久,發現 Samsung 的廣告影片在各個國家都不同,但 Apple 每個國家都一樣只有翻譯差別。而且 Samsung 的廣告比較會先拍出「使用者問題」,然後給你解決方法,Apple 廣告都是形象和操作。

唉,演講時提到賈伯斯,我本來想放 Apple 的影片的。


延伸閱讀:MOPCON 2015 心得

如何找到可用的 UI 設計師

$
0
0

Mopcon 講者晚宴上有位新創公司的創辦人和我聊到這個問題:「我們花了很多力氣和時間尋找 UI/UX 設計師,但一直找不到適合的,該怎麼找才有人選呢?」

這要看在找資深設計師還是新手等級,當然新手設計師比較多比較好找。

需要自己養設計師嗎?

我現在也算是「創辦人」,能夠以創辦人的身份回答這問題。

「公司遇到什麼問題需要自己養一個 UI/UX 設計師?」

如果不自己養的話,有沒有其他可行的方法?要知道新創公司營運艱辛,錢要省著點花,每多請一位員工就是多一份開銷、多一份壓力。

外包有外包的好處、自己養有自己養的好處,各有利弊。新創公司如果要開發自有產品、搞敏捷開發那套,那肯定要自己養,隨時抓人溝通方便。

找什麼等級的設計師?

如果非要自己養設計師不可,下一個要問自己的問題就是「公司目前的營運方式、專案開發流程,適合請什麼樣的人?」

新創公司編制小、人數少,產品變動快,通常需要「萬能型」設計師。也就是擅長 UI、UX 懂一點,甚至 HTML+CSS 沾點水。

問題來了,要開出什麼樣的薪資福利待遇才能找到這樣的「萬能型」設計師呢?(笑)你在找 UI/UX,別人也在找啊。

UI 課中午和學員吃飯聊天時,有學員說現在的公司都想要資深的設計師,沒有人想用菜鳥,所以要找 UI/UX 的工作好難,順便抱怨公司不願意栽培新人。問他們為什麼想走 UI/UX 這條路,扣掉「興趣」之外,錢比較多佔大多數。

另一方面,好幾位和我聊天的創辦人或主管,都跟我說現在 UI/UX 設計師好難找,可以用的人太少,而且公司剛要導入這方面的概念,不確定性太高,沒給什麼資源時間栽培,需要大量即戰力。

為什麼大家都想要「有經驗」的設計師?看看隔壁棚的 RD 們,招資深的有、願意收剛畢業菜鳥的公司也很多。

什麼情況下需要「有經驗」的設計師?為什麼不能找新手設計師?

因為目前大部份公司遇到的問題不是新手設計師能解決的。

公司招募新手設計師,希望他能幫公司解決什麼樣的問題?太多基礎稿件趕不完需要新手幫忙完稿,會基本軟體操作、大概懂一點專業相關知識、不添亂、乖乖聽話就好了,哪還有太多期待。

招募有經驗的設計師希望能解決什麼問題?公司沒空(或沒資源)教新人,直接找個有經驗的比較快。或是目前專案流程有點狀況,希望來位新人能讓各單位合作順暢之類。

招募資深設計師希望能解決什麼問題?可能要帶新人、整頓開發流程等等,包山包海喔…也有可能坑太大了,不找個資深怕是填不了。(本文的資深指的是有經驗有能力的設計師,並非待得比較久或是職稱掛資深掛好看那種。)

相信各位不會把「專案開發流程」這種問題交給新手設計師處理。同樣道理,一間公司想導入 UI/UX 概念怎麼可能找個新手?

先搞清楚公司遇到的問題需要什麼等級的設計師來解決是非常重要的事,這問題如果新手應付不來,開個菜鳥價想找資深設計師當然找不到。

但,如果公司遇到的問題只要新手設計師就能解決,花大錢招個資深設計,你覺得這位設計師會在多久之後離職?

怎麼找到可以用的 UI 設計師

台灣 UI/UX 觀念起步沒多久,市場上是有多少「有經驗的設計師」可以論斤稱兩?能搶的人早搶完了…挖別人家的設計師最快(無誤),工作和旅行一樣啊,都是離開自己活膩的地方,去別人活膩的地方。資訊圈很小,大家都跳槽來跳槽去。RD 間有種神秘(?)的連線,找 RD 問有沒有之前合作過不錯的設計師可以推薦,品質還比較好。

設計師相關社群肯定聚集很多有能力的人,最最少人多,去 FB 社團貼個徵才文多少有機會,或是贊助下社群活動擺個招才攤位也是好方法。(但我也認識許多資深設計忙到快和閉關沒兩樣,想約他們吃飯都難。光是工作和家庭就快燒乾了根本不會跑社群,要跑社群起碼也要「有空」啊。)

去 Dribbble、Behance 找是個方法,但兩大平台都不太能呈現作品「很好用」的一面。只會讓你找到視覺設計師,真正可用的 UI 設計師很少。看你希望產品是「很漂亮」比較重要,還是「很好用」比較重要了。(或是沒魚蝦也好,先找個堪用的頂著之後繼續徵人也是個辦法。)

Linkedin上也有一些可以爬爬看,不少 UI 設計師在上頭,可以直接看到他們的過往經驗。然後,不要以為待過大公司的設計師能力就會比較好、比較了解專案開發流程之類,請記得看看對方的作品集、面試時問問他在專案開發裡擔任什麼職務、在專案中做了什麼事等等,好好確認對方能力。(切身之痛)

至於人力銀行就算了,找新手專用。有能力的設計師通常累積一定名氣和人脈,根本不用開人力銀行的線上履歷表,把想換工作的風聲放出去就一堆人搶著要。

獵人頭嘛…肯定是一分錢一分貨。我和他們打交道的經驗不太好,老是叫我去寫程式,還叫我去管伺服器不知道在想什麼。公司要透過獵人頭還是找專業一點的吧,省得敗壞自家公司名聲。

舊文

我在 2014 年寫了 教你一眼看穿職缺是不是雷這篇文章,現在回頭來看一樣心有戚戚焉。如果公司一直都用這種方式在找人,省省吧,找來的人是能用嗎?待得了多久天曉得。

另外,找份正常的設計工作真難也提到不少我的慘痛經驗,會去這種公司上班的設計師,不是太缺錢就是菜鳥。

題外話

我很鼓勵學員們先去新創公司練練「萬能」身手,不要急著去大公司。大公司規章制度潛規則溝通麻煩又一拖三五拍,新手去大公司就是聽令行事沒什麼發揮餘地。

小公司彈性大速度快要練什麼技術都快,坑也踩得又多又快。尤其新創公司,可以好好練一下肩膀扛責任。等練個幾年經驗豐富手上技術也成長很多,再去大公司學習營運管理產品策略層面長見識。

之後進可攻退可守,知道一間公司怎麼營運、產品策略、管理什麼的,不管是繼續窩大公司,還是加入新創公司當設計總監,甚至跳出來自己創業,大範圍沾水過遇到困難至少知道要往哪邊找答案。

讀者來信:學生專題-1

$
0
0

這是封讓我覺得有點困擾的讀者信,收到的瞬間傻了一陣子,不知道該怎麼回應比較好。反覆看了很多遍,因為他附上學校專題作品,我還去把該系所近幾年的課程與學分全翻一遍。只能對這位學生說:「你爬的文太少!」而且還爬錯方向…

我在一年前學校的課程有一堂關於UI設計的課,但是老師所強調的都是樹狀圖,不太強調設計方面,也因為這堂課我喜歡上了UI設計,將來希望有機會往這個方向走。

首先,設計不等於視覺。設計是為了解決問題,解決問題前需要先找出問題根源,有非常多種方法幫助思考,樹狀圖是其中一種。你的系所有非常多設計思考方向的課程,對於「設計」可以向學校老師多問問。

我在網路找了很多關於UI設計的網頁,但是大多都是再說UI設計師所包含的工作以及想法,幾乎都沒有程式上面的建議,UI設計程式好像有許多模組化的物件。

你用 UI 設計師的關鍵字,想找程式設計師的文章,當然找不到。UI 設計師不太需要寫程式,寫程式的是工程師,請去 Soft_Job 版爬文。iOS 工程師、Android 工程師、前端工程師等等,他們的工作內容會和 UI 有關聯。

我的Photoshop和Illustrator沒有很好,我的科系算是在工科的所以關於設計方面的課程系上給的不多,我想詢問您關於設計程式方面的建議以及給別人的UI檔時是要用JPEG檔嗎?

再強調一次,設計不等於視覺,懂軟體操作不等於懂 UI 設計。

我是嫁給 RD 的 UI Designer,不是嫁給 UI Designer 的 RD ,寫程式問我就問錯人了。

給別人的 UI 切圖,通常會用 .png,也考慮圖片性質而使用 .jpg、.gif,視情況而定。

以及關於我的簡單UI設計的PPT

PPT 我看了,後面系統資料怎麼接的可行性先不管。學生習慣「先射箭再畫靶」,你已經認定現行 App 很沒特色很難用要自己做一個比它更好的 App,但沒去探討為什麼現行 App 很難用。

難用?怎麼個難用法?不要以「功能複雜」、「不方便」就打發過去,哪些地方讓使用者覺得複雜、使用者完成什麼任務時遇到什麼樣的困難,一項項全部列出來。

使用者會用這個 App 完成什麼任務?簡報中我完全看不出你對這件最重要的事情有所著墨。

太強調過於大眾化、不特殊、不夠有特色。大眾化不特殊沒特色這一點問題也沒有啊~你看 Uniqlo 素色棉 T。使用者會因為很特殊所以常常用這產品,還是因為很好用能幫上我的忙所以愛用?使用者不會因為「與他校不同、風格簡雅、專屬 XX 人」就會喜歡使用這個產品。

你提到「過多不必要的功能、太複雜搞不懂」,這才是要解決的重點問題。

然後,在沒登入的情況下連主畫面都進不去,就算使用者只是想看一下 525 接駁車什麼時候到站。我數了下,從登入到看到即時車況 Map,要經過 6 頁。就算有自動記憶密碼功能…考慮一下什麼資料一定要登入後才可看到、什麼資料不需要登入就呈現給使用者吧。

登入之後連到各個學校網頁如選課系統、線上學習系統…那些系統沒有 RWD,用手機開也太苦。而且學生在什麼情況下要用手機登入這些系統?

主畫面有很大的空間是「最新消息」,放了學校公告的學雜費減免辦理、補上班上課交通資訊、離校手續辦理等等。平均 1 個月有 1 筆最新消息?

(我的個人偏見,就我在當學生的經驗…他媽的我根本不看學校公告的什麼最新消息,有狀況直接敲同學問啊~~我最常看的是課表,就算已經期中考了我課表還是背不住。)

最後,給你的建議是:

  • 校園隨機抓不認識的 20 位學生,訪問他們如果想知道接駁車、校園地圖、選課系統、線上學習系統 、自己的課表,會透過手機怎麼操作?請他們操作給你看。
  • 你預期使用者拿這個 App 完成什麼任務?(一項項列表)
  • 使用者要怎麼操作這個 App 才能完成他的任務(每個點擊、換頁都記錄下來)
  • 使用者最常拿 App 做什麼?什麼功能他需要但不常用到?(列出優先順序,最常被使用的應該要最容易被發現與操作。)
  • 不要主打「和別人不一樣」,這不是廢話嗎?和別人一樣那就直接拿它來用就好了幹嘛自己再做一次?



我在打電動:槍之軌跡心得

$
0
0

通常一款手遊我裝了會在 30 分鐘內刪掉,劇情和打發時間的爽度會分開計算,沒劇情可言又玩起來不爽當然不會留;玩得不爽又什麼都要掏錢課金馬上刪掉。

這幾天在玩一款「槍之軌跡」的新上架手遊,雖然這遊戲仍有很多要改進的地方,但至少不會讓我覺得死要課金,完全不課也是玩得下去而且爽度不會差太多。

我成立的軍團叫「HYDRA」,2服,極缺人力,歡迎加入!

角色部分,我選了「異能者」,妹正贏一半。

重點

  • 第一章末期劇情會給你試用一把「流星」紫槍,儲值最便宜 30 元台幣就可以入手。建議花 30 元,這把槍好用。
  • 軍團很重要,解「軍團懸賞」任務可以取得貢獻值,能在「軍團科技」加個人屬性如生命、戰鬥力、防禦等等,是我遇過最實用會讓成員想幫忙衝等的公會系統。(快來加入我的軍團「HYDRA」)
  • 中餐、晚餐、消夜這 3 個時段系統會送 HP 40,記得先把體力花光,等時間到在登入。

20 級以前:

  • 先衝20級,可以去打首領戰場,有不少好東西,而且打首領戰場不耗體力。
  • 競技場要打,可獲得槍的碎片,而且競技場點數能去商店換東西。打越高系統會送錢和鑽石。
  • 槍不要分解太快,先存著,之後打寶藏時會要求帶 2 把同種槍有收獲 150% 加成。
  • 第二章結束應該可以搜齊牛仔套裝,並全上 2 星。
  • 記得升技能,黑洞超級好用必點滿。推薦用黑洞、雷神、火球。火牆衝關卡時擋怪好用,火球打單體好用。其它看個人,我用不慣。
  • 3 把槍的強化,在換槍時可以繼承,不要每把都強化啊!強化 3 把就夠用了,防具也一樣,「換裝」的話強化可以繼承,不要脫下再穿新裝備。
  • 沒事不要急著升星等或強化,忍著,常常有軍團或劇情任務叫你升星強化,這時候一起升就好。

20 ~ 25 級

  • 解軍團、解每日任務,想辦法衝等、衝戰鬥力。
  • 有些任務會要你去打之前打過的關卡,三星通關的話用可以用掃蕩券解決,省時省事省力。掃蕩券根本用不完。但有特殊要求如血量、60秒、XX槍這種,要自己手動打。
  • 軍團供獻值不要全部拿去換屬性,留一點去商店買「勇者徽章」,升稱謂有加成,但也不要買太多,之後變成要「英雄徽章」時買了一堆勇者勳章超浪費。(我在說我自己 orz)

25 ~ 30級

  • 開了天賦後,全部先點 1 級就好,太吃經驗值(我升太快 EXP 被吃光了),目標先衝 30 級開放爬塔。
  • 劇情到第 2 章噩夢,怪很硬,要先衝戰鬥力。
  • 每天都要打寶藏、挑戰、首領、每日、爬塔,報酬滿豐厚。
  • 各種槍不要亂分解,之後打挑戰會用到(我就拆光了只留紫槍,哭哭)。

競技場

  • 記得換槍,主槍狙擊,單體攻擊高,第 2 把選衝鋒槍,第 3 把隨便。
  • 異能者技能帶黑洞、雷神、火球。
  • 在選對手時,名次參考用,挑戰鬥力比自己低的一定打得贏。
  • 開場就先丟黑洞、雷神、火球,然後狙擊槍狂射,沒子彈馬上換衝鋒槍。通常 15 秒內對方就趴下了,用這招可以打比自己戰鬥力高 5000 的沒問題。(黑洞會卡死對方所有行動,趁機揍他)

商店

  • 非常好買的地方!
  • 不課金的話鑽石要省著點用必要時刻用粉塵和金幣去商店換道具。
  • 鑽石留著抽武器寶箱,別亂花。

遊戲下載

https://play.google.com/store/apps/details?id=com.uzone.ttqz2
https://itunes.apple.com/TW/app/id1144782327?mt=8

最後…

我的軍團「HYDRA」極缺人力,2 服,拜託各位快點加入…

邀請碼:dfgxz2oe

(這團長好可憐招不到人)
(本來團名想取「吃飽來一槍」,但要我去宣傳,歡迎大家加入「吃飽來一槍」行列,個人恥力不足,不知道怎麼開口orz)

(這篇是我自主寫文,和官方沒關聯,如果官方有看到這篇文想感謝我的話,不用客氣,就那個白色羽翼翅膀謝謝。)(喂)


參加性別暴力防治駭客松心得

$
0
0

受女人迷邀請,擔任「性別暴力防治駭客松」導師一職,主要工作是讓參賽者問問題。這篇文來聊聊我看到參賽者們普遍遇到的問題。

因為我提早到、又比預定時間晚一些離開,停留 3 小時左右,所以一起討論的組別比較多。但發現大家踩到的坑差不多:

  • 只想到所有條件都完美的狀況,沒想到錯誤狀態
  • 有功能使用者就會來用
  • 技術限制
  • 使用者

來找我討論的參賽者上述幾點幾乎全中槍。

完美狀況

也許產品在一切外在條件如 GPS、網路、已登入註冊帳號都完美的情況下,可以如預期般讓使用者操作順暢,但某個條件出問題,產品該怎麼被使用?

因為「性別暴力防治駭客松」這個主題,參賽者主要分成幾個方向在思考:

  1. 求救
  2. 預防
  3. 教育
  4. 安全社交

其中「求救」主題有組別用上 GPS、Wifi、4G 等技術,但手機萬一沒網路、沒GPS,產品怎麼辦?真在緊急狀況時使用者該怎麼辦?是不是該想想備案?

有功能使用者就會來用

全部的組別都犯了這個錯誤「我們為使用者著想,設計這個功能讓他們用」。等等,使用者真的需要這功能嗎?有功能他們就會來用?這功能幫他們解決什麼問題?

比如在緊急求救型產品裡放個論壇討論區讓大家討論。

「有人跟蹤我怎麼辦?急,在線等!」

喂!!!!

不要想在產品裡塞太多功能、包山包海啊!最重要的 MVP 先做好,再來思考其它輔助,千萬別搞得像 FF15 一樣,支線任務幾百個,主線劇情薄弱。都不知道這產品想幹嘛了。

技術限制

GPS 不是萬能,在沒開、接收不到訊號的情況下,使用者怎麼辦?如果是棟大樓呢?GPS 目前沒辦法定位不同樓層。

參賽者很容易忽略技術限制,可能各組的工程師人數不多,非工程師的參賽者對於技術領域又不夠熟悉。聽到不少幻想系的技術,真想問問你們想花多少錢做產品(不要問很可怕)。

使用者

有幾組對於目標族群下過功夫搜集資料,但他們設計出來的功能使用者真的需要嗎?

開發者考慮很多問題,但沒站在使用者的角度來看。也許很難體會到受害者的心境,但從文獻資料多多少少能推斷他們處在什麼樣的情境下。

  • 被家暴的人什麼情況下不知道自家附近的警察局在哪裡?
  • 為什麼受害者明知道警察局的所在地卻不去尋求幫助嗎?
  • 他們不尋求幫助的動機是什麼?
  • 受害者有什麼原因寧可忍耐而不聲張?
  • 這些原因是否有資源能協助?
  • 受害者基於什麼原因才有勇氣擺脫困境?
  • 我們能做什麼讓受害者有勇氣站出來?

這些才是要去深究的部份,而不是提供一連串的數據告訴受害者「你不孤單」「常見現象」。看一串數字並不會讓受害者有勇氣,搞不好會覺得大家都這樣那我再忍忍。

現在資訊非常發達,能尋求幫助的管道非常非常多。受害人不尋求幫助的原因是什麼?去除疑慮是否就能讓他們踏出第一步?

形象

找我討論的組別中,唯一一組做形象宣傳,他們想設計一款物品形象代表被霸凌者。他們舉了「黃絲帶」當例子,希望像黃絲帶一樣讓全世界都知道反霸凌。(但我問他們知不知道黃絲帶代表什麼,他們愣住。)

也許可以讓更多人注意到「霸凌」議題…重點根本不在形象代表物本身,而是多少人知道代表物的「含義」?所以,要花多少廣告行銷預算?推廣手法?成效如何?

我個人對這種形象類的頗感冒,操作完形象然後呢?跟臉書按讚一樣,對當事人有什麼樣的實質幫助?萬人響應一人到場?受害者可以找身上有形象代表物的人求救?

家人朋友都不敢信任了,要受害者信任一位陌生人,只因為一個形象代表物?祝妳好孕~

(幾位朋友給我建議,形象代表物可以帶風向、辨識敵我之類,也是,比如 1210的遊行,身上沒帶彩虹物品又混在人群裡的會不會就是…)(喂!)

但,這是個駭客松啊!

雖說很不好意思,但我一直到回家躺在床上才醒悟過來,這是個駭客松比賽,也許我不應該用「可行性」當出發點和各組討論。

上台時間那麼短,光講完產品理念就可能時間到被打斷了。比起產品好不好用、使用者會不會操作之類的 UI/UX 問題,簡報檔和台上的口條才是參賽者最該下功夫的地方。

我應該在各組一入座就先問「你參賽是為了得獎,還是做出個產品?」。再針對各組需求去指導,沒想到客戶需求是我太失策,直接認定成產品開發了…

給某學生的訪談摘要

$
0
0

這是位研究所學生的訪談內容,經由她許可我把題目和回答整理摘要放出來。其實是訪談現場咖啡店太吵錄音收訊效果不佳,我乾脆整理大綱出來讓她參考。很多問題我講得很輕描淡寫,實際上深入鑽研學問大得很,超過我的能力範圍。

(她提的訪談問題,幾乎每個都快能當研討會主題、或單獨成立一篇論文…)

想請問你覺得網站介面設計如何促進使用者與網站內容的互動性?

首先,使用者為什麼會來你的網站,他想從網站得到什麼。如果只是閒逛,什麼樣的內容可以讓他停留的比較久。

請從使用者是誰開始。

你一定用過「長得很漂亮但很難用、10秒刪掉的App」,也用過「長得普通但還滿順手的App」。重要的是使用者想從你的產品裡得到什麼,配合使用者的需求去設計。

使用者是誰,購物網站、社群網站為例,怎麼設計?

購物網站:我們賣的東西是什麼,賣給誰,市場區隔、行銷。

社群網站:使用者,年齡層需求、興趣,這個團體都會是什麼樣的人,怎麼樣讓人數快速增加並保持活躍。(第一個人加入,願意拉其他人進來。)

如何讓使用者注意到我們想給他看的內容

微互動一書中裡有提到:最明顯最吸引人注意的,是「會動」的物件,可以考慮使用動畫。把內容做成動態的形式。

Hover,動態效果,過多的動態效果導致使用者模糊焦點,若要配置該怎麼做比較適合?

內容的輕重緩急,排優先順序。最希望使用者注意到看到的內容,變化越大。

內容:圖片、影、音、文

吸引人的網站設計需具備什麼樣的條件。

  1. 能不能讓使用者快速在該網站找到他要的東西,並且使用者願意回訪。
  2. 第一眼的視覺印象。
  3. 不可抗力,報稅。(但它不一定吸引人)

你覺得網站介面設計是否會影響使用者的操作?

一定會影響,比如我開一間公司,一定要搞懂勞健保、二代健保之類的規定,但你打開健保局的網站,不是找不到想看的資料,就是有看沒有懂。

資訊架構(Information Architecture):系統組織、導覽、標籤、搜尋。

使用者會用什麼方式找到他想的資料?預期目標解答放在什麼地方?不一定進入網站就直接使用搜尋的方式。透過「點擊」方式找不到使用者要的,最後才會搜尋。

即使是購物網站,使用者進入該站不會去點選單,而是直接下關鍵字搜尋的前題是:使用者知道這個網站在幹嘛。

在設計 RWD 時,你是怎麼考慮的?

在設計規劃階段,我習慣從最複雜開始規劃。拔功能比塞功能簡單,插頁面插功能會影響操作和程式邏輯。習慣從最難的開始,或是最普及的開始。

比如 4 個尺寸:手機、平板、桌機、電視。

我的優先順序是:桌機 > 手機 > 平板 > 電視。(電視尺寸雖然較大,但能做的事沒有平板多。)

扁平風可以讓使用者在使用上更方便嗎?

  • 將注意力放在「內容」上的話,可以。
  • 第一次使用、學習,不行。
  • 比如 ATM, 老年人有可能不知道怎麼操作,點擊什麼地方。

扁平風增加互動

使用者會因為「想完成什麼任務」,或因為有趣而多操作幾次你的網站,這和風格沒有絕對的關係。取決於使用者的動機。

你認為應用扁平化設計與 Material design 是否在網站使用上更具吸引力?

這要看設計師的功力和使用者對此產品的需求。使用者要的是「內容」。

比如計算機。使用者會想要什麼樣的計算機?比起外觀,使用者比較在意易用性、程式穩定性,還是非得要華麗漂亮?

你覺得扁平化設計與 Material design 在版面配置上需要注意甚麼?

  • RWD 扁平化、物質化,主力年輕人。
  • 和我合作的工程師功力。
  • 產品目標族群。
  • 先求會動、再求好。

架設一個網站,你會考量哪些因素?

  • 使用者是誰,他要什麼、我們網站可以提供什麼給他等等
  • 客戶是誰,他的目標是什麼、我可以幫他解決什麼問題、他有哪些資源能讓我使用等等。
  • 開發限制。比如成本、時程、技術限制之類。

良好的 UX 網站該具備什麼

(我對 UX 網站這詞頗反感,使用者經驗網站是尛…)

  • 使用者要的東西能快速且容易被找到。
  • 快速且順利完成任務,遇到問題也能知道怎麼解決。
  • 視覺、動畫巧思等等。

如何驗證使用者需要的和我們規劃的一致。

Prototype,或是直接上架肉身去測風向。

結論

其實上述這些問題,幾乎都有「約定成俗」的常見答案,多翻點書,根本不需要找人訪談。如果不知道要看哪些,把歐萊禮出版社所有和 UI/UX 有關的書全看完也都能回答得了上面的問題。

這次訪談我有種被考試的感覺。

很難用的 Touch Bar,別買

$
0
0

我在粉絲團 po 了這段:

我買了新款的 MacBookPro,有 TouchBar 的那款。超他媽的難用!

  1. 鍵盤不是普通的難打,根本和 ipad 平的鍵盤同等級難用。
  2. 該死的 Touch Bar,對一位設計師和工程師來講,ESC 有多重要!
  3. 該死的 Touch Bar,Photoshop 有多少快速鍵設在 F1~F12 這排,要按住 Fn 才能叫出 F1~F12,還要低頭看一下按鍵位置,算哪門子快速鍵。
  4. 該死的 Touch Bar,就連平時桌面操作,我也設了一堆快速鍵在 F1、F2 上,全廢了。



從 系統偏好設定 > 鍵盤 可以設定 Touch Bar 的顯示方式。右下角「自訂 Control Strip…」能依據 Touch Bar 顯示設定的不同對應不同的按鈕。

Touch Bar 顯示

在講 Control Strip 之前,先來聊聊原本 Touch Bar 位置這條 F1~F12 最重要的功能有哪些。

先不提我自己設的個人習慣,以內建設定來說,ESC、Mission Control x3、螢幕亮暗、音量大小、Dashboard,共 9 顆鍵很常用。

1. 附有 Control Strip 的 App 控制項

這個設定表示 Touch Bar 左半邊會依據現在操作的 App 不同,出現不同的控制按鈕,右半邊固定顯示自訂的 Control Strip。只是這小塊區域要點個小鍵頭打開,不然按鍵不夠放。

2. 展開的 Control Strip

不管現在操作的 App 是哪個,固定出現這些按鈕。預設值是螢幕左上那一長條,鍵盤上是我自己調整過的。依據我自己的使用習慣,Mission Control 的使用率比 螢幕亮度、音量高出太多,放左手邊。

3. App 控制選項

只會顯示現在操作的 App 控制項,不給別的。因為現在在系統偏好設定裡,所以 Touch Bar就短短的 3 顆。

…喂,所以我不能調螢幕亮度音量了?一定要跳出系統偏好設定,Touch Bar 才有控件讓我按?

按下 fn 顯示

然後,我終於把 F1~F12 叫出來了。只是要多按一個按鈕,而且沒有實體觸覺,要低頭看一下鍵盤才知道手指該往哪裡摸。(照片上我按住 fn 鍵不放。)

失去 F1~F12 表示失去一大串快速鍵,因為我裝了 Overflow(cmd+F1) 和 Bartender 2 (cmd+F2) ,所有日常操作全死了。

3 支手指去按 fn+cmd+F1 試試?超彆扭。

進入 Photoshop

來,咱們設計師最重要的 Photoshop。發表會上說多好用多好用…實測下去根本腦殘!

複習一下 Touch Bar 3 種顯示設定:

  1. 附有 Control Strip 的 App 控制項
  2. 展開的 Control Strip
  3. App 控制選項

按下 fn 顯示 有 2 種選項:

  • 顯示 F1、F2 等按鍵
  • 顯示 App 控制選項

好,咱們回來看 Photoshop。

這是附有 Control Strip 的 App 控制項。除了左邊有 Photoshop 的控件外,右邊有一塊亮度音量的操控區域。

這是展開的 Control Strip。也就是不管開啥 App,Touch Bar 永遠顯示這幾顆。

這是App 控制選項

好,這種情況下,我要按 F1~F12 的快速鍵時怎麼辦?按下 fn 顯示

如果你設的是「3. App 控制選項」就會和 fn 「顯示 App 控制選項」衝到。都會長一樣。但我需要 F1~F12 的快速鍵,fn 你只能選「顯示 F1、F2 等按鍵」,沒別的。

接下來也不用煩惱是選 1. 附有 Control Strip 的 App 控制項、2. 展開的 Control Strip、
3. App 控制選項 哪一個了。

選 2 =Touch Bar 擺好看,單純控制螢幕亮度音量。
選 3 =你放棄控制螢幕亮度音量。

只能選 1 啦~還是你要放棄所有 F1~F12 的快速鍵?

Photoshop 的快速鍵沒有因為 Touch Bar 更改喔!

想完整使用 Touch Bar 就會變成以下操作:

  • 要使用 F1~F12,請多按一顆 fn 鍵。組合鍵非常難按,不想練手指軟骨功就雙手操作吧。
  • 要使用螢幕亮度音量,請按下 Touch Bar 右邊的小箭頭展開選單。
  • Mission Control?用手勢或熱點吧,別指望 Touch Bar,脫褲子放屁。

個人操作習慣

每個人的操作習慣不一樣,我的 MBP 在未按 Fn 的情況下,預設就是 F1~F12,要調亮度音量反而才要按 Fn。

所以就算不開 Photoshop ,我的 F1 要負擔 3 顆快速鍵功能:

  • F1 Mission Control 應用程式視窗
  • F1 + fn 螢幕調亮
  • F1 + Cmd Overflow

F2 也要負擔 3 顆快速鍵功能:

  • F2 Mission Control 顯示桌面
  • F1 + fn 螢幕調暗
  • F1 + Cmd Bartender 2

身為設計師,右手拿著 Wacom 筆,鍵盤快速鍵大多只靠左手單手操作,如果右手必須回到鍵盤上打快速鍵還快得起來嗎?而且在有 Touch Bar 的情況下,就算不開 PS 我的日常操作也死大半。

還不算上非實體的 ESC 對應 PS 的「取消」造成多大的困擾。

結論:他媽的超難用!

這幾個字我要放超大,Touch Bar 靠北邊走的難用!真不知道它是設計來幫助使用者還是來添亂的。

說 Touch Bar 是給專家用的?哪個專家用 Photoshop 不打快速鍵?不自訂一堆快速鍵?有多少設計師右手操作 Wacom 板、把快速鍵盡量設成左手單手可操作?(為了 Ctrl+Z。)

幾乎和 F1~F2 有關的快速鍵,好多都單手按得超彆扭,要 2 隻手才有辦法。說 Touch Bar 是給新手上路、MAC 拿來當上網機的我還比較信。要我右手在 Wacom 板上畫一畫,再回到鍵盤 2 隻手按快速鍵,哪裡快得起來?

Control Strip 的自訂功能根本是來搞笑的,不要指望了。Touch Bar 可以針對特定 App 固定顯示 F1~F12 ,但不能對整個系統設定,而且它也不應該這樣設定,這樣就失去 Touch Bar 設計出來的目的。

Touch Bar 是為了改變人們對鍵盤的操作模式,但又無法提供更方便的操作模式,對我這種已用 Mac 16 年且超愛打快速鍵的重度用戶來說只是場災難。

我只有這麼一台電腦,同時是工作機和遊戲機,所以願意砸錢換好一點的,希望提升工作效率、能撐 3 年再換新。

台灣公佈 122可以下訂時我就衝了,這時間點扣掉官方和業配,爬得到多少一般民眾的實際 Photoshop + Touch Bar 操作體驗文?

結果噴了台幣 7 萬給我這種東西?退貨鍵按下去!換沒 Bar 的那台新款,便宜一點,也比較省電。

(如果 ESC、F1~F12 還在,但多一排 Touch Bar,我就會覺得是好東西了。)

Table of Contents

$
0
0

對於 UI 設計來說,「內容」有 4 種:圖片、影片、聲音、文字。不管使用者最終想看到什麼、操作什麼樣的任務,都需要「內容」。那在開發流程中,「內容」會在什麼時候決定?

之前在 讀者來信:UI 設計流程文中有提到我自己的開發流程為:

  1. User Story
  2. Functional Map
  3. Flow Chart
  4. UI Flow
  5. Wireframe
  6. Mockup
  7. Prototype

那麼,哪個階段思考「內容」是什麼會比較適合?

User Story

這個階段主要在討論使用者需求,不需要也最好不要在這階段就把內容都訂定出來。在功能都還沒確定的情況下就訂到內容這麼細節的部份只會整死自己。但如果專案很小,那在 User Story 可能就會把使用者想看到的內容都列出來了。

如果想在這階段就把內容都詳細列出,就會從「猜猜看」開始。不知道使用者的操作流程、也不曉得產品會擁有什麼功能、使用者會怎麼運用這些功能,如何得知產品需提供什麼樣的內容才能幫助使用者完成任務?

Functional Map

Functional Map 把 User Story 列出的使用者需求變成功能規格。這個階段會牽涉到資料來源,會考慮大方向的內容,但不會訂得非常詳細。

畢竟在 Functional Map 整理功能規格階段,開發者無法得知使用者怎麼操作這些功能完成任務,當然不會知道使用者會經過哪些頁面、也沒辦法規劃每一頁需要哪些內容。

Flow Chart

Flow Chart 在探討使用者怎麼操作功能,會有判斷式、邏輯、迴圈等存在。只有在確定使用者的操作後才能知道產品需要在什麼情況下,使用者需要什麼樣的內容,配合操作、狀態提供各種回饋、提示、訊息。

UI Flow

如果要訂定每一頁包含什麼樣的內容,起碼也要知道產品需要哪些頁面、頁面流程怎麼串吧?所以訂定內容這件事至少要等到 UI Flow 階段才有辦法執行。

Table of Contents

Table of Contents 翻成中文為「目錄」,我自己是把它當成備忘錄在寫,簡單來說就是「這一頁包含哪些內容的列表清單」。

比如說,UI Flow 裡的 1.1.2 餐廳詳細資料頁。內容清單我會這樣寫:

1.1.2 餐廳詳細資料

  • 餐廳名稱(分店)
  • 餐廳電話
  • 餐廳地址
  • 餐廳營業時間(24H)(考慮午休)
  • 地圖
  • 交通方式(公車、捷運)
  • 餐廳照片(1~5張)
  • 菜單(照片?文字?)

依專案規劃可能再加上使用者評論、星等、附近餐廳資訊;地圖或交通方式配合前期決定的導航功能等等。括號()裡的文字我會寫下:

  1. 呈現樣式。
    比如營業時間要用 08:00~20:00 還是 AM/PM。

  2. 提醒事項、或尚未確定資料來源的備忘。
    提醒自己記得去問問 PM 這些內容細節規格。比如菜單要用照片還是文字?資料怎麼來?問明白後更新。

在寫 Table of Contents 時記得把 User Stouy、Functional Map、Flow Chart、UI Flow 全掏出來攤在桌上參考。這幾份文件都和內容清單有關,如果不想漏東西之後硬塞,最好同時一併參考。

很有可能內容清單列了一堆,開會時大家都覺得「嗯,很好」,但開始追究資料來源一項項討論時整個人都不好了。

Wireframe

當然,我會偷懶,不是每個專案都會好好出一份電子文件的內容清單。小型專案我會到 Wireframe 才開始規劃出每一頁包含什麼內容。大約就是手寫很醜的字在 A4 廢紙背面只有自己看得懂的程度。(只有小專案才敢偷懶,大型專案絕對乖乖寫清楚講明白,太複雜不要考驗腦袋容量。)

Wireframe 包含所有內容呈現方式,以及觸發、回饋、狀態變化等等。所以在這個階段如果內容是什麼都還沒確定下來也不用畫 Wireframe 了。

畫 Wireframe 時同樣要把前面幾份文件全部掏出來攤在桌上,尤其是 UI Flow 和 Table of contents。畫好一頁 Wireframe 就到這兩份文件上,找對應的那一頁打個勾,確保沒有漏畫。

「餐廳名稱(分店)…有畫了,打勾!」
「餐廳電話…畫了,打勾!」
「餐廳地址…畫了,打勾!」

確定內容

前幾個步驟做文件畫 Wireframe 之類都還事小,最麻煩的就是「確定內容」這件事了。當專案一大,資料來源可能由四面八方各單位匯集,還得算上各單位的合作廠商。來回勾心鬥角搶資源溝通開會我都想哭了。

舉個例子,以一個拍賣平台來說,使用者有哪些身份?最少也有 3 種:

  • 平台
  • 買方
  • 賣方(專職賣家、個人散戶)

平台方至少還可以再畫分成:負責賣廣告的單位、負責招募賣家的教學單位、負責讓更多人知道平台的行銷單位等等。

上述各種身份有沒有可能全部都想搶「首頁」這版面?曝光率高嘛,各單位有各單位的業績壓力。內容由誰提供?總不該是設計師或工程師下去搞,肯定由各部門負責。

然後,你就會體認到內容這件事搞不定了…(真想和他們說,你們出去打一架,打贏了再來跟我們 UI/前端/iOS/Android 說首頁這區塊要放誰的內容。)

老話一句,文件不是死的,隨著專案進度推進,Mockup 都畫下去了才發現不適合要回頭去修改前幾份文件是非常常見的事情。別想著一步到位。有發現提早修改,總比產品都上架了再讓使用者抱怨好多了。

小專案還好,如果是大產品大專案,放心啦內容不會有真正被確定的一天,和各單位來回糾纏就飽了,慢慢改來改去吧。就算單位打包票說不改,誰知道他們單位的客戶又突然發生什麼變卦…

Prototype 大觀園:Prototype 優劣分析步步來

$
0
0

本文同步刊登於 NTUChallenge Blog 挑戰誌

很多專案在開發過程中,會製作 Prototype(原型)測試與驗證構想。專案開發會經過許多階段,也有很多種製作 Prototype 的方式。該如何配合專案開發進度,製作適合的 Prototype?

Prototype 用途

開發者對於產品一定有各式各樣的想法,並盡力讓使用者覺得產品「好用」。但開發者該如何確定目前產品設計走向能讓使用者覺得好用?可透過「使用者測試」這個方法驗證。我們可以透過 Prototype
測試使用者想透過產品完成某項任務時,需經過哪些頁面的流程;觀察使用者在操作過程中是否有感到任何不順或遲疑的地方等等。

有些文獻將,Prototype(原型)分成低保真、高保真等等。我將 Prtotype 粗分成:

  1. 紙本 Prototype
  2. Wireframe
  3. Mockup
  4. Web
  5. Code

每一種 Prototpye 用途、製作方法、成本、使用時機都不相同,各有利弊。

紙本 Prototype

最快速的 Prototype 製作方式,只需要紙筆即可完成,不需要經過耗時的專業訓練即可上手。只要在紙上繪製簡單的 Wireframe (線框圖)就能進行使用者測試。

要製作紙本 Prototype,需先考慮使用者想操作產品完成某一任務時會經過的所有頁面,繪製簡易 Wireframe。

使用時機

  • 專案初期,已確定功能,尚未正式開始繪製 Wireframe 文件時
  • 適合內部討論。

優點

  • 製作成本低
  • 製作容易、速度快
  • 修改方便
  • 產品開發初期就能確認操作流程,在尚未投入大量人力進行開發前即時修改設計

缺點

  • 失真嚴重,和最後上架產品落差極大
  • 使用者操作紙本 Prototype 和操作電子產品感受和習慣完全不同
  • 使用者有可能看不懂 Wireframe

這是我最少使用的製作 Prototype 方式,雖然只要紙、筆、便利貼…等文具就可以完成,但和最終產品落差太大,主要拿來測試 Wireframe 內容版面配置、檢查有沒有漏頁面。

或者是和 PM 或 RD 討論過程中各執一詞僵持不下時,為了說服他人而製作的簡易 Prototype,開發團隊內部討論使用。但也和實際手機或網站上操作落差太大,效果不佳。

UI Stencils | iPhone Stencil Kit這間公司提供很炫的金屬樣板,包含 iOS、Android、Web 等等,可以手繪出漂亮整齊的 Wireframe 。不見得好用,但擺在桌上看起來就很專業。我手上的是第一代,目前樣板已經更新很多次版本了。

Wireframe

因為使用者操作紙本 Prototype 和操作電子產品感受和習慣完全不同,保留快速製作 Prototype 的優點,改善操作落差極大的缺點,延伸出這種製作 Prototype 的方式:

  1. 繪製紙本 Wireframe
  2. 拍照
  3. 在照片上設定觸控範圍、Link

使用時機

  • 專案初期,已確定功能,尚未正式開始繪製 Wireframe 文件時。
  • 適合內部討論,或和有經驗的客戶溝通。

優點

  • 改善使用者操作紙本 Prototype 和操作電子產品感受和習慣完全不同
  • 製作成本低、容易、速度快
  • 修改還算方便
  • 產品開發初期就能確認操作流程,在尚未投入大量人力進行開發前即時修改設計

缺點

  • 失真嚴重,和最後上架產品落差極大
  • 和真實使用者情境幾乎不同
  • 使用者有可能看不懂 Wireframe

真要拿手繪 Wireframe 製作 Prototype,我會使用 POP - Prototyping on Paper,可以在極短時間內將手繪紙本 Wireframe 製作成可操作的 Prototype。減少紙本和電子產品在操作上的落差,盡量接近實際使用情境。

我大多拿來測試「單一任務」的操作流程,不會把整個產品都做成 Prototype,頁面太多管理不易,要修改也麻煩。

手繪 Wireframe 等級的 Prototype 我都不會當成是正式測試,頂多拿來確定「這樣做使用者能夠順利完成任務嗎」,和最後產品落差實在太大。而且就算是資訊公司,主管、老闆、甚至開發團隊裡看不懂 Wireframe 的人也是有,看不懂也沒辦法拿這個和對方溝通討論。

早期經驗不足時,會依賴這種作法來驗證自己的設計,幾年下來會發現工具型 App 介面大同小異、操作方式就那幾套。除非是遊戲類、創新/找不到參考的介面設計,不然我不會製作 Wireframe 等級的 Prototype。

Mockup

許多使用者看不懂 Wireframe,直到 Mockup 階段才能理解。若要對外部進行使用者測試,Prototype 盡量拿接近最終發佈的產品,得到的結果較精準。

使用時機

  • 已確定 Wireframe,需要測試視覺設計對使用者的影響時。
  • 外部測試最基本的 Prototype 樣式。

優點

  • 擬真度高,接近最終發表產品。
  • 使用者容易理解
  • 可測試視覺設計對使用者的影響。

缺點

  • 修改較麻煩
  • 只能驗證預期內的操作任務
  • 和最終產品仍有落差
  • 當使用者有預料外的操作時無法反應

現況我最常做的 Prototype 是這類型,用 Mockup 製作出來的 Prototype 不管對內或對外,使用者都看得懂。

目前業界不少人製作 Mockup 等級的 Prototype 時,會使用 InVision,簡易快速易上手,且支援團隊協作。可免費試用,對於初次接觸 Prototype 的開發者來說,短短時間就能做出有模有樣的 Prototype。

雖然 Mockup 等級的 Prototype 沒辦法確認程式資料面的狀況、也沒辦法測試當使用者操作不是按照規劃預期時產品如何反應,但就以視覺設計、內容排版、操作易用性來說,Mockup 等級的 Prototype 算是不需要動用工程師撰寫程式,只需要設計師執行、成本較低的 Prototype 製作方式了。

Web

介於 Mockup 和程式製作間,靜態 HTML,尚未套後台串資料庫,使用假資料。能測試動態效果對使用者的影響。

使用時機

  • 已確認 Mockup
  • 需確認動態效果對使用者的影響

優點

  • 有數值的動態效果,供開發者參考
  • 比 Mockup 更精準的 Prototype
  • 可掛 GA 讓外部使用者進行封測、收集數據

缺點

  • 開發時間較長
  • 專業技術需求較高
  • 修改不易

幾乎只要動用到工程師寫程式,製作成本就會提高,Hype3能讓設計師不用寫程式碼就產出 HTML、CSS、JS,功能強大、容易上手、支援中文介面。是我愛用的工具軟體,尤其在製作動畫效果,配合時間軸和場景、物件等,可以在短時間內做出假以亂真的 Prototype。

如果要測試動態效果,最低限度的 Prototype 要做到 Web 這個等級。順帶一提,Hype3的物理引擎非常有趣,不在意產出的程式碼和效能的話,做簡單的小遊戲很有意思,單純拿來做 Prototype 有點大材小用了。

Code

離上架產品只差一步,已套程式資料庫。到這一步再來測「好不好用」已經來不及了,真要修改勞師動眾。在這階段要測的是各種「錯誤」,比如使用者操作錯誤;GPS、Wifi 不通時產品怎麼回應使用者等等,還有程式 Bug。

使用時機

  • 產品上架前的最後測試

優點

  • 幾近於最終產品,測試結果最貼近上架後的使用者反應

缺點

  • 開發時間最長,成本高
  • 專業技術需求較高
  • 修改不易

無論是 Wireframe、Mockup、Web 產出的 Prototype,都沒辦法完整檢視整個產品。只有到了程式碼階段、工程師套好程式串資料庫,才能測試產品各個面向對使用者操作上的影響。

動用人力多、成本極高,一旦發現問題要修改會燒更多錢,但每個產品上架前最好都要經過這個步驟。

結語

Prototype 是拿來驗證、找出問題的方法,不是有做就能保平安。Prototype 只能告訴你問題在哪,不會告訴你問題怎麼解決。

不管是什麼樣子的 Prototype、修改再多次,產品上架後一定會有更多出乎意料的各種狀況。公開發佈前有先做 Prototype 測試,起碼開發團隊知道問題出在哪、有機會改善它。不做 Prototype 就直接上架,產品的問題在哪就是由使用者透過一星評價或客訴來告訴你了。

Viewing all 448 articles
Browse latest View live