anthropics/skills180kfrontend-design
Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.
前端开发
Assemble a 3D-CGI app sizzle — nano-banana CGI plates (blank-glow floating phone + a CGI studio with rim-light + placeholder burst shapes; studio look and phone finish come from the recipe choices) plus PIL compositing of the REAL App Store screenshots onto the bezel + burst-out overlays, driven by Kling 3.0 i2v steady-float per beat with a per-beat Ken-Burns FFmpeg push-in fallback when Kling garbles the UI, then VO/music mix (sidechain duck, loudnorm) + 1.15x speed + anti-AI grain finalize. The on-screen UI, any faces in it, and the wordmark are ALWAYS real assets composited via PIL — never AI-rendered. The paid steps (plates, i2v clips, VO, music) are separate capabilities; this ships the config + PIPELINE + FREE assembly and the recipe orchestrates the spend. Use for the cgi-app-sizzle video format.
把这段话发给 Claude Code、Codex 或 Cursor。智能体会先检查安全性,你确认后才安装。
读取 https://funcoding.ai/skills/gooseworks-ai/goose-skills/render-cgi-sizzle/install.md ,按里面的步骤帮我安装这个 Skill。
Assembles the 3D-CGI app sizzle video format: a phone floats in a CGI studio while five or six app features demo one per beat — each beat bursts REAL App Store UI elements out of the phone in 3D with rim-light + bokeh, then everything collapses back into the screen at a value-prop climax + a brand end card over a music bed. It reads as an Apple-keynote product film, not UGC and not a physical-product shoot.
The worked example (scripts/config.example.json) is MasterClass: a gold phone in a
smoky-black studio with an amaranth rim-light, an "Eryn" keynote-cadence VO, a premium-tech
piano/synth bed, and a "200+ classes. One app." climax. Those are one example, not defaults.
Creative calls the user makes (the recipe's choices, asked in one round before any paid
step). The demo's value is only an example.
studio_look — background, rim-light colour, bokeh; also the end-card canvas + bar.
Asked of the user; the demo used smoky-black #0A0A0A + amaranth #E32652 rim-light.phone — the phone model/finish in every plate. Asked; the demo used a gold/champagne
titanium iPhone 15 Pro.narrator_voice — the VO voice. Asked; the demo used ElevenLabs "Eryn".vo_delivery — how the VO is written and read. Asked; the demo used a restrained
Apple-keynote spec-sheet cadence.music — the bed's genre/mood. Asked; the demo used a premium-tech underscore.This capability ships the recipe (scripts/config.example.json) + a config→step map
(scripts/PIPELINE.md) + the FREE-assembly how-to (scripts/README.md). It documents the
FREE, deterministic assembly between the paid model calls:
--anchored on beat 1 so the phone/studio stay
identical across beats.scene-NN-composite.png;
bake real burst-out overlays (e.g. climax portrait tiles, rim-light baked before
rotation) around the plate. The on-screen UI + faces + wordmark are ALWAYS real assets —
never AI-rendered, so no claim is invented and nothing reads fake.zoompan, heavier on the climax) — the shipped demo used this
path for the feature beats.See scripts/README.md for the full FREE-assembly detail and scripts/PIPELINE.md for the
config-field → source-step map.
Config-and-PIPELINE capability (no re-built runnable pipeline here). Copy the
structure of scripts/config.example.json → config.json, fill the creative fields from the
recipe choices (never the demo's values), rebuild the brand/beats/screens, and follow
scripts/PIPELINE.md:
VO first (locks the timeline) → nano-banana CGI plates → PIL screen composites → burst-climax overlays → Kling i2v clips (Ken-Burns fallback per garbled beat) → PIL end card → captions → sidechain-ducked mix → 1.15x speed + grain.
Output: 1080x1920, ~22s H.264 (+ AAC music). 5-6 feature beats + PIL end card.
anthropics/skills180kGuidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.
前端开发
anthropics/skills180kSuite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.
前端开发
addyosmani/agent-skills103kGuides stable API and interface design. Use when designing APIs, module boundaries, or any public interface. Use when creating REST or GraphQL endpoints, defining type contracts between modules, or establishing boundaries between frontend and backend.
前端开发
addyosmani/agent-skills103kBuilds production-quality, accessible, responsive user-facing UIs. Use when building or modifying interfaces and pages, creating components, implementing layouts, meeting WCAG accessibility requirements, managing state, or when the output needs to look and feel production-quality rather than AI-generated.
前端开发
addyosmani/agent-skills103kOptimizes application performance across frontend, backend, queries, and databases. Use when performance requirements exist, when you suspect performance regressions, when Core Web Vitals or load times need improvement, when N+1 query patterns need fixing, or when profiling reveals bottlenecks.
前端开发
nexu-io/open-design100kOpenDesign's feature business case for the plugin marketplace: the user pain, options, tradeoffs, and the measure of success. Built as a decision-grade product management deck for PM, eng, design, leadership.
前端开发