{
requestAnimationFrame(() => {
const submenuEls = $el.getElementsByClassName('toggle-menu');
const visible = Array.from(submenuEls).filter(el => !el.classList.contains('toggle-menu-hidden'));
if (visible.length == 0) {
$store.xHeaderMenu.openHamburgerMenu = false;
}
});
}, 400);
$store.xHeaderMenu.overlay = false;
}"
>
Portfolio
希恩攝影 Sion Photographer|Wix 攝影工作室網站建置
於 8月 18 2026
用鏡頭說故事的人,也需要一個能說故事的網站
婚禮 / 人像攝影師 Sion Hsu(希恩攝影)網站架設專案
希恩從事攝影超過 10 年,拍攝範圍橫跨婚禮紀實、自助婚紗、孕婦親子、全家福、毛小孩寫真到各類活動紀錄,客群多元,作品風格也需要兼顧「溫馨」與「質感」兩種調性。
客戶需求
一位攝影師的網站,核心任務其實只有一個:讓照片說話,同時讓陌生訪客願意留下來、進一步聯繫。希恩的需求很明確:
作品分類多(婚禮、婚紗、寫真、親子、毛小孩……),需要清楚的作品集分類架構,方便新人或客戶依需求瀏覽
個人形象要溫暖、真誠,不要太商業化的攝影棚感
需要串接 Instagram、Facebook、LINE 等社群與聯繫管道,降低詢問門檻
我們怎麼做
以作品集為核心的資訊架構把 Gallery 拆分成婚禮紀實、情侶婚紗、登記寫真、個人形象寫真、孕婦親子、全家福、活動紀錄、毛小孩寫真等子分類,讓不同需求的訪客可以直接找到對應的作品,而不是滑過一長串不相關的照片。
首頁用「人」而不是「作品牆」開場首頁以希恩本人的自我介紹和照片開場,搭配一段第一人稱的文字(結婚、養狗、生小孩、當過樂手跑過業務……),把攝影師的個性和溫度放在最前面,再帶出作品輪播,讓訪客先認識人,再認識作品。
社群與聯繫整合頁尾與頁首都整合了 Instagram、Facebook、LINE 等聯繫管道,並在多處放置「聯絡希恩」的行動呼籲,縮短從瀏覽作品到實際詢價的距離。
中英雙語呈現標題與部分文案採中英並陳(如 Home/About/Gallery/Contact),兼顧品牌質感與國際/雙語客群的閱讀需求。
成果
網站上線後,希恩擁有了一個能同時展示多元攝影類型、又不失個人風格與溫度的作品展示平台,訪客可以快速依需求(婚禮、寫真、親子等)找到對應作品,並透過多元管道直接聯繫預約。同時教學客戶後續自行上傳新作品及基本維護營運,目前已營運多年。
前往希恩攝影 Sion Photographer Sion Photographer 網站看看
於 10月 25 2025
Orange Studio 個人作品集案例|網站設計 × 質感風格 × 簡約歐美
作為「橙拾 ORNG Studio」的起點,這個作品集網站是我最初的設計實驗場,從風格選擇、模板調整,到內容架構與排版設計,都是由我一人完成,目的是打造一個屬於自己的品牌起點。
這個網站以簡約歐美風格為主軸,運用現成 HTML 模板進行客製化,專注於資訊層級清楚呈現、視覺風格乾淨俐落,同時保留未來擴充性(如作品新增、連結外部案例、聯絡表單等)。
✨ 專案特色
簡約高質感的視覺設計:運用留白與層次強化閱讀節奏,突顯作品主體。
RWD 響應式排版:手機、平板、電腦瀏覽皆能保持良好體驗。
客製化 HTML 調整:對原始模板結構進行優化與精簡,提升載入速度。
SEO 基礎設定:設定 meta title、description,利於搜尋引擎收錄。
外部連結整合:連結 Behance、Instagram、Wix 等其他作品平台。
🛠 使用技術
HTML / CSS / JavaScript
基礎 SEO schema 設定
Adobe XD & Figma 排版規劃
網頁空間部署 & DNS 綁定
💬 製作心得
作為一個設計師/開發者兼顧的個人品牌起點,這個網站不僅是我作品的展示場域,更是一個與客戶、夥伴對話的開端。它記錄了我學習架站、版型改造、視覺思維的一步步過程,也讓我更確定「想透過網站幫助更多品牌說出自己的故事」。
🔗 作品連結
👉 https://orangestudio.work
是否也想打造一個屬於自己的品牌網站?
歡迎聯絡我,我可以幫你從 0 到 1,建立你的專屬空間。

