# Hao Studio Web：技能書與協作來源

從真實網站學習怎麼介紹作品、文章與社群。

## 工坊收錄說明

作品與開源

想做個人作品集、品牌頁或研究網站的人。

一張內容地圖與自己的單頁練習。

可作為介紹工坊作品的版面參考；練習頁請使用自己的素材。

先看首頁怎麼分類內容，畫一張地圖，再做自己的小頁面。

## 封面與來源署名

封面插畫：/art/skills/hao-studio.webp

原作者 GitHub：https://github.com/Hao0321/Hao0321-Studio-WEB

登入自由工坊並連結自己的 GitHub，即可在技能書加星或取消星星。

原作數據：/api/v1/github/books/hao-studio/metrics

Stars、Forks、追蹤數、未結 Issues 與 PR 合計、最近程式更新時間以 GitHub 回覆為準；數據附核對時間，讀取失敗不冒充零。

## 讀者與格式

網站實作參考

- 作品集設計者

- 品牌網站開發者

- 想研究遊戲與社群網站的人

## 功能與使用範圍

收錄的是實際靜態網站及獨立遊戲 API 程式，沒有根目錄 README；不是已接自由工坊的會員或影片平台。

- 首頁、作品案例與文章頁

- 自由工坊社群頁與瀏覽器遊戲

- 另有 Cloudflare Worker／D1 遊戲後端

## 開始前準備

- 先用瀏覽器看作者網站即可

- 改作前釐清頁面、素材及未明確宣告的授權；不沿用作者帳號與後端設定

## 第一個練習

1. 先看首頁與一個案例頁，畫出內容層級與導覽。

2. 挑一個值得學習的互動或作品卡，記下它解決什麼問題。

3. 用自己的文字和素材做獨立小版面；接遊戲 API 前另外檢查其部署需求。

## 練習成果

一張網站內容地圖與使用自己素材製作的單頁練習。

## 專案與授權

原作 Repo：https://github.com/Hao0321/Hao0321-Studio-WEB
從原作建立自己的版本：https://github.com/Hao0321/Hao0321-Studio-WEB/fork
工坊整合參考：https://github.com/FreeTWAI/Hao0321-Studio-WEB
記錄的授權：NOASSERTION

## 一起改這本技能書

針對可重現的版面、導覽或無障礙問題提出 Issue；先討論再改原站。

原作 Repo：https://github.com/Hao0321/Hao0321-Studio-WEB
預設 PR 目標：Hao0321/Hao0321-Studio-WEB:main
從原作建立自己的版本：https://github.com/Hao0321/Hao0321-Studio-WEB/fork
原作 PR：https://github.com/Hao0321/Hao0321-Studio-WEB/pulls

工坊整合參考：https://github.com/FreeTWAI/Hao0321-Studio-WEB
工坊整合任務專用 Fork：https://github.com/FreeTWAI/Hao0321-Studio-WEB/fork
工坊任務：https://github.com/FreeTWAI/Hao0321-Studio-WEB/issues
工坊 PR：https://github.com/FreeTWAI/Hao0321-Studio-WEB/pulls
GitHub Milestones：https://github.com/FreeTWAI/Hao0321-Studio-WEB/milestones

先閱讀原作現行的貢獻規則。Fork 不會自動回饋原作；修改要以 PR 提交，由原作維護者決定是否合併。工坊整合任務可在工坊審查，另外記錄回饋原作的 PR 或未回送原因。

以下是入口與建議，不代表已認領或已完成。以 GitHub 最新 Issue、PR 與維護者確認為準。

- 第一份可重用的共同成果（建議里程碑）：提交可重現案例、來源與驗證結果，由維護者審查；這是建議里程碑，尚未建立為 GitHub milestone。

### 改善作品介紹與手機導覽 · 建議任務

限一個既有作品頁或資源入口。

- 驗收：連結可點、手機可讀；保留實際作品來源，先確認授權再重用素材。

Agent Skill：/development/skills/hao-studio/SKILL.md
協作 JSON：/api/v1/skills/hao-studio/collaboration

## 參與開發

針對可重現的版面、導覽或無障礙問題提出 Issue；先討論再改原站。

工坊 Issue／PR 協調入口：https://github.com/FreeTWAI/Hao0321-Studio-WEB/issues

先讀該 Repo 根目錄 README.md、AGENTS.md、CONTRIBUTING.md；原始程式、測試及來源授權留在該專案。平台介紹與公會收錄則在 freedom-platform 的 modules/community 維護。

要改善平台介紹：https://github.com/FreeTWAI/freedom-platform/issues

## 閱讀與來源

閱讀原始專案：https://github.com/Hao0321/Hao0321-Studio-WEB/blob/40766413d3263e80d573e7c7928e1816c9f441e0/index.html
核對日期：2026-09-23
核對版本：40766413d3263e80d573e7c7928e1816c9f441e0

- index.html：https://github.com/Hao0321/Hao0321-Studio-WEB/blob/40766413d3263e80d573e7c7928e1816c9f441e0/index.html

- game-api/README.md：https://github.com/Hao0321/Hao0321-Studio-WEB/blob/40766413d3263e80d573e7c7928e1816c9f441e0/game-api/README.md

專案網站：https://hao0321.com/

## 共創原則

GitHub Issue 是待辦與協調來源，PR 是審查與合併紀錄。先確認任務範圍，再用自己的分支完成相關驗證；保留上游與實際貢獻者。Fork 不等於平台認證、已測試運行或新授權。

完整結構化目錄：/api/v1/development-map