轉職成UI設計師囉!

Shan Yu
9 min readJan 10, 2022

--

海洋生物碩士到插畫碩士,再到UI/UX設計師。

最近在幫客戶進行初期不同顏色組合的UI提案

前陣子收到一位朋友的訊息,說自己想從室內設計師轉職成UI設計師,問我有沒有推薦的線上課程。這讓我認真地回憶了一下一年多前自己是怎麼開始準備轉職,並在英國找到工作的。於是就決定來寫一篇關於自己轉職為UI設計師的文章。

在台灣時,我是念科學相關科系(地球科學系、海洋生物所),畢業後在科學人雜誌擔任數位內容編輯一職,工作了一陣子。這段時間裡,發現自己很喜歡雜誌內,用有趣插畫傳達科學知識的方式,所以就決定離職到英國學習插畫。而在畢業之際,因為希望留給自己更多自由創作空間,所以決定找一個跟視覺相關,並且適合自己的正職工作,然後以接案的方式繼續進行插畫創作。

做了一些研究後,發現使用者介面(User Interface)設計不僅可以把畫面做得美美的,還可以跟生活做結合(因為App是設計給每一個人使用,所以會花很多時間思考視覺文化,和之間的關係)。最後,我覺得最讚的地方就是,因為UI設計需要符合人們的使用習慣及適合開發,所以有很多設計規範需要遵守,且須符合系統性地邏輯思考;這個特性跟我在台灣時,一直以來的因著科學求學背景所累積的科學腦思考模式很契合。

其實UI設計對我來說,就是能夠把漂亮的畫面理性的思考,及我的生活,三者不斷排列組合後,找出視覺最佳解的工作;而這樣的工作對我而言,實在是太完美了。所以思考了一陣子之後,在我還在念插畫碩士時,就開始學習跟UI設計相關的知識、開始嘗試製作自己的作品集,並於快畢業之際開始投履歷,尋找在英國擔任全職UI設計師的工作機會。

我的準備方式大綱
我覺得準備方式會因人而異,然後根據自己的弱項和強項做出調整。像我覺得自己學習上的弱項是沒辦法好好上完一份完整的課程(可能開頭覺得太簡單很想跳過;後面又覺得太難聽著恍神,導致跟不上哈哈。總之我覺得自己不太適合按部就班的學習方法),但我的強項是很喜歡從實作中學習;自己開始動手實作會讓大腦轉得很快、更容易活用理論,並能思考更多細節。

基於自己的個性,當那位朋友問到我有沒有推薦初學者的課程時,我真的一個都說不出來,因為我真的沒有完整上完什麼課程;但我倒是透過閱讀大家的經驗分享,先從中列出大致需要學習要項(主架構),再透過搜尋要項內的關鍵字(延伸分支架構),去看更多不同的說法與教學,進而累積自己對UI設計的知識與感受。

我的準備大概分為三個主要部分:
1 . CV
2 . 作品集(內含3件作品)
3 . 一份完整的UI/UX process文章

1. CV的準備

讓自己對於UI設計師這個職位的工作內容以及所需具備的條件更了解。

根據閱讀各個公司所開出UI設計師的職缺描述(Job Description),我會抓出其中我認為身為UI設計師需要具備的能力,然後根據過往工作經驗挑選可以符合的項目撰寫入我的CV;接著再從缺少部分下手,並透過第2點準備作品集的過程中加強。

我認為身為UI設計師需要具備的能力:
(1) 能夠製作Wireframe、UI Mockup、Interactive Prototype
(2) 了解介面設計規範(iOS Human Interface GuidelineMaterial Design
(3) 和客戶的溝通能力(能把客戶的需求轉變成設計)
(4) 和工程師的溝通能力(懂得如何製作Style Specifications,並製作出符合開發成本效益的設計)
(5) Good to have: 懂得使用Design Library (可以加速開發過程)

-

使用工具:
Figma、Sketch、Adobe XD (是軟體名稱,不是在笑)
以上軟體可以擇一熟悉即可,雖然它們各自有比較好用的特點,但任何一個都有完整的功能製作出UI Mockup及Style Specifications。

當然我也有聽過設計師是使用Adobe Illustrator及Photoshop製作UI Mockup,再用PowerPoint/Keynote製作Style Specifications和呈現設計。

自己的想法是前三者比較方便好用,但只要是自己上手的,方便溝通的,工具無論使用哪種都沒問題噢。

-

在撰寫CV時,主要是去思考自己過去的工作經驗可以怎麼和上述的5點連上關係,這樣即使過往並不是從事完全相關的工作,也可以讓看履歷的人知道你有什麼經驗是能對這個職位加分的。以下簡單舉一個小例子。

上面有提到我在台灣是於科學人雜誌擔任數位內容編輯一職,我的工作一部分會接觸到雜誌內容製作,一部分會接觸到行銷。這個職位雖然看似跟UI設計搭不太上關係,但還是有接觸到滿多使用者的回饋,並轉成對產品有益的具體改善。所以在我的CV內,有一段描述是這麼寫的:

“Analysed user behavioural feedback to support daily tasks and increase market awareness of the brand.”

而在這個過程中我有跟到科學人網站改版時期。我們有自己公司內部的後端工程師,並聘請一位外包的UI設計師兼前端工程師,幫我們進行網站的改版;而我的角色就是中間負責溝通的工作。所以在我的CV內,有另一段描述是這麼寫的:

“Worked closely with product manager and software developers to define and produce innovative solution to customer problems.”

如果自己過去真的沒有任何工作經驗,也可以考慮以Project-based的方式呈現;即使沒有替其他的客戶工作過,但自己若有做Side project,甚至是和別人組成團隊一起合作,而過程有的實戰及溝通經驗,也會讓審閱CV的人覺得你是個self-motivated的人,這點對求職很有幫助。

如果想要看我的CV範本,也可以參考我之前撰寫的文章:英國求職CV template分享,裡面有提到幾點我覺得撰寫CV的小細節,還提供CV Template(當然附上的CV內容就是我真實的裸體呈現哈哈哈),有需要的話歡迎使用噢。

2. 作品集的準備

透過實作,將第1點準備CV過程中學習到的名詞及技能加以練習及活用;我自己的作品集是抓3份作品。

每件作品包含:
(1) 製作至少一張產品的UI Mockup
(2) 撰述3–5項對這項作品的工作貢獻
(當然是環環相扣上面提到的UI設計師所需具備的能力要點)
(3) 附上產品上線的連結
(此點為optional,沒有也沒關係,但如果產品有實際上線當然更加分)

-

至於要如何選擇適合放在作品集的專案,可以試試看從以下三個方向著手。

(1) 選擇自己覺得有趣的專案
我因爲很喜歡喝咖啡,又剛好聽到朋友的朋友有自己烘豆子販售;但因為使用像是PChome/蝦皮的購物平台都會被抽成,且維繫客戶需要使用不同的媒介,所以一直希望能嘗試不同的方式成立自己的產品販售點。我當時就著手設計了一個有購物車功能、傳訊息功能,及介紹不同咖啡豆風味頁面的App,並將UI mockups及我和對方溝通找出pain point等等的工作細節加以描述,放在我的作品集中。

Tip: 搜尋 UI/UX case study 就可以找到更多設計師針對不同產品設計所撰寫的相關文章噢。

(2) 重新設計現有的App
找一個現有的App進行重新設計,改善流程體驗;也可以找一個雖然已經滿有名,但單一功能可以加強的App進行改善,另如這篇Redesign Medium’s editing experience就是針對Medium的編輯功能進行研究及提出自己認為可以改善的要點。

Tip: 搜尋 App Redesign 就可以找到更多不同產品的相關文章噢。

(3) 未來想求職方向的相關產品
也可以從自己未來想要找公司的類似產品下手,這樣可以更針對性地設計他們需要的feature。例如想要往FinTech發展的話,就可以嘗試設計類似網路銀行(例Revolut)相關的產品。

3. 一份完整UI/UX process文章的準備

從第2點的作品集內挑一個自己最完整/最有感受的專案,撰寫完整的UI/UX process。透過書寫輸出,將上述兩點所學習及吸收的知識,內化成自己的思考邏輯,並用自己的方式表達出來。

這份文章的準備不僅可以讓雇主更了解你的工作過程,也對於初次踏到這個領域的設計師走過整個設計的思考過程很有幫助。順著這個流程寫下來,一邊可以提醒自己需要做什麼,也一邊把做過的努力有系統地列下來。

UI/UX process文章內大致架構可分為:
(1) Overview (How this project started)
(2) My role in this team/project
(3) Background Research、Competitor Analysis
(4) User interview、Persona
(5) User flow
(6) Wireframe、Low-fidelity Prototype
(7) UI Mockup、High-fidelity Prototype
(8) User feedback
(9) What I have learnt from this project
(10) Conclusion

剛開始不懂時,我就是把這些項目都列下來,挑了一個專案後,就依照這個順序一步一步實作,並將過程撰寫下來,如果卡關就用這個項目當作關鍵字,進一步去查更多不同設計師是怎麼執行這個過程的(當然裡面的項目並不是一定每項都要做過,只要挑選自己認為適合需要的即可)。

想要了解更詳細的話,可以參考以這篇為開頭的系列文章:UX流程簡介(上):UX Research to User Journey,讀完會對UI/UX的工作內容更有感受噢!

以上,是很快速簡短地以大架構的方式地介紹轉職UI的準備方式及內容,每一段其實都還可以花完整的一篇,甚至好幾篇去細講更具體的例子。

當然這也只是我個人習慣的模式,希望對正在閱讀的你有一點點小幫助,也希望你找到自己喜歡的模式噢!如果對哪個部分特別有興趣或困惑的朋友也歡迎聯絡我(我的帳號內有Instagram和email),我可以再思考一下要怎麼說明更清楚 :)

--

--

Shan Yu

Taiwanese Product Designer and Illustrator, based in the UK. Instagram | @sunshanillustration