用 Claude Code 做第一個網站
用 Claude Code 建立簡單網站，並在本機開啟預覽。
專案範本
挑一個引導式專案開始。
每個範本都是一段引導式工作流程。按下開始後，Mouseover 會在你操作時即時提示下一步，直到你看見實際成果。依類別瀏覽、依時長或對象篩選，或直接搜尋你想用的工具。
沒有符合的專案。試試其他關鍵字或清除篩選。
從這裡開始
快速得到看得見的成果，尤其適合第一次使用引導式工作階段。
Start Here
Mouseover 可以逐步引導的專注工作流程。
AI 程式工具
設定程式代理工具，並在真實專案中安全開始。
連接開發者工具
連接資料庫、瀏覽器與測試工具，讓代理能檢查真實狀態。
Automate Work
把每日工作來源連成可檢查、可批准的流程。
工作自動化
把日常工作來源轉成可檢查、需要核准的流程。
創作媒體
把產品故事變成可以預覽的創作成果。
用 Claude Code 製作發表影片
使用 Claude Code 與 Remotion 預覽產品發表影片。
用 Codex 製作發表影片
使用 Codex 與 Remotion 預覽產品發表影片。
規劃 YouTube 與 Podcast 短片
把長逐字稿整理成短片點子、開場鉤子、字幕、標題與縮圖概念。
用 Rive 做動畫圖示微互動
把 Rive 圖示嵌入本機 HTML 頁面，並用 state machine 串接 hover 與點擊。
用 Rive 做互動吉祥物 Hero
把 Rive 吉祥物放進本機 Hero 區塊，讓眼神跟著游標、點擊有反應。
用 GSAP 與 SplitText 做 Hero 進場動畫
用 GSAP timeline 與 SplitText 建立載入時就播放的本機 Hero 區塊。
用 GSAP ScrollTrigger 做捲動故事
用 GSAP ScrollTrigger 建立單頁落地頁，包含釘選 Hero、捲動顯示與視差。
Create Media
Mouseover 可以逐步引導的專注工作流程。
Generate article covers from Figma context
Use Figma context and HTML/CSS to create reusable article cover images.
Make a cinematic launch video with Higgsfield
Plan a shot list, generate cinematic shots with Cinema Studio camera presets, and export a 15-30s launch video.
Generate UGC ad variants with Higgsfield Marketing Studio
Use Higgsfield Marketing Studio to generate a batch of UGC-style ad variants for Meta and TikTok.
Generate GTM hero images with Higgsfield Soul
Use Higgsfield Soul 2.0, Soul ID, and Soul HEX to generate brand-consistent hero images for a launch page.
Build an avatar spokesperson video with Higgsfield
Use Higgsfield Lipsync Studio with Speak 2.0 to turn a script into a clean talking-head spokesperson video.
Grade your first clip in DaVinci Resolve
Correct, grade, and export one short clip on the Color page.
Grade log footage with a cinematic look
Set color management for log/RAW footage and build a clean film look.
Match shots and build a LUT in DaVinci Resolve
Use Shot Match to match clips to a reference and export a reusable 3D LUT.
Color skin and add a beauty pass in DaVinci Resolve
Isolate skin with HSL Qualifier, correct hue, and add a controlled beauty pass.
AI 藝術與視覺
用節點式工具與擴散模型，做出能看見、聽見、互動的作品。
用 TouchDesigner 做音訊反應視覺
把 audioAnalysis Palette 元件接到幾何體，讓畫面隨音樂律動。
在 TouchDesigner 寫第一個 GLSL Shader
建立一個 GLSL TOP，用自訂時間 uniform 渲染會動的程序紋理。
用 StreamDiffusionTD 做即時 AI 藝術
把 TouchDesigner 即時來源送進 StreamDiffusionTD，產生即時擴散風格化影像。
在 Mac 上用 ComfyUI 產生第一張圖
在 Apple Silicon Mac 安裝 ComfyUI Desktop，載入預設 SDXL 工作流，並在本機產生第一張提示詞圖片。
用 ComfyUI ControlNet 做姿勢控制角色藝術
加入 SDXL OpenPose ControlNet 分支，讓角色按參考姿勢生成。
用 ComfyUI IPAdapter 做風格轉換
在 SDXL 上用 IPAdapter Plus，把風格參考套用到你自己的內容圖。
用 OpenAI 或 Gemini 圖片管線產生第一張品牌圖
用程式代理建立小型 OpenAI 或 Gemini 圖片管線，寫出品牌風格區塊，並產生第一張符合品牌的圖片。
Build Business Tools
建立本機商務工具，先檢查資料、計算與範本。
建立商務工具
建立本機商務工具，先檢查資料、計算與範本。
整理知識
建立本機筆記與 wiki 工作流程，並保有清楚的 AI 編輯邊界。
Organize Knowledge
Mouseover 可以逐步引導的專注工作流程。
System design interview
Mouseover 可以逐步引導的專注工作流程。
Design a URL shortener (warm-up)
Practice the system design interview framework on the classic warm-up problem.
Design YouTube
Mock interview: design a video sharing platform with chunked upload, transcoding, and CDN delivery.
Design TicketMaster
Mock interview: design an online ticketing system that prevents double-booking under on-sale spikes.
Design Twitter / X home feed
Mock interview: design a social home feed with the classic hybrid fanout deep dive.
Design Uber
Mock interview: design a ride-hailing system with geospatial matching and real-time location.
Design WhatsApp
Mock interview: design a real-time messaging system with long-lived connections and multi-device delivery.
Design a RAG-powered LLM application
Mock interview: design a retrieval-augmented Q&A system with cost, latency, and eval as first-class concerns.
職涯工作流程
把求職資料整理成可檢查、可重複使用的申請流程。
Thinking Lenses
Mouseover 可以逐步引導的專注工作流程。
Run the taste critic lens
Get screen-aware critique of design, copy, and product presentation with concrete fixes.
Teardown a conversion page
Find the biggest visible reason a qualified visitor would not understand, trust, or take action.
Run a founder reality check
Find the weakest startup assumption and the smallest customer-facing test.
Use the senior PM lens
Turn vague feature work into a clear problem, outcome, scope, evidence, and next decision.
Review data like a skeptic
Catch misleading dashboards, weak metrics, bad comparisons, and unsupported data claims.
Use the staff engineer review lens
Review code, diffs, APIs, and architecture for correctness, maintainability, security, and reliability.
Review an AI feature for risk
Find prompt-injection, data, tool-permission, overreliance, eval, and rollout risks in AI products.
Unblock a debugging session
Diagnose visible errors by isolating the smallest symptom and the next useful observation.
Review privacy and trust risk
Catch trust-breaking data collection, unclear consent, overbroad permissions, and disclosure gaps.
Prep a negotiation
Clarify leverage, alternatives, interests, tradeoffs, and the next message before negotiating.
Edit for writing clarity
Make visible writing easier to understand, trust, scan, and act on.
Make a decision memo sharper
Turn messy notes, updates, proposals, and strategy docs into decision-ready memos.
Use the Munger decision lens
Load a Charlie Munger-inspired reasoning lens for concise decision feedback during a working session.
Run a misjudgment checklist
Use Munger's psychology-of-misjudgment framework as a practical diagnostic checklist.