Atlas - 考托福還是雅思?
重新規劃
UI 設計
UX 設計
Atlas 測驗網站
- 考托福還是雅思?
在預算有限的情況下，協助菁英國際文教優化原有測驗網站，從資訊架構、目標族群研究到視覺呈現，打造更聚焦的導覽流程與模組選擇策略。透過簡潔有效 的設計，放大學生探索動機，同時兼顧品牌調性與資源運用效率。
時間
2024 年 10 月中 - 12 月
共 6 週
我的角色
專案管理
UX 研究規劃
UI 設計
業主
菁英國際文教事業機構
設計流程
目標需求定義 > 用戶與市場分析 > 原網站評估建議 > 新功能與內容規劃 > 專案總結
目標需求定義
專案目標清晰，惟原有架構未能滿足使用者
Atlas 測驗目標為協助學生在短時間內理解測驗差異，協助學生輕鬆找出適合自己的語言測驗。
Atlas 為 菁英國際教育中中心之旗下子品牌，主要為推動『托福』與『雅思』兩大考試之系列課程與教學服務。
業主在補教領域深耕多年，接觸大量學生後發現，許多人在面對托福與雅思選擇時，常希望能快速了解兩者差異，進而找到最適合自己的考試方向。
以低預算達成高效導引，協助學生做出測驗選擇
從業主的第一線觀察與 SEO 驗證，我們確認使用者對於「快速釐清適合考試類型」有明確需求。考量原網站無法有效支撐此目標，在預算限制下，重新設計整體架構與視覺，以提升使用體驗與導引效率。
原始測驗入口
用戶與競品分析
在業主有預算考量的前提下，我們拿掉使用者測試流程，透過業主龐大資料庫及 SEO 驗證，交叉比對驗證出受眾的樣貌與需求，並透過競品分析歸納設計切入點。
根據業主龐大用戶資料庫，歸納兩大主要目標族群
1. 學生：以高中生、大學生為主，通常具備留學動機（交換／研究所申請等）。
2. 職場人士：意拓展國際職涯的上班族，尋求提升語言證照、轉職加分的方式。
歸納族群的核心需求與痛點
1. 核心需求：釐清適合自己的考試類型，並希望透過產品服務達成目標
2. 痛點：在查詢考試類型時，網路資訊過於繁雜，難以決定考試類型
-
考試成本（時間、金錢 ...）
-
考試與目標的關聯（學校要求等）
-
考試性質與自身性格的匹配度（不同考試的聽說讀寫風格皆不同）
-
考試方式（手寫 v.s. 電腦打字，真人 v.s. 電腦口說 ... 等）
找出已被市場驗證，較符合使用者需求的切入點
因此，我透過搜尋引擎關鍵字找出 SEO 表現佳的競品，分析其優勢，作為設計優化的參考。同時觀察大量市面上相關資訊，歸納出體驗較差之不良示範，作為後續設計應避免之依據。
優勢
1. 表格設計：以表格呈現不同考試差異，使用者可直觀理解並快速比較。
2. 口語問答設計：透過簡化過的口語問題，引導使用者根據自己的性格與需求，判斷哪種考試更適合自己。
透過表格快速指出考試差異
用口語化的方式協助學生理解
劣勢
1. 資訊繁複：導致使用者出現「兩者都有部分符合」狀況，更難做出明確選擇。
2. 僅透過文字，理解成本高：描述多為抽象文字。對於從未接觸過測驗之使用者，難以理解或想像具體情境。
_edited.jpg)
僅靠抽象文字說明測驗類型，理解成本高
原網站評估與建議
分析原網站歸納出三大優化提案方向
題目設計：
✅ 問題摘要：用戶在原第一階段『考試體驗』容易流失，與測驗量體、答題壓力有關。
✅ 建議方向：調整第一階段『考試體驗』至第二階段、減少題數、新增跳過選項。
同一題中出現過多答題類型，並且於『考試體驗』出 現過多題目及類型
體驗設計：
✅ 問題摘要：RWD 介面不友善、進度不明。
✅ 建議方向：優化手機版、統一提示設計。
答題提示呈現不一致，導致使用者理解成本過高
引導設計：
✅ 問題摘要：結果頁缺乏誘因與資訊層次，使用者容易流失。
✅ 建議方向：提供解析誘因、補強內容密度與視覺呈現。
目前結果頁內容較單薄
新功能與內容規劃
以提高使用者完成測驗之目標，迭代原網站架構
基於原本網站架構調整設計，在主軸不變的前提下，調整流程如下：
新版流程圖
五大優化策略，重構測驗流程體驗
一、精簡題目內容
Before：題目繁多、作答方式混雜，使用者疲於作答
After：保留核心問題，減少題量，降低作答門檻與時間成本
原本網站畫面
內容繁雜，且手機版無法瀏覽
新版網站畫面
於過場頁提前說明
『查看差異』『切換語言』功能
-
大幅縮減閱讀內容
-
提供『略過』選項
二、提供「略過」選項
目的：尊重用戶節奏，減少中途離開機率
說明：為了避免『略過』影響最終推薦結果，我們提供表格呈現『考試差異』（見下方三），在學生選擇略過試考時，仍可以透過表格理解兩種考試於不同題種之落差
原本網站畫面
-
題目本身冗長，閱讀成本高
-
題目種類缺乏一致性，作答成本高
新版網站畫面
精簡閱讀內容，將重點放在『體驗』考試感覺
收斂並統一『進度條』樣式
新增『略過』選項
三、以表格呈現考試差異
目的：幫助學生快速比較 TOEFL / IELTS 差異（如題型、時間、形式等）
說明：針對不同題型，列舉差異處（如閱讀：托福為選擇題 / 雅思則題型多元）幫助使用者在每個題型節點快速辨識兩考試差異。
新版網站畫面
新增『比較』表格，即便使用者略過題目，也能知道兩種考試類型的差異
四、統一介面與插畫風格
Before：版面鬆散、閱讀阻力高，且缺乏品牌感。
After：統一元件樣式，並搭配符合主網站之插圖提升測驗趣味性。
原本網站畫面
-
插畫風格缺乏品牌感
-
題目類型缺乏一致性
新版網站畫面
-
統一插畫風格，符合品牌形象
-
統一題目風格與題型
五、結果頁優化與 CTA 引導
Before：原結果頁僅顯示推薦考試，內容單薄、行動誘因不足。
After：使用表格呈現推薦考試與原因，搭配明確 CTA（如加入 Line、留下 Email 取得完整解析）提升轉化。
原本網站畫面
-
結果頁顯示單一
-
轉換 CTA 薄弱
新版網站畫面
-
結果頁加入表格幫助使用者辨識適合該考試原因
-
提供清晰並有吸引力的 CTA
專案總結
透過釐清問題與設計，讓產品邁向更清晰的方向
在本專案中，我從使用者需求出發，重新規劃測驗流程與資訊架構，並優化整體視覺風格與操作體驗，讓網站更聚焦、更友善也更具一致性。
雖然因業主預算限制最終未實際開發上線，但交付成果獲得高度肯定，並作為後續品牌數位策略的重要參考。這段經驗也再次提醒我：設計的價值，不只在於交付產品，更在於協助釐清問題、探索解法，並提升產品未來落地的可能性。