← all publishers

candy14432

@candy14432 source repo

Report this profile Claim this profile

• 18 skills
• 0 followers
• 6 hours ago last updated

1. ▌
   Test · candy14432

   規劃與執行可用性測試，蒐集行為與回饋，整理優先修正清單（可含 a11y 驗證）。
   0 installs
2. ▌
   Define · candy14432

   Define
   0 installs
3. ▌
   Ideate · candy14432

   發散解法、繪製線框並探索視覺方向；內含 20 種 UI 風格參考以快速收斂。
   0 installs
4. ▌
   Empathize · candy14432

   蒐集使用者洞察、執行訪談並萃取人物誌與需求背景，建立對目標族群的同理心。
   0 installs
5. ▌
   Prototype · candy14432

   將優選解法轉成可操作原型，設定互動、轉場與狀態，為測試與示範做準備。
   0 installs
6. ▌
   Prototyping · candy14432 bundle

   建立可互動的產品原型與互動流程說明,用於驗證概念、展示設計、測試流程與收集回饋。當任務涉及高保真原型、畫面 flow、互動設計、轉場、狀態設計或原型測試時使用。
   0 installs
7. ▌
   Wireframing · candy14432 bundle

   建立低至中保真的介面線框圖,用於快速規劃版面、資訊層級與互動骨架。當任務涉及頁面草圖、版面配置、功能結構討論、設計初稿或高保真前的方案驗證時使用。
   0 installs
8. ▌
   Tailwind CSS · candy14432

   通用的 Tailwind CSS 最佳實踐與寫法規範，適用任何使用 Tailwind 的前端專案。當要寫或改 className / 樣式、調色、排版、做元件、設計 token、處理深淺主題或響應式、產生 Storybook 視覺時使用。強調 token 優先、禁寫死值、複用元件 class、無障礙；專案專屬規則以該專案的設計系統文件為準。
   0 installs
9. ▌
   Design System · candy14432 bundle

   建立與維護設計系統、Design Tokens、元件規範與文件結構,提升產品一致性與跨團隊協作效率。當任務涉及元件庫、樣式規範、token、文件化、系統治理或跨產品一致性時使用。
   0 installs
10. ▌
    Loading Screen · candy14432

    General, reusable methodology for designing and building loading / 載入 / 進站 / splash / waiting states in ANY project (React, Vue, Svelte, plain HTML; any CSS framework). Use this WHENEVER the user mentions a loading screen, splash, spinner, skeleton, progress indicator, 載入中 / 等待中 / 進站畫面, or "make a loading" — even if they just say "loading". It picks the right loading pattern for the wait, adapts to the host project's own design tokens and brand (never imposing a fixed palette or motif), and covers motion, accessibility, timing, and clean React / standalone-HTML implementations.
    0 installs
11. ▌
    User Interview · candy14432 bundle

    規劃與執行使用者訪談,用來理解需求、行為、動機與痛點,並整理質性研究洞察。當任務涉及需求探索、問題理解、假設驗證、使用情境研究或蒐集使用者第一手觀察時使用。
    0 installs
12. ▌
    Persona Creation · candy14432 bundle

    將研究資料整理成具代表性的使用者人物誌,幫助團隊對目標使用者建立共同理解。當任務涉及 persona、使用者分群、目標與痛點整理、設計對象定義或研究洞察彙整時使用。
    0 installs
13. ▌
    UI Visual Design · candy14432 bundle

    選擇與應用適合的 UI 視覺風格,提升介面設計品質與一致性。當任務涉及視覺風格選擇、色彩配置、排版設計、元件視覺規範或需要參考設計風格庫時使用。
    0 installs
14. ▌
    Usability Testing · candy14432 bundle

    規劃、執行與整理可用性測試,用於發現操作障礙、驗證流程與優先排序改善項目。當任務涉及使用者測試、task flow 驗證、原型評估、可用性問題盤點或設計方案比較時使用。
    0 installs
15. ▌
    Figma Flow Builder · candy14432 bundle

    把互動原型（HTML 或一組畫面截圖＋規格）匯回 Figma，做成有變數、元件（variants／boolean／text 屬性、nested instance）、 流程畫面、UI Flow（箭頭＋觸發標籤）與規格板的完整產物。做法是產生一支自寫的 Figma plugin（manifest.json + code.js）給使用者在 Figma desktop 執行，因為 Figma MCP 只能讀不能寫。只要使用者說「匯回 Figma」「匯進 Figma」「做成元件／變數」「畫 UI Flow」 「把畫面放進 Figma」「重跑 plugin」「plugin 匯入 figma」，或要把 HTML 原型、PM 規格、流程畫面變成 Figma 元件庫，就用這個 skill， 即使他沒提到 plugin。也涵蓋後續維護：改原型後同步 plugin、重跑覆蓋、用 mock 驗證、對實機截圖校字級。
    0 installs
16. ▌
    Accessibility Design · candy14432 bundle

    評估與改善介面、內容與互動的無障礙品質,使產品更符合 WCAG 與包容性設計原則。當任務涉及對比度、鍵盤操作、語意化、表單可用性、螢幕閱讀器支援或 a11y 檢查時使用。
    0 installs
17. ▌
    Waving Hand Animation · candy14432 bundle

    Add a friendly "waving hand" attention animation to an icon, emoji, or SVG — the element scales up, wiggles side-to-side like a real wave, then shrinks back and settles (放大 → 揮手 → 縮小歸位), looping with a pause between waves. Use this WHENEVER the user wants a hand/emoji/icon to wave, wiggle, or "say hi", asks for a 揮手 / 揮手動畫 / 手手動畫 / waving hand, wants to draw attention to a call-to-action button (提問/發問/報名/CTA) with a moving icon, or describes "放大縮小再歸位", "scale pulse", "wiggle", "attention-grabbing icon animation". Works in plain HTML/CSS, React, Vue, Svelte, and Tailwind — even if they don't name a framework or say the word "animation" explicitly.
    0 installs
18. ▌
    Information Architecture · candy14432 bundle

    規劃資訊架構、內容層級與導航結構,讓使用者更容易理解與找到資訊。當任務涉及網站地圖、內容分類、導航重組、卡片分類、tree testing 或大型內容結構設計時使用。
    0 installs