我是 Aketa Rashiro。我完全翻新了我的作品集網站「sirome.net」！
我做了一個可愛的網站——大家快來誇誇我吧！🎈
我從 Wix 畢業，用 Claude Code 打造，並透過 GitHub 和 Vercel 發布。這次的亮點是與 Notion 的整合。
我創造了一個環境，只要在 Notion 中寫下工作記錄並按下「發布」，Notion 頁面就會直接反映在網站上！耶！🎉
哇！
為什麼要重建
去年年底，Notion 在我寫論文時幫了大忙！我體會到 Notion 有多方便，於是開始建立我的作品檔案。
以前，我是在 Wix 網站上發布工作記錄，但我不太擅長在 Wix 的 CMS（管理畫面）中編輯文章。
此外，我開始用 Notion 記錄日常工作筆記，不知不覺間，Notion 上就形成了一個工作資料庫。
登登！🎉
「真希望可以直接把這個變成網站……！」
你可以。
Notion 非常方便，它本身就具備將文章發布為網站的功能。
很方便。
但是，你無法改變外觀。
由於設計模板有限，你幾乎無法改變外觀（截至 2026 年 5 月）。
既然如此，我想我只能自己動手了。
這時，Claude Code 就作為我的助手登場了。
這就是 Claude Code 的樣子。
好可愛。
Claude Code 太瘋狂了
這是我第一次使用 Claude Code。
之前我用 ChatGPT 製作 Melo-bot 時，
複製貼上程式碼、檢查錯誤、再貼上……
說實話，那項工作相當繁瑣。
Claude Code 會直接從終端機改寫儲存在檔案中的程式碼。
- 「讓它再可愛一點」
- 「我希望滑鼠懸停時能柔和地展開」
如果我像這樣隨口評論，它就會適當地改寫程式碼，並當場實作給我看。這真是「超級瘋狂」。
不過，如果你讓 Claude Code 做太多工作，就會達到「token 限制」，必須等半天或一整天才能再次使用（我使用的是 Claude Pro 方案），所以我同時也會把小的問題或原型丟給一般的 Claude 或 ChatGPT。
噗
我把 Notion 當作我的 CMS
新的 sirome.net 的核心是與 Notion 的完整整合（💡）。
我甚至不再需要網站管理畫面了。
每天在 Notion 中寫記錄。
↓
將狀態改為「已發布」。
↓
它會自動反映在網站上。
而且，即使在發布後，如果我在 Notion 中編輯文章，網站端也會自動更新。
這是不是很瘋狂？
我希望你能體會。
真的。
當然，我也設計了符合網站設計的文章頁面。
伸展開來
可愛。
技術上來說，它是 Notion API → Next.js → Vercel 的配置，並且似乎會透過狀態欄位的變更來觸發增量靜態再生（ISR）。
不過，我其實不太懂。
🎀 魅力點 🎀
作品頁面
對於作品頁面上的精選幻燈片顯示和縮圖規格，
我是一邊實作一邊決定規格的。
像這樣（自動從文章中獲取圖片，透過水平游標移動來縮放）。
能夠在當場測試「如果看起來像這樣感覺會很好」的同時進行建置，這是使用 Claude Code 最棒的部分。
身為設計師，如果我是和工程師合作，
我想像自己會中途放棄，心想：「如果要求這麼多次修改，他們肯定會討厭我。」
AI 在許多方面確實是創意專業人士的革命性工具。
Melo-bot
Melo-bot 會讓 Melo 從頁首的電子佈告欄上一個字一個字地說話。
這重複使用了我之前用 ChatGPT 製作的程式的一部分。
我很高興能讓沉睡的 Melo-bot 在 sirome.net 上復活。
此外，我從 2019 年左右開始與 Tsukunajiro 先生和 Hor 先生秘密創作的像素藝術 Shiro 和 Melo 的世界也復活了。
我很開心，謝謝你們的存在。
像素藝術由 Tsukunajiro 創作。
欸嘿嘿。
可愛。
未來，我計劃逐步增加更多遊戲化的元素。
由於整合了 Notion，載入時間有時會比較長，
所以請用它來打發時間。
每秒旋轉的 Favicon
Favicon 是瀏覽器分頁上顯示的小圖示。
我無法註冊 GIF 動畫，所以我每隔一秒顯示 10 張 PNG 圖片。
可愛。
在智慧型手機上，我把它當作選單按鈕。
點擊它時，它會回頭看。
請也試著在手機上玩玩看。
sirome.net
總共花了兩週製作。
所以，我很高興能從 Wix 畢業。畢竟它很貴。
我利用深夜和清晨的時間一點一點地做，不知不覺就上線了。
AI……我仍然抱持懷疑的態度，但我親身經歷到世界已經完全改變了。
由於法律問題，我還不太想將 AI 用於插圖生成，但
我希望在設計和創作方面能與 AI 好好相處，做出有趣的作品。
如有工作諮詢，請隨時與我聯繫。
此外，從現在開始，我想在作品 credit 和存檔文章上多下功夫，
用心地逐一發布。
我也會追溯更新目前 sirome.net 上的文章。
每一篇都是我投入心血的作品。
感謝大家，讓我能畫這麼多圖，
也很感激能這樣生存下去。
雖然還在進行中，
但請繼續支持 Shiro、Melo 和 Aketa Rashiro！
快來看看網站！期待你們透過回覆或私訊告訴我感想 ✨
技術棧備註
- Claude / Claude Code
- Next.js
- Notion API
- GitHub
- Vercel
- Sharp
順帶一提，這篇文章我也是在 Notion 寫的。
如果你覺得有趣，請分享！
Aketa Rashiro
