專案背景
因應公司規模擴張，原有平台有諸多限制且設計缺乏一致性。同時，面對當時每日近萬人次觀看的讀者，要怎麼從眾多文章、專欄、多種刊登形式、付費與免費內容並存的深海中，找到他想看的東西？
原有的網站既已不敷使用且缺乏一致性，我從協助改善網站體驗的角度切入：釐清客戶問題、定義設計目標、進行使用者研究，轉化成網站的 Hifi-Prototype，最後協助客戶、品牌視覺、與工程師對接開發。
設計目標與挑戰
平台上原先有 5000+ 以上的文章，且每篇文章的來源、刊登方式、呈現形式可能都不同，需在不增加內容生產者的負擔、與兼顧付費讀者的體驗下，提出更好呈現方式。
使用者研究
為定義網站的設計方向，帶入更多真實使用者的專業意見與數據，作為設計的基石。
啟發式評估
我設定了五項主要任務操作情境（初次瀏覽、閱讀長文、尋找文章、會員系統、聯絡故事），在現有網站上逐頁走一遍，記錄各頁面的易用性問題。然後依照「調整耗能」把問題分成四類——用字遣詞、介面視覺、功能效率、流程架構——歸納出痛點與改善優先順序。
問卷 + 後台數據交叉分析
問卷拿到讀者的主觀感受，後台數據告訴我們實際行為。把兩份資料疊在一起看，才能分清楚「讀者覺得不好用」跟「讀者其實根本不去用」的差異——這兩個問題的解法完全不同。我把 39 份問卷結果編碼、依問題頻率排序，再匹配後台各頁面的瀏覽數據，歸納出要改進的痛點。
流量分析裡有兩個關鍵洞察：
- 搜尋系統過於難用而使用率低：後台顯示搜尋使用頻率僅 0.46%，推測是太難用導致大家不願使用。權衡開發成本後，我選擇用推薦與分類機制解決需求，只保留簡易搜尋。
- 流量的秘密：文章觸及高，但難找：讀者多以社群推文觸及、直接瀏覽文章，首頁觸及反而普通；熱門與經典文章歷久彌新仍有流量，但過一段時間就難以再被找到。
競品分析
為了掌握報導型網站的設計趨勢，我比對了幾個不同規模的媒體平台，統整出這類網站在廣告版位、內容訂閱、導覽選單、三欄式內文、搜尋系統與引用格式上的共同設計語言，作為設計決策的參考基準。
設計概念：拆成四個優化方向
定義出本次專案需關注的優化項目，拆解成四個主要目標，在設計時亦可拆成四個部分的Wireframe執行。
資訊架構
重新建立一套文章組織體系，並讓讀者能容易發掘想要的內容。同時符合編輯部的撰稿的需求與限制。
而資訊架構的角度提出解決方案，對內容型網站而言能更有效地掌握前後台開發需求。在進入Wireframe前能有更詳盡的策略，來設計頁面版型。
Wireframe 設計
首頁
首頁的設計目標是：讓讀者一進來就有東西可以看，同時感受到平台內容夠豐富、夠多元。
讓讀者認識「故事」
- 一目暸然我們有什麼內容
- 傳達幽默的知識份子質感
讓讀者找到興趣點並推進轉化
- 快速找到讀者感興趣的文章
- 清楚說明訂閱服務
- 付費與免費文章以 2:1 混合推薦，避免免費文章選擇過少
我選擇用滿版欄位呈現，創造感官沈浸的瀏覽體驗；用輪播機制解決讀者感到「內容更新率低」的問題；付費與免費文章以 2:1 的比例混合推薦，避免免費文章選擇過少，讓免費讀者不會覺得「好的文章都要錢」。手機版的版面盡量與桌機保持一致，減少讀者在不同裝置間的認知落差。
內文閱讀體驗
長文閱讀是這個網站最核心的使用情境，所以我在這裡投入了相當多心力。除了基本的 RWD 段落字級設定，主要設計特色是三欄式排版——主要內文、側欄廣告與文章導流欄位並列，兼顧閱讀流暢度和商業需求。
我同時統整了文章各元件的 Guideline，系統化呈現所有 UI 樣式，並製作範文提供給視覺設計師優化，確保後續執行時有一致的標準。
訂閱流程優化
我分析了現有訂閱流程的路徑與接觸點。在金流限制下，重點放在優化訂閱頁本身，並基於文獻資料庫與教學社群的需求，提出增加付費會員實用性的新功能——會員後台的閱讀紀錄、收藏書單、會員專屬區與帳戶資訊，讓訂閱的價值清楚可見。
結論
完整參與從前期調研到各頁面 Wireframe 的內容官網設計，交付項目包括：
- 從客戶利害關係部門、問卷、後台數據與易用性評估，分析需求
- 規劃資訊架構，尤其在文章分類、導覽系統提出設計方針
- 重新設計全站 Hifi-Wireframe，將近 20 個頁面
- 優化訂閱流程、提出增加會員吸引力的新 Feature
本專案已上線，可見故事官網 storystudio.tw。
