A · Ceremonial Editorial
Direction A · 旗幟之下
旗幟之下Ceremonial Editorial
把網站做成一本典禮紀念冊：全寬照片、襯線大字、金色細線、對稱構圖。重點是莊嚴、榮譽與時間感，適合首頁、About 與年度回顧。
最適合首頁 · About · 成就
查看原型
B · Institutional Modern
Direction B · 科大藍 · 紀律幾何
科大藍 · 紀律幾何Institutional Modern
以 HKUST 官方品牌色與瑞士網格為骨架，把紀律轉譯為幾何秩序。最符合大學品牌規範，也最容易通過審批與長期維護。
最適合全站結構 · Training · Media
查看原型
C · Youth in Formation
Direction C · 青年儀仗
青年儀仗Youth in Formation
把護衛隊當作一支運動隊來設計：紅黑對比、超大字、斜切構圖、倒數與 sticky CTA。最適合同齡人招募與社交媒體 campaign。
最適合/join 招募頁 · IG campaign
查看原型
D · Cinematic Chronicle
Direction D · 光影紀事
光影紀事Cinematic Chronicle
把網站做成一部短片：深色背景、低光攝影、金色細節、滾動驅動的章節。最有記憶點，適合專題、訪京團與年度回顧。
最適合/stories · 聯合升旗紀念頁
查看原型
Recommendation
B 為骨，A 為魂，
C 為招募，D 為專題。
不建議全站只用單一方向。最務實的組合是：以 B 的科大藍／白底／網格作為結構與導航，讓 A 的典禮照片、襯線標題與金色細節承担情感時刻，將 C 的語言集中在招募落地頁，並用 D 處理年度回顧或聯合升旗專題。
B結構：品牌合規、可讀性高、易維護，適合作為全站骨架。
A情感：Hero、引言、時間軸與成就頁的儀式感。
C轉化：招募頁的大字、對比、倒數與 sticky CTA。
D深度：專題頁的電影感與滾動敘事。
如何使用這些原型
直接用瀏覽器打開每個資料夾內的 index.html，或在此目錄執行 python3 -m http.server 8000，然後瀏覽 http://localhost:8000/prototypes/。所有原型均為單頁、響應式、含基本無障礙與 reduced-motion 支援。
素材與授權
原型使用香港科技大學 DSTO 頁面、HKUST News 與 DSTO 比賽報道中的公開照片，僅供內部設計討論。正式對外發佈前，須確認品牌使用許可、攝影師與隊員授權；字體經 Google Fonts 載入，正式版應改為本地字體或 HKUST 指定字體。