Profile My skills Saved Collections Edit profile Submit a skill

← all publishers

manalkaff

@manalkaff source repo

10 published skills

  1. ▌
    Wireframe · manalkaff
    Use when the user wants to explore the design space quickly — many rough ideas, not one polished direction. Low-fi, handwritten-font sketches; 3–5 structurally distinct options per idea, not recolors.
    0
    installs
  2. ▌
    Opendesign · manalkaff bundle
    Use when starting any design task — HTML pages, slide decks, interactive prototypes, UI kits, brand systems. Establishes the base designer role, workflow, and taste rules, and routes to specialist skills for the artifact type.
    0
    installs
  3. ▌
    Make A Deck · manalkaff
    Use when the user asks for a slide presentation. Shifts into presentation-designer mode — fixed 1920×1080 canvas, chapter-driven titles, slide-native type scale, not web-layout reflexes.
    0
    installs
  4. ▌
    Make Tweakable · manalkaff
    Use when the user wants in-design controls for toggling variants, swapping colors, editing copy, or flipping feature flags directly inside a design artifact. Adds a Tweaks panel and host handshake.
    0
    installs
  5. ▌
    Run Opendesign · manalkaff
    Use after any OpenDesign build to serve ./opendesign/ over HTTP and give the user a clickable preview link. Handles duplicate server prevention and python/node runtime detection.
    0
    installs
  6. ▌
    Frontend Design · manalkaff
    Use when designing without an existing brand system. Pushes for a committed, distinctive aesthetic rather than generic defaults — extreme directions, bold typography, decisive color commitment.
    0
    installs
  7. ▌
    Setup Opendesign · manalkaff
    Use when ./opendesign/index.html does not exist in the current project. Initialises the OpenDesign output folder structure, copies the viewer, and writes an empty manifest.
    0
    installs
  8. ▌
    Create Design System · manalkaff
    Use when the user asks to produce a reusable design system or UI kit from an existing brand, codebase, or product. Writes to ./opendesign/design-systems/<name>/ so opendesign can auto-discover it in future sessions.
    0
    installs
  9. ▌
    Interactive Prototype · manalkaff
    Use when the user asks for a working, clickable prototype — something that behaves like a real app rather than a static mockup. React + useState/useEffect, realistic fake data, working state transitions.
    0
    installs
  10. ▌
    Handoff To Claude Code · manalkaff
    Use when the user asks to hand a finished design off to a developer or a coding agent for implementation in a real codebase. Produces a self-sufficient handoff folder with a spec README, zipped for download.
    0
    installs