一開始的念頭
在以前當 UI/UX 設計師的五年間,每當看到別人能夠獨立接案,
都會覺得又佩服又嚮往,對我來說,覺得那不只是能力上的肯定,
同時也代表著,那是一種達到「夠格」的標準。
所以我一直很希望能夠獨立去接看看案子,
也把「嘗試接案」列進了我的人生 To-Do List,
但在那之前,內心那個「不夠好」的聲音會一直跑出來提醒我:
Hey, you are not good enough.
也因此,我總是把想法收回,
告訴自己「再等等吧,等我準備好了再說」,
但想當然的,我也就真的繼續放著了
機會來了
直到今年,大學的朋友突然找上我,想一起合作一個 UI/UX 的 App 案子,
收到訊息時的那一刻,我真是又驚又喜。
雖說那時我已經轉職成為前端工程師,但心中對 UI/UX 的熱愛始終還在,
而且機會就擺在眼前,這次若不抓住,之後也不知道還會不會有。
所以我沒有再想太多,直接把那個「不夠好」的聲音拋在腦後,
大致了解一下需求後,我簡單的回了:
好啊,我接!
也就有此次接案經歷,更讓我開心的是,
竟然因此完成了人生 To-Do List 上的一項願望
我們怎麼分工
這個接案是我和設計夥伴是一起分工合作完成的,
接下來,就簡單分享一下整個 UI/UX 接案的過程,以及我們是怎麼合作的。
UX / 架構規劃
- 需求分析與流程設計
- 資訊架構規劃
- 互動草稿製作
UI / 視覺設計
- 品牌風格設定
- 介面設計與排版
- 視覺與互動細節優化
● 這邊的 UX 是偏架構面,包含需求與功能邏輯的整理、頁面流程與資訊結構的規劃,未涉及使用者研究,著重在將業主需求轉化為可實作、可理解的產品架構
我主要負責 UX 架構規劃,把業主想要的功能和需求整理出整體邏輯,
規劃出頁面流程和互動草稿,讓整個產品的結構清楚、好理解。
設計夥伴則負責 UI 視覺設計,從 Logo、配色到整體風格都由他主導,
再根據我的草稿去繪製畫面,調整排版和細節,讓整個設計有完整和一致的視覺感。
從 0 到 1 的過程
上面的描述或許還是不夠明瞭,所以下面就整理出之前完成這個產品的整個過程 ↓
(已徵求業主可分享部分畫面,並模糊化處理)
快速尋找
Step 1 | 理解需求:從「想做 App」開始
業主先提供相關資料,我和設計夥伴研讀資料後,一起與業主開會,理解業主整體的方向和理念,例如:
為什麼要做這個 APP?
這個 APP 想改善使用者什麼問題?
做這個功能想達成什麼目的?
這個 APP 有想帶給使用者什麼感覺?
目標使用者客群是哪些人…等
Step 2 | 整理功能:把想法攤開來看
理解業主需求後,我開始在 FigJam 攤出所有功能,依重要性和類型進行分類,整理出產品的主要結構。

Step 3 | 構思流程:讓功能變成實際操作
各功能確認後,就能構想需要哪些介面與流程來完成單一功能,有些人會再繪製 User Flow(使用者流程)去順流程,但這塊我就略過,直接把流程和草稿結合在一起。

Step 4 | 草稿階段:最喜歡的黑白世界
我最容易進入心流的部分!
把所有功能與流程轉化為草稿,因為都是「黑白色」,所以可以讓我專注的在資訊擺放與操作邏輯,分出層級,並以簡單圖形化方式呈現。

Step 5 | 品牌定調:風格的誕生
接下來就是換成設計夥伴的部分了
在與業主定期的需求確認會議中,設計夥伴逐漸理解業主理念,然後依此發想品牌風格與 Logo 設計。
Step 6 | 介面設計:讓草稿變成畫面
在品牌方向確立後,設計夥伴就開始進行整體介面的視覺設計,這階段主要是把我前面規劃好的頁面草稿與流程,轉化成實際畫面。

Step 7 | 最後階段:確認互動的完整性
終於到最後一步了!
在介面視覺確定之後,會再把整體流程和互動邏輯重新檢查一遍,確認每個按鈕、切換或提示的行為都合理、連貫。同時也會整理出一些互動設計指引,方便後續工程師開發。

呼~~
以上,就是整個接案的過程。
現在回頭看,真是一大工程,真的很感謝我的設計夥伴和我一起合作完成,
不然只有我自己一個人做真的是會累死。
緣分也是很奇妙,因為這次合作,與許久不見朋友又重新產生連結,
也因為朋友接觸到業主,彼此培養出一些合作默契出來。
然後也有跟設計夥伴討論明年要來一起報名 Google UX 證照,
如果真的有取得,到時再來 blog 分享心得吧!
