我是專案負責人：先把目標說清楚

01 · 專案練習

先說讀者要做到什麼

想像你請同學幫忙做校慶海報，只說「做漂亮一點」，對方可能畫了一張很酷的圖，卻忘了活動時間。不是他沒有做事，而是你們想的「完成」不一樣。和 Codex 合作，也會遇到相同問題。

你是專案負責人：先決定這份作品要幫誰、解決什麼困難。這不要求你懂程式；你可以先說「讀者看完，要能分辨網頁的內容、外觀和互動」。至於程式怎麼安排，可以再請 Codex 提出做法。

02 · 專案練習

這個網站的要求，怎麼慢慢變具體？

本網站最初的方向，是分享學到的 AI 用法與基礎知識。後來要寫網頁入門，需求逐步補上了「術語」「圖片舉例」和「可以操作、看出每個功能扮演什麼角色」，也提出希望連 13 歲的讀者都能理解。這些是這個案例實際出現過的要求。

把這段需求整理後，可以變成下面的工作目標。這是為教學重寫的版本，不是當時的逐字指令：

讓完全不懂程式的設計師，在同一張作品卡上切換 HTML、CSS、JavaScript，觀察內容、外觀和按讚回應的差別。旁邊用白話和圖片說明。

這個目標把「加入互動」說清楚了：互動是為了看懂差異。做很多動畫不一定達到目標；讓讀者能比較切換前後，才是這一次的重點。你可以打開實際的網頁基礎作品卡，對照它是否真的表達了這件事。

03 · 專案練習

把願望分成這次做、之後做

這份分法是本篇的練習建議，不代表當年有這張正式清單。它的作用是讓「完成一篇文章」不會無限長成「開發一個平台」。新想法仍然可以記下來，但先問：沒有它，這次的讀者目標還能達成嗎？可以的話，就放到下一次。

04 · 專案練習

一張任務卡，要寫哪些內容？

任務卡就像設計案的簡短需求單。以下是已填好的教學示例，你可以照著換成自己的內容。

讀者

完全不懂程式、想做第一個網頁的設計師。

問題

看過 HTML、CSS、JavaScript 的名詞，仍想像不出差別。

交付物

一篇存進現有網站、能用瀏覽器開啟的互動文章。

資料

現有文章頁、網站樣式、已確認的文案與可使用的圖片。

範圍

只修改這篇文章、必要素材與文章入口。

限制

使用繁體中文、保留既有視覺；不更動其他工具的功能。

完成條件

切換有可見差異；重設可回到初始狀態；手機不橫向溢出；入口能找到文章。

交付方式

先提供可檢查版本與檢查紀錄；是否發布，依這次明確約定執行。

不確定技術做法時，把不確定寫出來。例如「我不知道開關怎麼做，請先提供最簡單的方案」。你需要提供的是判斷依據，不是裝作已經知道答案。

05 · 專案練習

把「好看、好懂、能用」變成能檢查的事

前兩項可以用瀏覽器操作確認；第三項需要真的找讀者試。沒有做讀者測試，就寫「尚未驗證理解程度」。電腦沒有報錯，不能證明文章人人都看得懂。

當結果不符合要求，回饋也可以依這個方式寫：「關掉 CSS 後差異太小，請加強前後對照，並說明哪部分是外觀。」這比「感覺不對，再改一下」更容易找到修改方向。

06 · 專案練習

現在，替自己寫一張任務卡

選一件小事：替作品集補一段介紹、替文章加一張圖解，或做一個換色示範。先填下面的模板，空白處可以寫「待討論」，但至少要說得出你要去哪裡看成果。

下載空白任務卡（TXT）↓

請先閱讀我提供的任務卡與指定檔案，整理你理解的目標、這次範圍與完成條件。如果資料互相矛盾，先指出來。請用不需要程式背景的方式說明做法，再依我們確認的範圍執行。

下一篇，我們用同一張任務卡安排企劃、設計、製作與驗收的責任。先把工作說清楚，分工才有依據。