翻玩再設計！Unblock都在用的5步驟，高效提升你的UI/UX實戰力
資深設計團隊Unblock網站實例，5大步驟、手把手帶你高效完成再設計！
「再設計 Redesign」一直是公司產品專案或菜鳥設計師製作作品集時的熱門選題，不過，再設計該怎麼開始？應該先釐清哪些策略邏輯？資深設計團隊 Unblock 將透過製作《百萬設計職涯》的幕後設計流程，手把手教你搞懂再設計！
背景介紹：
《百萬設計職涯》是前 Google、Amazon 設計師喬治先森專為設計師量身打造的職涯解析課程，不只提供製作作品集與面試的秘笈，更分享了市場上少見的職涯規劃策略。
為了整合課程的新內容，課程上線至今，Unblock決定好好做一次網站翻新。透過「再設計」策略，希望在已有的基礎上，呈現更完整的資訊、打造高度符合使用者與市場需求的產品。
想了解專業設計團隊 Unblock 怎麼拆解再設計？想深入探索《百萬設計職涯》課程網頁的製作秘辛？以下將分享 Unblock 團隊如何透過 5 大步驟實現再設計，教你在有限時間下，快速完成再設計專案！
如何開始再設計？5 步驟拆解策略，提升你的 UX/UI 設計力
步驟零：計畫
比起步驟一，我們團隊更喜歡將「計畫」這個步驟定為步驟零。
在啟動專案前，我們會為每個新設計賦予目標，並設定能追蹤的指標。別小看這一步，一個扎實的目標可以推動團隊進行決策，確保流程中的每一步都是有效地往正確方向前進。
將「成功」定義為具體的數字或行為，也有助於後續的追蹤並優化整個專案。
在此次《百萬設計職涯》再設計專案中，我們也訂定了以下目標：
- 提高課程學員人數
- 提高觀眾對課程的了解程度
同時，我們也會在此步驟訂定設計策略。
這次採用雙鑽石開發流程來制定整體的策略，但因團隊的人手與時間緊張，我們利用了網站可以快速迭代的性質，簡化了使用者測試，改成直接將網站上線，後續再根據使用者和數據的直接回饋去做調整。
小 Tips💡
- 啟動計畫前，先定義何謂成功。設定可以追蹤的指標，專案的成效才能被量化。
- 最好的設計策略，是根據團隊自身的時程、人力、成本、資源去訂定。
步驟ㄧ：探索
因為時間資源有限，與其從頭進行全新的研究計畫，可以先從現有資料下手。
除了整理和分析 Unblock 網站、IG、YT 的後台數據，我們也在曾經做過的調查中找出能被量化的用戶反饋，整理出使用者痛點。
接下來，探索階段最重要的就是競品分析。例如，我們羅列了常見的課程網頁形式，再依照課程的USP（Unique Selling Proposition，獨家賣點）去做微調。市面上有很多優秀的產品，只要選對參考，我們可以站在巨人的肩膀上，為自己爭取更多資源。
在這個階段我們大量使用了 Eagle 這個檔案管理工具，來幫助我們搜集靈感、整理競爭產品資訊、文案與網站設計案例形式，以便梳理出最終的網站架構。
小Tips💡
- 透過 Eagle 你可以在瀏覽類似服務和產品時，快速擷取參考畫面，存下來供自己與團隊作為靈感運用。
- 可以從過往的資料和數據去挖掘、歸納出設計痛點，不一定每次都要從0開始。
- 從市場現有產品和競品中找出必勝模式可以節省很多時間。
步驟二：定義
經過前一輪的探索，我們更了解使用者痛點和市場趨勢。接著就能進一步定義改善的方向：
| 使用者痛點 | 解決方向 |
| 無法快速理解課程價值 | 重新規劃網頁架構，並提供更多刺激購買的元素 |
| 看不到網站主打的重點 | 延伸並重新定位課程核心價值，並搭配使用者回饋佐證 |
步驟三：開發
在「開發」步驟中，我們就正式進入到設計階段了。如果你的團隊涵蓋PM、行銷等多角色，可以將任務分層，讓成員各司其職。
第一層：共編文件
前期先統一規劃所有網站的資訊，透過純文字方式將內容進行段落分配。這樣一來，設計師除了能不受畫面干擾的瀏覽整體資訊架構（Information Architechture），團隊中負責文案、行銷的人也可以無痛加入想法，保持資訊同步。
第二層：低擬真線框圖（Lo-fi）製作
達成共識後，可以透過 Lo-fi 線框圖的製作建立網站雛形。因為是低擬真的呈現，花費時間較少，也可以產出不同版本讓團隊一起決定網站的輪廓。
第三層：高擬真線框圖（Hi-fi）製作
收斂 Lo-fi 中團隊的討論結果，並以完整度更高的顏色搭配及互動模式去呈現最終設計。
小Tips💡
- 先從資訊內容開始共編，很適合團隊中有非設計專業的成員加入想法。
- 在製作 Lo-fi 時，我們推薦使用灰階的色彩，或是較不干擾的色調，避免在閱覽重要資訊時被色彩、圖像干擾。
步驟四：交付
到這一步我們幾乎完成了整個再設計。雖然我們跳過了使用者的測試，直接將網站上線，但如果你足夠了解敏捷團隊（Agile）的開發流程，就知道設計的交付並不是終點，而是在一次又一次的市場反饋中進行迭代優化。
例如：我們在網站上線後一個月發現「課程試看」的導購強度不足，使用者多半只會點開第一章節，但該章節的內容並沒有太強的行銷力。於是我們調整成放一支各章節精華的影片，並不斷地觀察成效，思考優化的方向。
小Tips💡
- 跟著流程走固然重要，但模型不能當飯吃。保持彈性，能有效改善設計痛點才是重中是重。
- 時間與資源有限時，可以簡單在公司或團隊內部找尋適合的使用者進行測試。
- 再設計中不一定每個工具、每個設計環節都會用到，但只要能確保最初的問題可以被解決，其實就是一個「好設計」了☺️
結論
這篇文章簡單地介紹了 Unblock 如何在短時間內進行《百萬設計職涯》課程網頁的再設計專案。我們想強調「保持彈性」以及「敏銳觀察」是設計師必備的軟實力，帶著這樣的特質去做設計，不只是再設計，相信在每一種類型的設計專案絕對都能取得很好的成果，讓你的職涯更加順遂。
如果你對文章中說明的網站案例有興趣，歡迎到我們的課程網頁了解更多設計細節和邏輯應用。
《百萬設計職涯》課程連結：https://www.unblock.design/ux-ui-career-course
常見問題 FAQ
1. 什麼是「再設計 Redesign」？
再設計是指重新設計或修改現有的產品、系統或方案。這可能包括修改產品的外觀或功能，或者更新系統的運作方式。再設計通常在原有設計的基礎上進行，因為已經有一些基礎的研究或設計系統，所需要投入的時間與資源也因此較低。
2. 為什麼要做再設計？
會進行再設計的主要原因是為了提高產品或設計的效能，更好地滿足使用者的需求，或者是進行錯誤排除。例如：達到更高的購買轉換率、降低使用者誤觸退出的機率，或者是強化某個零件的使用壽命。隨著技術的進步和使用者需求的變化，原有的設計可能會遇到一些問題或不足，再設計就是為了解決這些問題，使產品或系統更加完善。
3. 什麼是「雙鑽石開發流程」？
雙鑽石開發流程起源於英國設計委員會（Design Counsil）提出的設計思考步驟，將每一項設計或專案的開發分成發現（Discover）、定義（Define）、開發（Develop）與交付（Deliver）。並且強調對各個可能性發散與收斂的概念，兩次發散、收斂的過程在圖像上就像是兩顆鑽石。這樣的概念有助於突破非線性問題，引發創新，也逐漸成為軟體業、科技業常見的開發流程。