內頁真實內容CONTENT → PAGE LAYOUT
Process / 製作過程
從一個首頁開始，接續完成整套網站
首頁負責定調，門面把設計核心整理出來，再依每個內頁的內容重新組合，讓設計師不必把相同工作逐頁重畫一次。
Step 01
先把已確認的首頁做成可操作網頁
門面依設計完成首頁實作，先對齊字體、圖片、間距、動畫與主要互動。這一步讓後續延伸建立在真實瀏覽器畫面上。
設計細節
主要互動
真實瀏覽器
設計師先完成最重要的一頁
已確認首頁DESIGN → BROWSER
首頁設計→可操作網頁
Step 02
從首頁整理出可延伸的設計規則
把已經出現在首頁的字級、色彩、間距、按鈕、卡片與圖片比例整理成共用依據。後續頁面因此能保持同一種品牌感。
字體與色彩
間距與版面
共用元件
不用再重畫每個重複元件
從首頁整理REUSABLE DESIGN RULES
首頁裡已經成立的判斷，成為全站可以沿用的共同依據。
Step 03
依每個內頁的內容，重新安排版面
門面讀取關於、服務、案例與聯絡等頁面的實際資料，判斷哪些元件可以沿用、哪些內容需要新的編排，而不是把首頁版型複製貼上。
實際頁面內容
合適元件
特殊頁面標記
需要設計師確認真正特殊的頁面
Step 04
完成全站、RWD 與跨頁檢查
逐頁完成桌機、平板與手機版面，再統一檢查導覽、內容、互動與元件一致性。需要的功能與上線工作也能接著完成。
完整內頁
多裝置版面
跨頁一致
最後得到設計一致的完整網站
完整網站ALL PAGES / RESPONSIVE LAYOUTS
首頁關於服務案例聯絡
導覽 ✓元件一致 ✓RWD ✓跨頁檢查 ✓
Before we start
開始前常見問題
首頁一定要是 Figma 嗎？
不一定。Figma 最方便確認尺寸與元件；如果已有完成的 HTML、可瀏覽首頁或其他清楚設計檔，也可以先評估。
所有內頁都可以不出設計嗎？
一般內容頁通常可以直接延伸；如果有高度特殊的互動、資料結構或品牌主視覺，可以指出需要額外確認的頁面。
設計師什麼時候需要參與？
首頁實作確認、全站第一輪輸出後、以及特殊頁面是主要確認節點；其他時間可以依團隊習慣集中回饋。