我買了 Simon Ng 寫的 iOS 9 App程式設計實力超進化實戰攻略 (Beginning iOS 9 Programming with Swift)，學習怎麼用 Xcode 和 Swift 做 App。

這本書非常推薦設計師和完全不懂程式的初學者購買，前幾章都在講 Xcode 的 GUI 操作和實例，跟著範例自己做個會動的頁面出來很有成就感，能學到很多。

UI 設計師要懂 Auto Layout

我跟著書裡第 5 章範例做的 Auto Layout 練習，有置中的標題、置中的按鈕，和底部偏右方對齊的文字。

左，iPhone 4s ，標題和 Hello World 按鈕 置中，但畫面長度不夠下方文字沒有顯示。 中，iPhone 5s ，標題和 Hello World 按鈕 置中，下方文字置右，一切正常。 右，iPhone 6s ，標題偏左、按鈕偏左、文字位置也跑掉了。

UI 設計師都知道要給工程師的標示文件上需要寫明尺寸、間距等等，iOS 可以給座標。但在不同手機尺寸下，給座標就會出現上圖那樣的情況。

先來解決不同尺寸下元件位置會跑掉的問題，就要使用 Auto Layout 啦。（暫時跳過 Portrait 和 Landscape 的畫面變化，以及 Universal App。）

對齊與定位

其實看到這 2 個工具大概就猜得出工程師會怎麼設定 Auto Layout 了吧。（雖然工程師都寫 Code 直接處理，但拿 GUI 出來講總是比較容易被看懂。）

• Align：對齊。建立一個對齊的約束條件，ex 元件置中對齊。
• Pin：定位。建立間距約束條件，ex 元件上、右、下、左的間距。

所以設計師出標示文件給工程師的時候，需要寫明對齊方式和定位。比如 A 和 B 之間距離多少？置中還是置左？某元件如果要固定在左下角是不是要標明距離左和下的數值…等等

實例

因為尺寸不同所以版面跑位的情況，可以透過設定 Auto Layout 解決。設好後 Storyboard 會出現幾條輔助線。

標題

不管螢幕尺寸變化，標題都希望要置中，且距離頂端的位置要固定。

按鈕

按鈕設為「水平對齊」、「垂直對齊」。這樣不管在哪種螢幕尺寸下它都在正中間。

文字

文字設定距離右邊和距離底部的尺寸，不管螢幕尺寸變化，這行文字都會固定在右下角。

ma…這就產生一個新的問題，比如 avocode 和 zeplin 這類不用設計師出標示文件的好用外掛，如何讓工程師知道在不同螢幕尺寸下，各元件的位置呢？設計師哪有這麼勤勞針對各種螢幕尺寸出一堆原始檔。

看是要拼一定點另外寫份標示文件，或是乾脆放手讓工程師處理掉了吧。

延伸思考

Auto Layout 不只能處理各種螢幕尺寸下元件位置的版面問題，Portrait 和 Landscape （手機轉橫或轉直）間的切換也可以用它來處理，甚至 Universal App（iPhone 和 iPad 同一支 app 程式），iPhone 和 iPad 之間的 Responsive 也可以透過 Auto Layout 搞定。

嗯，這就來討論下 1. 為什麼 Landscape 要用 Auto Layout，2. 為什麼 Universal App 要用 Auto Layout。

為什麼 Landscape 要用 Auto Layout

從使用者的操作，簡單分成 2 種可能性。

1.手機轉橫是為了看更大的畫面，比如 Safari。 2.手機轉橫會觸發不同的功能。（可參考舊文：Portrait 和 Landscape，談螢幕方向）

如果是為了看更大的畫面，功能元件幾乎相同，用 Auto Layout 我覺得很方便省事。

如果會觸發不同功能甚至換個介面，那用 Auto Layout 想幹嘛？當然是刻個新的 UI 啊！

為什麼 Universal App 要用 Auto Layout。

同上方的理由，iPad 的介面和 iPhone 的介面會完全一樣嗎？iPad 螢幕比 iPhone 大那麼多，操作情境、功能複雜度不會一樣。

而且，在開啟 App 時就判定 App 被裝在哪種裝置上，讀取 iPad 或 iPhone 的程式碼，都比用 Auto Layout 乾脆實在啊。

. . .

Auto Layout 入門教學一文說明介紹 Xcode Auto Layout 設定方式、詳細操作等，可以去看這個網頁喔！

週日上課時有學員問起我最近有沒有推薦的書，Blog 很久沒更新、也超久沒看到書籍分享了。 （呃…去年太忙，今年也很忙，剛買 PS4 卯起來打 FF 零式，正被劇情折騰。） 好書很多，不知道從哪裡下手，先分享下我書櫃長什麼樣子好了。

看過覺得不那麼重要的或講太淺的被我放去其它書櫃了，這邊擺的是我喜歡、比較常拿出來複習的部份。

之前在群裡有分享過照片…被碎念一頓，說很亂都不整理，看是照顏色或是照身高排都好，怎麼排成這樣。個人習慣照書籍內容整理，所以書櫃看起來很亂…幹、看書的人是我，我能快速找到想看的那本書就好了啊！

底下特別標出來的為必買。

UI/UX類

• 設計的方法：100個分析難題，跟成功商品取經，讓設計更棒、更好的有效方法
• 微互動
• About Face 4

視覺設計、品牌、創業思維類

• 為什麼他接的案子比我多？：設計業界潛規則，讓你接案上班都無往不利
• 好LOGO，如何想？如何做？：品牌的設計必修課！做出讓人一眼愛上、再看記住的好品牌+好識別

（台灣的書名是在比長的嗎？書名越長賣越好？）

字體設計、其他相關

初學者

這幾本都很淺，是入門書。

別做天兵設計

UI 新手、剛轉行、不知道 UI 工作流程為何的可以看這本。

User-Centered Design使用者導向設計

講 UX 工作流程入門書。不知道現在口號老愛喊使用者在使用三小的可以看這本。然後就知道很多人習慣喊「使用者為重」跟幾百年前喊「反清復明」一樣，喊喊而已，不會跑研究方法的啦。

為什麼他接的案子比我多？

不只設計師，我覺得剛畢業的職場新鮮人都可以看這本，講很多和專業無關、但踩到雷要怎麼處理的實用技巧與心態建立。

這樣 O 那樣 X 馬上學會好設計 (1)

適合非本科、換跑道的設計師看。剛畢業的本科生也該看一下…

UI 入門班的 QA 時間，有學員問「User Story 和 Customer Journey Map 有什麼不同？」順便把 Persona 和 Scenario 混在一起…

• Persona （人物誌）
• Scenario （情境故事法）
• User Story（使用者故事）
• Customer Journey Map （使用者旅程地圖）

Persona （人物誌）

產品使用者的典型人物原型。將這些使用者的共同點如生活狀況、目標、行為等層面集結成一位虛擬人物。之後產品開發將依此人物當做設計目標。

Scenario （情境故事法）

從使用者的觀點探討產品的使用狀況，敘述一位使用者在什麼情境下使用產品、怎麼使用等等。

Customer Journey Map （使用者旅程地圖）

敘述某位使用者和產品或服務互動時所產生的行為、感受、感知和心境，包含正面、負面、中性時刻。分成各個階段呈現，且各階段可接受個別評估和改善。

（上述介紹截自 設計的方法一書。）

會發現 3 種文件關注的點不一樣，往往 3 份文件是一起製作或接連進行。

1. Persona：使用者是「誰」、什麼樣的人。
2. Scenario：使用者在什麼情況下使用產品、怎麼使用。
3. Customer Journey Map：使用者在和產品進行互動時產生什麼樣的情感、能被評估改善。

必需先知道使用者是誰，才能預估他的操作行為，並從和產品之間的互動得知使用者的情感，加以評估改善。這 3 項是研究方法，分析探討使用者的方法。

User Story（使用者故事）

敏捷開發常常會使用 User Story 當做溝通工具。有經驗的都知道，專案開發過程中最大的問題都不是技術，而是溝通。

台灣的業主大部份都會先提出幾個功能，腦補使用者有多讚美他想到這些功能，幻想使用者用得順手又愛死了的情況。然後叫開發人員把腦海中的妄想做出來。但現實和妄想完全是兩碼子事。

User Story 可以幫助團隊認清現實，從使用者需要什麼、他會怎麼操作開始，從中找出功能。也就是先有使用者才來想功能，此時開發出的功能比較不會淪為腦補自爽。

（但使用者是誰呢？請用 Persona。） （使用者會什麼情況下、怎麼操作產品呢？請用 Scenario。） （他在互動的過程中感覺到什麼呢？請用 Customer Journey Map。）

User Story 和 Customer Journey Map 都使用「故事線」當主幹，畢竟都採取「從使用者的行為找出關鍵點」的概念。但兩者關注的部份完全不同。User Story 目的在從使用者的操作行為裡找到各種功能、並排出優先順序；而 Customer Journey Map 則是關心使用者在各階段互動的情感並想辦法改良、提升滿意度。

使用者的身份會影響操作方式和欲完成的任務。User Story 需同時考慮不同身份的使用者。例如叫計程車的服務，這項服務的使用者身份可能有下列數種：

1. 乘客
2. 司機
3. 後台管理員

乘客關心乘車品質、收費、服務、效率等等。 司機在意是否能快速載客等等。 後台著重在數據與報表、會員資料等等。

Customer Journey Map 只會告訴你使用者因為什麼原因所以覺得不高興，無法提供讓使用者高興的解法。User Story 可以探討使用者想要什麼功能、重要的先開發、達成團隊共識，卻沒辦法確定這樣做下去後使用者是否滿意。

但從許許多多的「方法」來看，先熟悉使用者想要什麼再來開發，會比先有功能再來幻想使用者有多愛用來得實際。

年代久遠，我忘記當時待在哪間公司、是哪位 PM 發起這種方式來安排時程，就某些角度來講很實用，起碼 減少許多 UI 設計師必須和人到處喬工時和工作內容的麻煩。有問題你們 PM 自己出去打一架，打贏的再回來跟我說那個時段要做什麼事。

首先一個人上班的時間是固定的，非緊急必要時刻不應該把加班變成常態…PM 掌控時程無能搞到團隊人人加班，要檢討的是 PM 失職，怎麼可以把加班急救當成理所當然。

所以公司如果上班時間規定是上午 10 點到晚上 7 點，中午 1 點到 2 點是休息時間，在 Google Calendar 上的時間就可以拉成這樣。（紫色那塊是文章說明用，實際運作不會有區塊叫「上班時間」。）

今天有個工作叫[APP] 修改 A 客戶 UI Flow，PM 和你討論過這個工作，你預估要花上 2 小時。討論好後，PM 在 Calendar 空著的時段新增一筆。

注意：一定要先討論過、由實作人員預估工時，PM 才可以在 Calendar 上新增工作。當然估工時非常困難總是會有意外，這部份晚點我會講自己的作法。

如果要開會，會議時間也要加上去。總不能叫設計師邊開會邊做事吧？那個時間被會議卡走了啊！

排工作時，記得把中午休息時段空出來，人家設計師也是要吃飯的！

對應意外插單急件…基本這種事情幾乎天天發生，千萬不要傻傻的一天 8 小時的工時就以 8 小時當單位全部排滿，會出人命的！一天可以安排的工時抓 6 小時就差不多了。多出來的 2 小時就是為了應付雜事。

比如 RD 在刻 UI ，發現漏切一張按鈕 icon 圖，跑來向設計師討，這項工作很簡單， 15 分鐘內可以搞定，但它也需要花時間去做。此時要不要排進 Calendar 時程裡？

或是 RD、PM 臨時抓你討論點小東西，占去 30 分鐘；下午茶來了，休息 15 分鐘和同事打屁一下…等等。像這些工作都會占去設計師的時間，卻也沒大到以「小時」當單位。所以我一天工時排 6 小時並不是做完 6 小時就沒事了，留下 2 小時的彈性時段要拿來處理這些零碎任務。

千萬不要把自己當機器啊，說 14 點開始到 17 點都在畫 Wireframe，就真的只做這項。彈性時間會分散在一天工時裡，當然你想照表操課也行，同事會養成有雜事叫你做就集中在下午 5 點 ～7 點這個時段。

這種排工時的作法有很多好處：

• Google Calendar 免費、中文、上手快。
• 你很清楚知道自己今天要做什麼事。
• 別人看得到你今天要幹嘛，不會亂排工作給你，不用擔心工作量太大被塞爆。
• 要是被質疑沒在做事，Calendar 上都有紀錄。
• 週末要寫工作週報也很好寫。
• 即使多位 PM 對你 1 位設計師也不用擔心光是喬工時就飽了的情況。

當然，如果你家 PM 白目到一個時段重複塞多個工作叫你做，這我也沒辦法，去找你主管談吧。

我在接案公司的時候，一週經手 5~8 個不同的 Case 、對上至少 4 名 PM 是常態。此時 Calendar 允許多人編輯非常好用。把 Calendar 的名稱設成 PM 的名字，每個人顏色都不一樣。誰在某個時段派了什麼工作給你一目了然。

另一個好處是，如果 PM 1 號有急件希望你趕工，但那個時段 PM 2 號 已經排工作了，可以請 PM 1 號先去找 PM 2 號打一架…呃、協調，看誰最後勝出你就優先做他的任務。

Calendar 基本由 PM 群在編輯管理，如果你們公司的 PM 連控管時程的能力都沒有，你還是自己管自己的工時吧，有證據就有底氣去跟 PM 吵：「老子的工時全滿了有種你叫我加班啊！」

…雖然真的有 PM 會叫你加班啦，這招要看人用。但最最少你有憑有據要吵也比較容易吵贏。

補充：此文一出，中國朋友跟我說了當地業界狀況，Google 被牆、Calendar 代用品難找、大部份都口頭交辦等等。好吧，有個比較陽春土砲手工的方法。

手帳本知道吧？找有時間軸的那種，有把一天 24 H 列出來，自己手動寫吧。要和人員談事情總是要有點證據，不能指望公司或 PM ，總是要靠自己弄點自救方案。

「設計思考改變世界」在剛出版的時候就入手，並快速翻閱過。這陣子重看「為真實世界設計」，發現有些觀念自己並沒有好好思考過，兩本書一起比對時有點吃力，只好先暫時放下「為真實世界設計」，回過頭慢慢推敲「設計思考改變世界」書裡的各種概念。

「設計思考改變世界」共有 10 章，如果可以我真希望能把每一章的內容都寫點心得。只希望自己不要又半途而廢了。

第一章：打動人心，或設計不只關乎風格

創新三空間

• 發想 inspiration
• 構思 ideation
• 執行 implementation

發想、構思、執行 3 個空間彼此重疊，在創新的過程中，將在這 3 個空間裡不斷來回。

發想

刺激你尋找解決方案的機會與需求。

什麼事物需要解決方案？遇到什麼問題？我們要怎麼確定這是個問題？什麼情況下會出現？誰會遇到？ 所以有 Personas、Scenarios、User Journey Maps…各種研究方法幫助我們縮小範圍、確認問題點。

構思

想法的催生、發展、驗證。

「為真實世界設計」書中提到：

為解決問題而存在的設計雖然無法找出唯一的正確解答，卻能找出包含某些「更正確」，以及某些「更錯誤」的答案在內的無數解答。

如何確定在發想過程中找到的「解答」是「更正確」的？使用者測試能不能幫我們驗證？

執行

從研究室通往市場的步驟。

也許在構思和發想階段我們能夠找到許多不錯的「解答」，但概念想法要被實現會面臨非常多的「限制」。這也是我認為設計師一定要跨領域學習的原因。以 UI 設計師來說，不知道平台限制、不知道技術限制、不知道資料來源、也不知道手邊有哪些資源，那設計師如何做到「把概念化為現實」？

「叫工程師做就好了啊～」

成功構想的三大準則

設計過程的第一階段通常就是找出有哪些重要限制，然後建立評估架構。可以利用成功構想的三大準則來找出限制。少了限制就不可能有設計，而最好的設計往往來自於最嚴苛的限制。

• 可行性 feasibility
• 存續性 viability
• 需求性 desirability

可行性

產品的功能在應用上的可行性。配合創新三空間的「執行」來看，總不能想了個近乎完美的解決方案但沒辦法實作吧？比如吃一顆藥丸就能確保 人類有生之年完全不生病之類，最好現在醫學辦得到。

做不出來的產品等於空談，也許等個十年科技更進步，好的創新方案才能被實現。就像鋼鐵人他爸。

存續性

產品有可能成為公司永續商業模式中的一部份。如果要考慮產品有可能成為公司永續商業模式中的一部份，就表示考慮這點的人對於「公司營運」、「商業模式」有所了解。

這是設計師的工作範圍嗎？科科。

（如果你覺得這些干設計師屁事，那絕對不要去看「為真實世界設計」，這本看完會覺得自己大腦根本沒拆封過。）

需求性

對使用者有價值、抓得住消費者的心。如果前期發想、構思、執行這三空間花了足夠多的努力去研究使用者，對於需求性這塊我想問題應該不至於太大。畢竟如果使用者不喜歡，產品根本賣不掉。（除非有外力介入，比如該死的報稅系統。）

專案

把構想從概念落實為產品的載具

專案有起點、中點、結束，有各種限制，我們必須在專案的架構內把設計思考表達出來。所以一開始就要先有清楚的「目標」，就會產生最後期限。

相信事後請求原諒勝於事前取得允許的文化、獎勵成功且容許失敗的文化，已經在無形中移除掉阻擋新構想成形的障礙。

大多數的公司對於創新不過是喊口號，就我所聽說過的，許多創新的想法被打槍的原因往往是「目前市場上沒人這麼做，你怎麼確定這個方案是可行的？」

導致目前普遍採用的方式為：先找出新的技術，再來思考這項技術可以怎麼套入現在的營運裡創造收益。

一個強調開會和查核進度的文化，很難支持創意過程中最重要的考察和互動。

個人廢話

IDEO 是間偉大的設計公司，他們在做的專案往往足以改變世界。這本書在書皮折頁第一句寫著「這不是寫給設計師看的書，是為追求設計思考的創意人和創意領袖打造的藍圖」。

我不知道這句話是出自誰的手中，但「設計思考改變世界」真的不是給設計師看的，且非常懷疑基層設計師看完是否有足夠的經歷和手腕能去實驗書中所提到的各種方式。

光是成功構想的三大準則可行性、存續性、需求性，設計師需要擁有多少知識技藝歷練才能針對這三個方向進行評估與思考？

（我還有很長很長很長的路要走…）

繪製 Mockup 的工具，目前戰最兇的應該就是 PS 和 Sketch 吧，在課堂上有學員問了這個問題。我自己是 Photoshop 派的，會推薦初學者學習的也絕對是 Photoshop。

初學者轉行

初學者？那更要先從 Photoshop 開始。

現在網頁流行首頁放張美美的大圖，圖庫裡的圖不是每張都剛好符合心中想呈現的感覺，直接下載就能直接套用啊，起碼也要套個濾鏡或是調個色。不開 Photoshop 就只能開 Keynote 修圖了（不要笑， Keynote 的去背功能和調色功能很好用）。

在我工作的經歷中，修照片調色調合成是常常在做的事，有的客戶甚至拒絕使用向量圖，要求使用照片，營造貼近人們生活氛圍的質感。

專把 PS 當成影像處理軟體使用，圖片改一改再套回 Sketch 當然也是一種作法。但對初學者而言就是得學習 2 套軟體的操作。

若是平面設計師轉職 UI…目前我還沒遇到完全不會 Photoshop 的平面設計師，跨行學習要花費非常多的時間，比起重新學習一套軟體操作，不如先把 UI/UX 知識補一補，換一種思考方式操作自己原本就熟悉的工具，門檻會稍微低一點。

沒事幹嘛淨身出戶？能延用就延用啊，買新軟體也是成本、花時間重新學習也是成本。

而且不能保證未來不會遇到和 Win 系統一起工作的情況，雖然可以轉檔，但轉檔＝可能會出事。以往轉檔合作經驗不太好，能用原始檔直上最保險。

向量

很多人愛講向量圖放大縮小不失真，說得好像 Photoshop 沒這功能似的。PS 的形狀圖層也是向量圖，畫 Mockup 並不需要太花俏或炫技的軟體操作技術，重點在介面好不好用上。

當然扁平風的 UI 都用向量做。但有時候手癢會想刻個擬物風 icon，我會用形狀圖層畫出物件輪廓、圖層樣式加上基本底色後，開新圖層用筆刷繪製細節。

ANNA SUI wallet

2013 年的舊作品，（嘖、最近都沒在畫這類圖，想掏個新一點的東西出來還找不到）。所有物件都是「向量」，形狀圖層和圖層樣式設好基底後，貼材質，再用筆刷上高光、上陰影，所以許多細節部份是「像素」。

至於向量圖放大縮小失不失真呢…當然沒辦法把一顆 800px 尺寸的 icon 放大到貼捷運整面牆的程度，但放大 5 倍沒有問題。形狀圖層是向量圖，所以不管怎麼放大縮小 icon 輪廓線一定是銳利的，當然放大倍率不能太誇張，不然材質會糊掉。嘛…螢幕上看看而已沒有要印刷，放大 5 倍沒問題，很夠用了。

網路資源

Photoshop 的外掛工具多到眼花撩亂，說網路資源學習管道更是完爆 Sketch。我超愛買的「創意市集」 Creative Market大部份都是 PS 檔。光是每月驚喜大包我就買過很多次，好用省事～

另附上兩間我幾乎每個都買了的外掛商：

Ui Store | Creative assets and tools for designers

喜歡自己畫小 icon 的，JetPack 必買，自動轉向量的描圖完爆 AI 內建功能。

Blocs 2 有許多常見樣板可以不寫一行 Code 做出 RWD 網頁，快速產出 Landingpage 必備。不套程式的話這款我會推工程師用喔！自選樣板、換圖打字就好，整組都設計得美美的了。

Source – We create time-saving tools for designers and developers.

PSD Cleaner特別標這一個外掛，自從收過一次幾百個圖層命名亂七八糟、沒群組沒整理、還留了一堆該刪的圖層不刪的 PSD 檔後，立刻買了這外掛。幫你檢查圖層哪裡忘了整理的好用工具，協作必備！

上手速度

上手快這件事我不確定，畢竟大部份的人都先用熟 Adobe 系列再轉去用 Sketch，學習困難的挫折都算在 Adobe 身上了。想聽聽先學會 Sketch 再回頭學 Photoshop 的人的看法。

我自己用 Sketch 用到是一整個火大，操作習慣問題。在 Photoshop 使用快速鍵，按 1 下「V」是選取工具，按 2 下「V」是選取工具，連續按很多很多下「V」都還是選取工具。

但在 Sketch 裡，同樣的「V」，按第 1 下和按第 2 下，使用者操作的工具不同。之前我就抱怨過這一點了，有讀者說這不是問題，看工具列哪個工具被選中，現在就是在用哪個工具啦～

…那我還要快速鍵幹嘛？用 PS 我可以目光專注在畫稿上，按什麼鍵盤快速鍵就是什麼，不確定有沒有按到還可以多戳幾下沒事。到 Sketch 我還得中斷思考把目光到工具列上瞄一眼現在有沒有選錯？（不要跟我說工具列又沒離畫稿多遠，每次切換工具就中斷一瞬思考試試？）

Sketch 只能用在 Mac、偶爾會有 Bug（可能我比較衰）、偶爾當個機（可能我和它犯沖）之類的狀況就不提了，總之我最在意的功能 Sketch 沒有，倒是 AFFINITY DESIGNER辦到了。要我放下 Photoshop 換一個畫 Mockup 的工具，短期內不可能。

繪圖風格

很多我喜歡的大神作品都沒辦法用向量軟體繪製，這無解，前幾年會搞出上面那顆 icon 也是受了不少 Dribbble 作品的影響。

Mike | Creative Mints

是 Dribbble 上的知名大神，我非常喜歡他的作品，素描水彩手繪底子紮實。最近他的作品用了 ZBrush，害我也默默爬了不少 ZBrush 的教學文，然後發現 ZBrush 真不是給初學者用的。以前在 Win 時代用慣的 3DMAX 沒有 MAC 版；問了台灣經銷商，C4D 貴到爆…更別說 Maya。還是先玩看看不用錢的 Blender，再不然 Photoshop 也有陽春的 3D 功能。

Eddie Lobanovskiy

那顆鬆餅和牛排的 icon 相信看過的人都印象深刻。雖然不知道為什麼要刻一個牛排的 icon，但設計師總是希望自己做出來的東西能越酷炫精緻越好，作品完成後的爽字和成就感很難形容。

總之，雖然現在扁平風當道，就技術上和 UI 工作上我也是都做向量，但絕對不會放棄擬物風的！Photoshop 功能多、肥大是缺點，但換個角度看，要 3D 有陽春 3D、要動畫可以做逐格 GIF、要修照可修照、要畫向量可畫向量，基本我在工作上會用到的功能一款 Photoshop 全包。能一套解決不用開其他軟體切來切去（不用煩惱相容性），很棒啊～

Sketch 是好工具，能快速繪製 Mockup ，但「請配合目的來選擇適合自己的工具」。

雖然我沒有童年可言，但起碼還知道神奇寶貝是什麼，也覺得皮卡丘好可愛。聽說 Pokemon GO 在澳洲 iOS App Store 上架，想起當年為了 Plants vs. Zombies 2 跑去申請澳洲帳號，剛好派上用場。（才不會跟你說我忘記帳號密碼搞了很久。）（圖多慎入）

昨天在被鎖 GPS 前我玩的很爽…也被太陽曬得很慘。下午抓到 26 隻。別指望這篇文會教你怎麼抓神奇寶貝，我從頭到尾都沒在看說明，這篇是炫耀文。

一大早群裡就在討論這遊戲，手頭上有工作沒時間理會，等到有空的時候已經被洗版了。「啊是有多好玩？」抱持著這樣的心情加入對話、下載 App、用 Google 帳號登入，然後就完蛋了。

遊戲一開始會有抓神奇寶貝的教學，因為我認識的神奇寶貝也沒幾隻，在沒瞧見皮卡丘的情況下就小火龍和妙蛙種子比較熟。跟著教學走…

然後就在自家廚房抓到小火龍啦！

因為手邊在忙工作，抓完小火龍就先擺在一旁。App 沒關的情況下，突然手機震動起來…

海星星藏在我的書櫃上！

這叫人怎麼專心工作啊！（翻桌）

只好出門抓神奇寶貝了。

「老公，我出門去抓神奇寶…欸不是，我出門去做防颱準備了。」

地圖上有很多地標可以開，藍色的據點離自己不夠近，雖然可以點擊但無法取得道具。

已得過道具的據點會變成紫色，一段時間後會回復為藍色，才能再次取得道具。

點擊據點後會開啟這個頁面，左右划動中間圓型照片，隨機得到道具。

玩這遊戲真的很危險，邊走邊看手機好容易出意外，比邊走邊打字回訊更容易踩空。

捷運手扶梯上竟然有嘟嘟！

我是先截圖，出捷運站躲到牆邊，才收伏嘟嘟的，人來人往太危險了，大家玩遊戲要注意安全、也不要給別人帶來困擾了啊！

神奇寶貝會隨機出現在地圖上，和據點無關。距離夠近、可以拿道具的據點會變成像是個「@」的標示。

這隻螃蟹我在水溝蓋上找到的…紅綠燈大馬路口很危險，沒截圖。

每收一個據點道具會加一點點 exp，聊勝於無…

板橋大概是嘟嘟的產地，短短幾小時內我收到 6 隻。

颱風前夕外面太陽太大，我逃入板橋車站的地下街。Pokemon GO Server不穩，一直斷斷續續。想說乾脆吃個點心再來繼續好了。

結果在美珍香抓到老鼠…

（小拉達看起來超像囓齒動物，是老鼠我沒理解錯吧？）

遊戲要求 LV5 以上才能進入道場，雖然地圖上那隻伊布好萌好可愛，但等級不夠也沒辦法一探究竟。

右下角小 icon 提示玩家附近有哪些神奇寶貝可抓，但牠躲在哪，不知道，靠多走路碰運氣了。

板橋地下連通道有獨角蟲！

（是說地下道有蟲我一點也不意外。）

無印良品展示架上有小拉達。

（截圖角度要挑過，最好讓神奇寶貝在平台上，截出來的圖會非常像真的在現實生活中補獲一樣。）

轉角遇到愛…ㄟ不是，是烈雀

（尤其是讓神奇寶貝站在地面上再截圖，很萌很可愛～～～）

然後，就沒有然後了。

我玩了 3 小時不到，這段時間老是看到伺服器掛了的訊息。最後就如新聞說的，鎖 GPS 了。

感想

先別提結合 AR 和神奇寶貝補獲，我超佩服開發商敢砸錢把遊戲做出來。這遊戲不知道動用多少工程師…

可惜現在台灣尚未開放，暫時不能玩，非常推薦各位玩看看這款遊戲，足以讓一般非資訊業的人在心中冒出「科技真進步啊」的台詞。

對我來說，最大的收穫應該是想買腳踏車、出門逛街運動了吧。補捉神奇寶貝太有趣了。但是不是要多保一點意外險呢…光是兩隻腳走路邊玩 Pokemon GO 就很容易出意外，我不敢想若是邊騎腳踏車會不會被送進醫院。

…算了等被送進醫院再來煩惱邊騎車邊玩 Pokemon GO 很危險這件事，我現在還比較在意台灣伺服器什麼時候才會開啊！

Art Text 3 剛上 Mac Store 時我就注意到了，首頁 Banner 輪播很醒目。當時就在官網下載免費試用玩了下，覺得超酷炫，但暫時用不太到的樣子沒買。突然半夜朋友傳訊通知「喂、Art Text 3 降價囉！」，然後就手滑了…（遮臉）

原本 49.99 鎂，特價是 29.99 鎂，台幣約 $ 890 元。（不知啥時會調回原價）

官網上的影片一定要看，超神奇，短短幾秒滑鼠隨便點一點就可以做出一堆在 PS 要合成半天的特殊效果文字。還有圖層、型狀功能，能搞出非常多的花樣。

一開啟 Art Text 3 會看到這個畫面。

畫面切成三欄，左欄上方 4 個 icon 分別是文字、圖片、形狀、圖層。中間是畫布。右欄則是物件的詳細數值設定區塊。

相信大家如果看了影片，對這塊乳酪印象一定很深刻。其實呢…也就是

1. 點選畫布中的文字物件。
2. 左方欄點一下那塊乳酪字。

完成！

文字物件中下方有個圓型控件，可以調整文字的角度。

（但我在右方的詳細設定裡找不到角度數值可以在哪輸入，似乎也沒有按住 Shift 固定角度的功能。）

各位在調整角度的時候要稍微控制一下手勁，很容易歪掉。

Art Text 3 沒看到參考線功能，得靠目測對齊，強迫症設計師應該會很不習慣。

影片裡出現的巧克力字也很棒啊～

同樣左邊列表點一下就自動套用。

我弄了個寶石字、在左方欄第 2 個 icon 選擇背景圖片。右方區塊針對背景也提供一拖拉庫的細節設定。

左方欄那 4 顆 icon 下方的下拉選單不要漏看了，有一大堆的分類項目，點開會出現很多內建樣式與圖片可以挑到眼花。

比如我在文字上加了幾個不同的炫光效果。

特別說明一點，語言文字問題，用 Art Text 3 設計中文字一整個醜。中文字型要非常謹慎地挑選，不然會變成高級版的「文字藝術師」。

畫面千萬千萬不能太花俏啊！

順便試了下日文，感覺還行啊…

官網有免費試用版，大家還在觀望的話可以先去下載試玩看看，不過這一次特價應該不會維持太久，要買要快…

官網

http://www.belightsoft.com/art-text/

MAC Store 下載

https://itunes.apple.com/tw/app/art-text-3/id1084658654?l=zh&mt=12

20160714 補充說明：

自定義圖型

使用者可以自行繪製向量圖型再輸入至 Art Text 3 進行編輯。

比如我在 Illustrator 畫了個向量圖，輸出成 .pdf 檔。

然後到 Art Text 3 ，選圖型 > 下拉選單 > 自定義 > pdf 所在的資料夾。

左方列表會出現剛才做的 pdf 檔，點一下，就能套文字特效了。

第三天 UI 入門班課程結束後，有學員留下來問我「設計師的 KPI 怎麼計算」。這是個很有趣的問題，KPI 規則沒定好，只會惡化工作效率和趕跑員工而已。

關鍵績效指標（Key Performance Indicators，KPI），又稱主要績效指標、重要績效指標、績效評核指標等，是指衡量一個管理工作成效最重要的指標，是一項數據化管理的工具，必須是客觀、可衡量的績效指標。

趕跑設計師的 KPI 計算法

如果你在 Google 輸入「設計部 KPI」，會看到這份文件。

出處：http://wenku.baidu.com/view/d334ace0e009581b6bd9eb7b.html

傻傻地直接照這份文件去計算 KPI 的話，包準趕跑一堆設計師。

（以下我轉成 UI 設計用計算方式）

專案設計完成率

圖上寫著「按時設計完成專案數量」…啥？什麼時候有辦法準時完成？有啦，客戶不加功能和再來一杯白開水一樣自然的話，專案有機率按時完工。

這種計算法有個很大的問題：如果計算機 App 算 1 個專案，那麼開發網路商城也算 1 個專案！？

逼得員工都挑簡單的做。大家出來工作主要是混口飯吃，不管專案規模、難易度、業主奧客度做完一個專案都只算 +1 的情況下誰想接手艱難又複雜容易爆炸的工作？

人均原始檔產量

這也是不公平的計算方式，原始檔產出根據專案的不同、難易度差很多，和業主要求的風格也會有關。

比如擬物風和扁平風介面，在刻 PSD 花的時間上絕對不一樣。

所以專門做擬物風的設計師考績算下去根本墊底。只好一頁一個 PSD、無限改稿，各種奇技淫巧鑽漏洞，反正看誰產量大。

（你說 PSD 品質會控管，但上面計算公式沒把品質算進去啊？）

設計方案一次性通過率

屁啦！不管是 Flow Chart 還是 Wireframe 都不敢說一次到位了，設計方案一次通過？作夢比較快。一次過關比發票中 200 元的機率還低。

（題外話：通常一開頭答應的這麼爽快的客戶，往往中途會狂挑錯跳針要多奧客有奧客，且尾款常常收不到。）

設計製作出錯率

再強調一次，計算機 APP 和 網路商城，系統複雜度和功能數完全不能比。越龐大困難的專案越容易出錯，會盡量給資深設計師，簡單專案都給新手，然後資深設計師反而比新手更常出錯。

總是經手吃力不討好的複雜工作、壓力大、容易出錯、考績又輸給新來的。有經驗的 UI 設計師在市場上很缺啊，傻了才陪這種 KPI 制度玩。

逼得員工認為多做多錯，不如不作，有工作來能裝死就裝死吧。

客戶滿意度

「隨機訪問客戶對設計水平的滿意度」，這也很大機率不掌握在設計師手上。如果公司的開發流程導致設計師只能聽從 PM（或主管、老闆） 一個指令一個動作的話，這一項分數高低完全掌握在別人的手上。

只要發號施令的那個人狀況外讓客戶不爽，設計師就會被牽涉到跟著 GG。你拿設計師沒辦法自主的部份來考核設計師？公司不想發獎金給人家對吧。

抱大腿式 KPI 計算法

這些是我聽到會拿來當成 KPI 計算規則之一的方式，基本上和同事關係不好就死定了。當然皇城內的和氣很重要、團隊向心力和合作無間很重要。但這些抽象印象被列入考核要「量化」，如何採用「客觀」的方式評斷？

同事互評

快祈禱同事人都很好，大家都很善良，沒有排擠鬥爭，而且主管不會在考核季說出「我們部門今年只有一個加薪的名額」這種話。

工作態度

如何考核交互設計師和視覺設計師的績效？一文中提到不少「很難客觀評斷」的績效審核方式。

工作態度是一種很主觀且抽象的印象分，尤其是台灣人的企業文化，比起良好積極的態度，學怎麼抱大腿更實際吧。

掐死創意的 KPI 計算法

專案管理

設計師要管自己的工作量、安排工作時程沒錯，但這也算進考績的話，就會以「能在時程內解決優先」來考慮開發，而不是「怎麼做比較適合」當起手式。

「設計師要有創意啊～」這句話聽到爛了，在蘊釀一個好的創意出來前要花多久時間？不知道。

創意能不能實現？不知道。

這段時間怎麼管理？不、不知道…

團隊目標

部門惡鬥的開始，搶資源、搶人，只要團隊裡有個扯後腿的，分數一起陪著難看。為了成績好看，大家都會選簡單好做能應付的那條路，絕不會是新東西玩看看、沒做過試試看，風險太大。

木桶效應：「在一個團隊里，決定這個團隊戰鬥力強弱的不是那個能力最強、表現最好的人，而恰恰是那個能力最弱、表現最差的落後者。」

還想要皇城內的和氣？等著烏煙瘴氣吧。

正向參考

我在群裡聊起「設計師的 KPI」話題，好幾位主管出來哀嚎設計師績效難定。爬了下文真的很難客觀審核。這是篇我覺得能給各位方向的訪談文章：
揭秘：關於設計師的KPI與話語權，這些大佬是這麼看的，截錄其中一小段於此，建議各位去看原文較完整。

我們自己的團隊裡面更強調以 OPI的方式來驅動。最後整年考評的時候分三個維度：

1. 看你對這個產品正向的幫助，比如說哪些方面的增長，其實是可以衡量的。

2. 你和產品團隊合作的過程當中有沒有傳達出一些體驗方面更正向的東西。很多做用戶體驗的同學，當他做到一定時間以後，會掌握很多的調動影響用戶情緒和調動用戶參與感的一些黑科技的。但是這種模型短期內價值，長期的話對公司是有傷害的。所以說需要衡量整個過程當中這個產品是不是在被引導向一個正向的方向，有一些底線是不能碰的。

3. 這個過程當中，每一個設計師的考核其實還是一個專業的設計總監和設計專家來評定的。大家都知道一句話「文無第一，武無第二」，這個設計究竟是好還是不好，是有階段性的。今年可能做的非常棒的設計，讓設計師得到了很好的考評，可能明年整個社會的評價，整個產品趨勢和走向又不一樣了。再用這個辦法評價就不合適了，所以這個動態考評本身的標準也是在變化的，這是我們現在正在做的事情。

文中提到 OPI算法，指的是 Operational Performance Indicator 經營業績指標。資料不太好找，可參考：

プロセスの有効性指標、KPI、OPIの共通性

Differences Among SLA, KPI & OPI

（請不要直接在 Google 搜尋「OPI」，你只會得到一大堆指甲油。）

搞死大家的 KPI 計算法

算時數

幹！這根本在比看誰加班多吧？說會用「某種公式計算工作難度、時數換算成效率」的，把某種公式講清楚啊！

圖層數量

這是我覺得最聰明的計算方式了，和計算工程師的 KPI 看程式碼寫了幾行一樣聰明。借用 我之前是在麥當勞打工的…文體。

我之前是在某公司畫 UI 的，而我產 PSD 檔的原則是「幹你娘塞爆」。

沒錯，就是幹你娘塞爆，老子才不管甚麼接手的人，每次產的 PSD 就是姬芭一大包。100 MB 塞成 500MB，500MB 塞成 1 GB。1G 檔案直接灌成 8G，跟把整個圖庫站的素材全送給你沒兩樣。

我還記得，我那個月上班 25 天，經理跑來跟我說，這個月電腦當機 260 次，你有頭緒嗎？

我他媽的怎麼會知道。

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

備註

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

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

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”

設計 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 研究方法實戰班告一段落了，感謝這班學員的心得回應。我想講的東西太多，時間太少，壓縮到分組討論和實作的部份。這篇文就來講講為什麼我會這樣子規劃課程。

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

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

個人閱讀習慣

我一個月大約會買 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
推薦度 ★★★
難易度 ★★

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

圖解認知心理學

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

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

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

意思是說，我閃到腰了…

這幾天所有活動都停擺，乖乖坐在 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 的時候會很好用吧，現在還在摸索適應中，如果你們有興趣我再來寫文推坑…

「設計思考改變世界」在剛出版的時候就入手，並快速翻閱過。這陣子重看「為真實世界設計」，發現有些觀念自己並沒有好好思考過，兩本書一起比對時有點吃力，只好先暫時放下「為真實世界設計」，回過頭慢慢推敲「設計思考改變世界」書裡的各種概念。

「設計思考改變世界」共有 10 章，如果可以我真希望能把每一章的內容都寫點心得。只希望自己不要又半途而廢了。

第一章：打動人心，或設計不只關乎風格

創新三空間

• 發想 inspiration
  
• 構思 ideation
  
• 執行 implementation
  
  

發想、構思、執行 3 個空間彼此重疊，在創新的過程中，將在這 3 個空間裡不斷來回。

發想

刺激你尋找解決方案的機會與需求。

什麼事物需要解決方案？遇到什麼問題？我們要怎麼確定這是個問題？什麼情況下會出現？誰會遇到？
所以有 Personas、Scenarios、User Journey Maps…各種研究方法幫助我們縮小範圍、確認問題點。

構思

想法的催生、發展、驗證。

「為真實世界設計」書中提到：

為解決問題而存在的設計雖然無法找出唯一的正確解答，卻能找出包含某些「更正確」，以及某些「更錯誤」的答案在內的無數解答。

如何確定在發想過程中找到的「解答」是「更正確」的？使用者測試能不能幫我們驗證？

執行

從研究室通往市場的步驟。

也許在構思和發想階段我們能夠找到許多不錯的「解答」，但概念想法要被實現會面臨非常多的「限制」。這也是我認為設計師一定要跨領域學習的原因。以 UI 設計師來說，不知道平台限制、不知道技術限制、不知道資料來源、也不知道手邊有哪些資源，那設計師如何做到「把概念化為現實」？

「叫工程師做就好了啊～」

成功構想的三大準則

設計過程的第一階段通常就是找出有哪些重要限制，然後建立評估架構。可以利用成功構想的三大準則來找出限制。少了限制就不可能有設計，而最好的設計往往來自於最嚴苛的限制。

• 可行性 feasibility
  
• 存續性 viability
  
• 需求性 desirability
  
  
  

可行性

產品的功能在應用上的可行性。
配合創新三空間的「執行」來看，總不能想了個近乎完美的解決方案但沒辦法實作吧？比如吃一顆藥丸就能確保 人類有生之年完全不生病之類，最好現在醫學辦得到。

做不出來的產品等於空談，也許等個十年科技更進步，好的創新方案才能被實現。就像鋼鐵人他爸。

存續性

產品有可能成為公司永續商業模式中的一部份。
如果要考慮產品有可能成為公司永續商業模式中的一部份，就表示考慮這點的人對於「公司營運」、「商業模式」有所了解。

這是設計師的工作範圍嗎？科科。

（如果你覺得這些干設計師屁事，那絕對不要去看「為真實世界設計」，這本看完會覺得自己大腦根本沒拆封過。）

需求性

對使用者有價值、抓得住消費者的心。
如果前期發想、構思、執行這三空間花了足夠多的努力去研究使用者，對於需求性這塊我想問題應該不至於太大。畢竟如果使用者不喜歡，產品根本賣不掉。（除非有外力介入，比如該死的報稅系統。）

專案

把構想從概念落實為產品的載具

專案有起點、中點、結束，有各種限制，我們必須在專案的架構內把設計思考表達出來。所以一開始就要先有清楚的「目標」，就會產生最後期限。

相信事後請求原諒勝於事前取得允許的文化、獎勵成功且容許失敗的文化，已經在無形中移除掉阻擋新構想成形的障礙。

大多數的公司對於創新不過是喊口號，就我所聽說過的，許多創新的想法被打槍的原因往往是「目前市場上沒人這麼做，你怎麼確定這個方案是可行的？」

導致目前普遍採用的方式為：先找出新的技術，再來思考這項技術可以怎麼套入現在的營運裡創造收益。

一個強調開會和查核進度的文化，很難支持創意過程中最重要的考察和互動。

個人廢話

IDEO 是間偉大的設計公司，他們在做的專案往往足以改變世界。這本書在書皮折頁第一句寫著「這不是寫給設計師看的書，是為追求設計思考的創意人和創意領袖打造的藍圖」。

我不知道這句話是出自誰的手中，但「設計思考改變世界」真的不是給設計師看的，且非常懷疑基層設計師看完是否有足夠的經歷和手腕能去實驗書中所提到的各種方式。

光是成功構想的三大準則可行性、存續性、需求性，設計師需要擁有多少知識技藝歷練才能針對這三個方向進行評估與思考？

（我還有很長很長很長的路要走…）

繪製 Mockup 的工具，目前戰最兇的應該就是 PS 和 Sketch 吧，在課堂上有學員問了這個問題。我自己是 Photoshop 派的，會推薦初學者學習的也絕對是 Photoshop。

初學者轉行

初學者？那更要先從 Photoshop 開始。

現在網頁流行首頁放張美美的大圖，圖庫裡的圖不是每張都剛好符合心中想呈現的感覺，直接下載就能直接套用啊，起碼也要套個濾鏡或是調個色。不開 Photoshop 就只能開 Keynote 修圖了（不要笑， Keynote 的去背功能和調色功能很好用）。

在我工作的經歷中，修照片調色調合成是常常在做的事，有的客戶甚至拒絕使用向量圖，要求使用照片，營造貼近人們生活氛圍的質感。

專把 PS 當成影像處理軟體使用，圖片改一改再套回 Sketch 當然也是一種作法。但對初學者而言就是得學習 2 套軟體的操作。

若是平面設計師轉職 UI…目前我還沒遇到完全不會 Photoshop 的平面設計師，跨行學習要花費非常多的時間，比起重新學習一套軟體操作，不如先把 UI/UX 知識補一補，換一種思考方式操作自己原本就熟悉的工具，門檻會稍微低一點。

沒事幹嘛淨身出戶？能延用就延用啊，買新軟體也是成本、花時間重新學習也是成本。

而且不能保證未來不會遇到和 Win 系統一起工作的情況，雖然可以轉檔，但轉檔＝可能會出事。以往轉檔合作經驗不太好，能用原始檔直上最保險。

向量

很多人愛講向量圖放大縮小不失真，說得好像 Photoshop 沒這功能似的。PS 的形狀圖層也是向量圖，畫 Mockup 並不需要太花俏或炫技的軟體操作技術，重點在介面好不好用上。

當然扁平風的 UI 都用向量做。但有時候手癢會想刻個擬物風 icon，我會用形狀圖層畫出物件輪廓、圖層樣式加上基本底色後，開新圖層用筆刷繪製細節。

ANNA SUI wallet

2013 年的舊作品，（嘖、最近都沒在畫這類圖，想掏個新一點的東西出來還找不到）。所有物件都是「向量」，形狀圖層和圖層樣式設好基底後，貼材質，再用筆刷上高光、上陰影，所以許多細節部份是「像素」。

至於向量圖放大縮小失不失真呢…當然沒辦法把一顆 800px 尺寸的 icon 放大到貼捷運整面牆的程度，但放大 5 倍沒有問題。形狀圖層是向量圖，所以不管怎麼放大縮小 icon 輪廓線一定是銳利的，當然放大倍率不能太誇張，不然材質會糊掉。嘛…螢幕上看看而已沒有要印刷，放大 5 倍沒問題，很夠用了。

網路資源

Photoshop 的外掛工具多到眼花撩亂，說網路資源學習管道更是完爆 Sketch。我超愛買的「創意市集」 Creative Market大部份都是 PS 檔。光是每月驚喜大包我就買過很多次，好用省事～

另附上兩間我幾乎每個都買了的外掛商：

Ui Store | Creative assets and tools for designers

喜歡自己畫小 icon 的，JetPack 必買，自動轉向量的描圖完爆 AI 內建功能。

Blocs 2 有許多常見樣板可以不寫一行 Code 做出 RWD 網頁，快速產出 Landingpage 必備。不套程式的話這款我會推工程師用喔！自選樣板、換圖打字就好，整組都設計得美美的了。

Source – We create time-saving tools for designers and developers.

PSD Cleaner特別標這一個外掛，自從收過一次幾百個圖層命名亂七八糟、沒群組沒整理、還留了一堆該刪的圖層不刪的 PSD 檔後，立刻買了這外掛。幫你檢查圖層哪裡忘了整理的好用工具，協作必備！

上手速度

上手快這件事我不確定，畢竟大部份的人都先用熟 Adobe 系列再轉去用 Sketch，學習困難的挫折都算在 Adobe 身上了。想聽聽先學會 Sketch 再回頭學 Photoshop 的人的看法。

我自己用 Sketch 用到是一整個火大，操作習慣問題。在 Photoshop 使用快速鍵，按 1 下「V」是選取工具，按 2 下「V」是選取工具，連續按很多很多下「V」都還是選取工具。

但在 Sketch 裡，同樣的「V」，按第 1 下和按第 2 下，使用者操作的工具不同。之前我就抱怨過這一點了，有讀者說這不是問題，看工具列哪個工具被選中，現在就是在用哪個工具啦～

…那我還要快速鍵幹嘛？用 PS 我可以目光專注在畫稿上，按什麼鍵盤快速鍵就是什麼，不確定有沒有按到還可以多戳幾下沒事。到 Sketch 我還得中斷思考把目光到工具列上瞄一眼現在有沒有選錯？（不要跟我說工具列又沒離畫稿多遠，每次切換工具就中斷一瞬思考試試？）

Sketch 只能用在 Mac、偶爾會有 Bug（可能我比較衰）、偶爾當個機（可能我和它犯沖）之類的狀況就不提了，總之我最在意的功能 Sketch 沒有，倒是 AFFINITY DESIGNER辦到了。要我放下 Photoshop 換一個畫 Mockup 的工具，短期內不可能。

繪圖風格

很多我喜歡的大神作品都沒辦法用向量軟體繪製，這無解，前幾年會搞出上面那顆 icon 也是受了不少 Dribbble 作品的影響。

Mike | Creative Mints

是 Dribbble 上的知名大神，我非常喜歡他的作品，素描水彩手繪底子紮實。最近他的作品用了 ZBrush，害我也默默爬了不少 ZBrush 的教學文，然後發現 ZBrush 真不是給初學者用的。以前在 Win 時代用慣的 3DMAX 沒有 MAC 版；問了台灣經銷商，C4D 貴到爆…更別說 Maya。還是先玩看看不用錢的 Blender，再不然 Photoshop 也有陽春的 3D 功能。

Eddie Lobanovskiy

那顆鬆餅和牛排的 icon 相信看過的人都印象深刻。雖然不知道為什麼要刻一個牛排的 icon，但設計師總是希望自己做出來的東西能越酷炫精緻越好，作品完成後的爽字和成就感很難形容。

總之，雖然現在扁平風當道，就技術上和 UI 工作上我也是都做向量，但絕對不會放棄擬物風的！Photoshop 功能多、肥大是缺點，但換個角度看，要 3D 有陽春 3D、要動畫可以做逐格 GIF、要修照可修照、要畫向量可畫向量，基本我在工作上會用到的功能一款 Photoshop 全包。能一套解決不用開其他軟體切來切去（不用煩惱相容性），很棒啊～

Sketch 是好工具，能快速繪製 Mockup ，但「請配合目的來選擇適合自己的工具」。

雖然我沒有童年可言，但起碼還知道神奇寶貝是什麼，也覺得皮卡丘好可愛。聽說 Pokemon GO 在澳洲 iOS App Store 上架，想起當年為了 Plants vs. Zombies 2 跑去申請澳洲帳號，剛好派上用場。（才不會跟你說我忘記帳號密碼搞了很久。）（圖多慎入）

昨天在被鎖 GPS 前我玩的很爽…也被太陽曬得很慘。下午抓到 26 隻。別指望這篇文會教你怎麼抓神奇寶貝，我從頭到尾都沒在看說明，這篇是炫耀文。

一大早群裡就在討論這遊戲，手頭上有工作沒時間理會，等到有空的時候已經被洗版了。「啊是有多好玩？」抱持著這樣的心情加入對話、下載 App、用 Google 帳號登入，然後就完蛋了。

遊戲一開始會有抓神奇寶貝的教學，因為我認識的神奇寶貝也沒幾隻，在沒瞧見皮卡丘的情況下就小火龍和妙蛙種子比較熟。跟著教學走…

然後就在自家廚房抓到小火龍啦！

因為手邊在忙工作，抓完小火龍就先擺在一旁。App 沒關的情況下，突然手機震動起來…

海星星藏在我的書櫃上！

這叫人怎麼專心工作啊！（翻桌）

只好出門抓神奇寶貝了。

「老公，我出門去抓神奇寶…欸不是，我出門去做防颱準備了。」

地圖上有很多地標可以開，藍色的據點離自己不夠近，雖然可以點擊但無法取得道具。

已得過道具的據點會變成紫色，一段時間後會回復為藍色，才能再次取得道具。

點擊據點後會開啟這個頁面，左右划動中間圓型照片，隨機得到道具。

玩這遊戲真的很危險，邊走邊看手機好容易出意外，比邊走邊打字回訊更容易踩空。

捷運手扶梯上竟然有嘟嘟！

我是先截圖，出捷運站躲到牆邊，才收伏嘟嘟的，人來人往太危險了，大家玩遊戲要注意安全、也不要給別人帶來困擾了啊！

神奇寶貝會隨機出現在地圖上，和據點無關。距離夠近、可以拿道具的據點會變成像是個「@」的標示。

這隻螃蟹我在水溝蓋上找到的…紅綠燈大馬路口很危險，沒截圖。

每收一個據點道具會加一點點 exp，聊勝於無…

板橋大概是嘟嘟的產地，短短幾小時內我收到 6 隻。

颱風前夕外面太陽太大，我逃入板橋車站的地下街。Pokemon GO Server不穩，一直斷斷續續。想說乾脆吃個點心再來繼續好了。

結果在美珍香抓到老鼠…

（小拉達看起來超像囓齒動物，是老鼠我沒理解錯吧？）

遊戲要求 LV5 以上才能進入道場，雖然地圖上那隻伊布好萌好可愛，但等級不夠也沒辦法一探究竟。

右下角小 icon 提示玩家附近有哪些神奇寶貝可抓，但牠躲在哪，不知道，靠多走路碰運氣了。

板橋地下連通道有獨角蟲！

（是說地下道有蟲我一點也不意外。）

無印良品展示架上有小拉達。

（截圖角度要挑過，最好讓神奇寶貝在平台上，截出來的圖會非常像真的在現實生活中補獲一樣。）

轉角遇到愛…ㄟ不是，是烈雀

（尤其是讓神奇寶貝站在地面上再截圖，很萌很可愛～～～）

然後，就沒有然後了。

我玩了 3 小時不到，這段時間老是看到伺服器掛了的訊息。最後就如新聞說的，鎖 GPS 了。

感想

先別提結合 AR 和神奇寶貝補獲，我超佩服開發商敢砸錢把遊戲做出來。這遊戲不知道動用多少工程師…

可惜現在台灣尚未開放，暫時不能玩，非常推薦各位玩看看這款遊戲，足以讓一般非資訊業的人在心中冒出「科技真進步啊」的台詞。

對我來說，最大的收穫應該是想買腳踏車、出門逛街運動了吧。補捉神奇寶貝太有趣了。但是不是要多保一點意外險呢…光是兩隻腳走路邊玩 Pokemon GO 就很容易出意外，我不敢想若是邊騎腳踏車會不會被送進醫院。

…算了等被送進醫院再來煩惱邊騎車邊玩 Pokemon GO 很危險這件事，我現在還比較在意台灣伺服器什麼時候才會開啊！

Art Text 3 剛上 Mac Store 時我就注意到了，首頁 Banner 輪播很醒目。當時就在官網下載免費試用玩了下，覺得超酷炫，但暫時用不太到的樣子沒買。突然半夜朋友傳訊通知「喂、Art Text 3 降價囉！」，然後就手滑了…（遮臉）

原本 49.99 鎂，特價是 29.99 鎂，台幣約 $ 890 元。（不知啥時會調回原價）

官網上的影片一定要看，超神奇，短短幾秒滑鼠隨便點一點就可以做出一堆在 PS 要合成半天的特殊效果文字。還有圖層、型狀功能，能搞出非常多的花樣。

一開啟 Art Text 3 會看到這個畫面。

畫面切成三欄，左欄上方 4 個 icon 分別是文字、圖片、形狀、圖層。中間是畫布。右欄則是物件的詳細數值設定區塊。

相信大家如果看了影片，對這塊乳酪印象一定很深刻。其實呢…也就是

1. 點選畫布中的文字物件。
   
2. 左方欄點一下那塊乳酪字。
   
   

完成！

文字物件中下方有個圓型控件，可以調整文字的角度。

（但我在右方的詳細設定裡找不到角度數值可以在哪輸入，似乎也沒有按住 Shift 固定角度的功能。）

各位在調整角度的時候要稍微控制一下手勁，很容易歪掉。

Art Text 3 沒看到參考線功能，得靠目測對齊，強迫症設計師應該會很不習慣。

影片裡出現的巧克力字也很棒啊～

同樣左邊列表點一下就自動套用。

我弄了個寶石字、在左方欄第 2 個 icon 選擇背景圖片。右方區塊針對背景也提供一拖拉庫的細節設定。

左方欄那 4 顆 icon 下方的下拉選單不要漏看了，有一大堆的分類項目，點開會出現很多內建樣式與圖片可以挑到眼花。

比如我在文字上加了幾個不同的炫光效果。

特別說明一點，語言文字問題，用 Art Text 3 設計中文字一整個醜。中文字型要非常謹慎地挑選，不然會變成高級版的「文字藝術師」。

畫面千萬千萬不能太花俏啊！

順便試了下日文，感覺還行啊…

官網有免費試用版，大家還在觀望的話可以先去下載試玩看看，不過這一次特價應該不會維持太久，要買要快…

官網

http://www.belightsoft.com/art-text/

MAC Store 下載

https://itunes.apple.com/tw/app/art-text-3/id1084658654?l=zh&mt=12

20160714 補充說明：

自定義圖型

使用者可以自行繪製向量圖型再輸入至 Art Text 3 進行編輯。

比如我在 Illustrator 畫了個向量圖，輸出成 .pdf 檔。

然後到 Art Text 3 ，選圖型 > 下拉選單 > 自定義 > pdf 所在的資料夾。

左方列表會出現剛才做的 pdf 檔，點一下，就能套文字特效了。

第三天 UI 入門班課程結束後，有學員留下來問我「設計師的 KPI 怎麼計算」。這是個很有趣的問題，KPI 規則沒定好，只會惡化工作效率和趕跑員工而已。

關鍵績效指標（Key Performance Indicators，KPI），又稱主要績效指標、重要績效指標、績效評核指標等，是指衡量一個管理工作成效最重要的指標，是一項數據化管理的工具，必須是客觀、可衡量的績效指標。

趕跑設計師的 KPI 計算法

如果你在 Google 輸入「設計部 KPI」，會看到這份文件。

出處：http://wenku.baidu.com/view/d334ace0e009581b6bd9eb7b.html

傻傻地直接照這份文件去計算 KPI 的話，包準趕跑一堆設計師。

（以下我轉成 UI 設計用計算方式）

專案設計完成率

圖上寫著「按時設計完成專案數量」…啥？什麼時候有辦法準時完成？有啦，客戶不加功能和再來一杯白開水一樣自然的話，專案有機率按時完工。

這種計算法有個很大的問題：如果計算機 App 算 1 個專案，那麼開發網路商城也算 1 個專案！？

逼得員工都挑簡單的做。大家出來工作主要是混口飯吃，不管專案規模、難易度、業主奧客度做完一個專案都只算 +1 的情況下誰想接手艱難又複雜容易爆炸的工作？

人均原始檔產量

這也是不公平的計算方式，原始檔產出根據專案的不同、難易度差很多，和業主要求的風格也會有關。

比如擬物風和扁平風介面，在刻 PSD 花的時間上絕對不一樣。

所以專門做擬物風的設計師考績算下去根本墊底。只好一頁一個 PSD、無限改稿，各種奇技淫巧鑽漏洞，反正看誰產量大。

（你說 PSD 品質會控管，但上面計算公式沒把品質算進去啊？）

設計方案一次性通過率

屁啦！不管是 Flow Chart 還是 Wireframe 都不敢說一次到位了，設計方案一次通過？作夢比較快。一次過關比發票中 200 元的機率還低。

（題外話：通常一開頭答應的這麼爽快的客戶，往往中途會狂挑錯跳針要多奧客有奧客，且尾款常常收不到。）

設計製作出錯率

再強調一次，計算機 APP 和 網路商城，系統複雜度和功能數完全不能比。越龐大困難的專案越容易出錯，會盡量給資深設計師，簡單專案都給新手，然後資深設計師反而比新手更常出錯。

總是經手吃力不討好的複雜工作、壓力大、容易出錯、考績又輸給新來的。有經驗的 UI 設計師在市場上很缺啊，傻了才陪這種 KPI 制度玩。

逼得員工認為多做多錯，不如不作，有工作來能裝死就裝死吧。

客戶滿意度

「隨機訪問客戶對設計水平的滿意度」，這也很大機率不掌握在設計師手上。如果公司的開發流程導致設計師只能聽從 PM（或主管、老闆） 一個指令一個動作的話，這一項分數高低完全掌握在別人的手上。

只要發號施令的那個人狀況外讓客戶不爽，設計師就會被牽涉到跟著 GG。你拿設計師沒辦法自主的部份來考核設計師？公司不想發獎金給人家對吧。

抱大腿式 KPI 計算法

這些是我聽到會拿來當成 KPI 計算規則之一的方式，基本上和同事關係不好就死定了。當然皇城內的和氣很重要、團隊向心力和合作無間很重要。但這些抽象印象被列入考核要「量化」，如何採用「客觀」的方式評斷？

同事互評

快祈禱同事人都很好，大家都很善良，沒有排擠鬥爭，而且主管不會在考核季說出「我們部門今年只有一個加薪的名額」這種話。

工作態度

如何考核交互設計師和視覺設計師的績效？一文中提到不少「很難客觀評斷」的績效審核方式。

工作態度是一種很主觀且抽象的印象分，尤其是台灣人的企業文化，比起良好積極的態度，學怎麼抱大腿更實際吧。

掐死創意的 KPI 計算法

專案管理

設計師要管自己的工作量、安排工作時程沒錯，但這也算進考績的話，就會以「能在時程內解決優先」來考慮開發，而不是「怎麼做比較適合」當起手式。

「設計師要有創意啊～」這句話聽到爛了，在蘊釀一個好的創意出來前要花多久時間？不知道。

創意能不能實現？不知道。

這段時間怎麼管理？不、不知道…

團隊目標

部門惡鬥的開始，搶資源、搶人，只要團隊裡有個扯後腿的，分數一起陪著難看。為了成績好看，大家都會選簡單好做能應付的那條路，絕不會是新東西玩看看、沒做過試試看，風險太大。

木桶效應：「在一個團隊里，決定這個團隊戰鬥力強弱的不是那個能力最強、表現最好的人，而恰恰是那個能力最弱、表現最差的落後者。」

還想要皇城內的和氣？等著烏煙瘴氣吧。

正向參考

我在群裡聊起「設計師的 KPI」話題，好幾位主管出來哀嚎設計師績效難定。爬了下文真的很難客觀審核。這是篇我覺得能給各位方向的訪談文章：
揭秘：關於設計師的KPI與話語權，這些大佬是這麼看的，截錄其中一小段於此，建議各位去看原文較完整。

我們自己的團隊裡面更強調以 OPI的方式來驅動。最後整年考評的時候分三個維度：

1. 看你對這個產品正向的幫助，比如說哪些方面的增長，其實是可以衡量的。

2. 你和產品團隊合作的過程當中有沒有傳達出一些體驗方面更正向的東西。很多做用戶體驗的同學，當他做到一定時間以後，會掌握很多的調動影響用戶情緒和調動用戶參與感的一些黑科技的。但是這種模型短期內價值，長期的話對公司是有傷害的。所以說需要衡量整個過程當中這個產品是不是在被引導向一個正向的方向，有一些底線是不能碰的。

3. 這個過程當中，每一個設計師的考核其實還是一個專業的設計總監和設計專家來評定的。大家都知道一句話「文無第一，武無第二」，這個設計究竟是好還是不好，是有階段性的。今年可能做的非常棒的設計，讓設計師得到了很好的考評，可能明年整個社會的評價，整個產品趨勢和走向又不一樣了。再用這個辦法評價就不合適了，所以這個動態考評本身的標準也是在變化的，這是我們現在正在做的事情。

文中提到 OPI算法，指的是 Operational Performance Indicator 經營業績指標。資料不太好找，可參考：

プロセスの有効性指標、KPI、OPIの共通性

Differences Among SLA, KPI & OPI

（請不要直接在 Google 搜尋「OPI」，你只會得到一大堆指甲油。）

搞死大家的 KPI 計算法

算時數

幹！這根本在比看誰加班多吧？說會用「某種公式計算工作難度、時數換算成效率」的，把某種公式講清楚啊！

圖層數量

這是我覺得最聰明的計算方式了，和計算工程師的 KPI 看程式碼寫了幾行一樣聰明。借用 我之前是在麥當勞打工的…文體。

我之前是在某公司畫 UI 的，而我產 PSD 檔的原則是「幹你娘塞爆」。

沒錯，就是幹你娘塞爆，老子才不管甚麼接手的人，每次產的 PSD 就是姬芭一大包。100 MB 塞成 500MB，500MB 塞成 1 GB。1G 檔案直接灌成 8G，跟把整個圖庫站的素材全送給你沒兩樣。

我還記得，我那個月上班 25 天，經理跑來跟我說，這個月電腦當機 260 次，你有頭緒嗎？

我他媽的怎麼會知道。