cinematic-ui

仓库创建 2026年7月25日最近提交 1 天前SkillHot 收录 1 天前

▸ 精选理由

面向要打造电影级视觉与动效站点的团队，含工程化细节

▸ 风险提示

包含针对特定运行时的安装与路径说明，可能有安装脚本风险

这个 Skill 做什么

为网站设计并构建电影感风格的布局、艺术指引与动态效果

按电影级的视觉体系来设计网站，先用分镜（storyboard）规划布局，再给出导演式的美术指引和动态效果实现方案。当你想要电影感的着陆页、导演风格 UI 或特定片种（科幻、悬疑、浪漫等）的网页时用它。特色是用镜头语言和电影动效组织界面，强调叙事感和情绪表达，而不是普通的模板化设计。

▸ 展开 SKILL.md 英文原文

Design and build websites with film-inspired visual systems, director-driven art direction, storyboard-first layout planning, and cinematic motion. Use when the user asks for a cinematic site, movie-style landing page, director-inspired UI, film-noir, sci-fi, romance, thriller, action, animation, or a movie-like website aesthetic, including requests phrased in Chinese. Do not use for generic web design unless the user explicitly wants a film or director reference.

开发编程影视化UI布局动画Claude CodeCodex

Stars

Forks

仓库内 Skill

积累中

7 日增星

安装 / 使用

给你的 Agent 一句话（通用）

帮我安装这个 skill：https://raw.githubusercontent.com/webiscorp/designskill-open/main/skills/cinematic-ui/SKILL.md

或 curl 直取 SKILL.md

curl -fsSL "https://raw.githubusercontent.com/webiscorp/designskill-open/main/skills/cinematic-ui/SKILL.md"

SKILL.MD 节选查看完整文件 ↗

# Cinematic Layout

## Primary Platforms

This skill is built and maintained for **Claude Code** and **OpenAI Codex** as the two primary runtimes.

**Claude Code**
- Invoke with `/cinematic-ui`.
- Project memory and Claude-specific notes live in [`CLAUDE.md`](CLAUDE.md).
- Install path (Windows): `C:\Users\<your-user>\.claude\skills\cinematic-layout`
- Install path (macOS / Linux): `~/.claude/skills/cinematic-ui`

**OpenAI Codex / ChatGPT**
- Codex-specific context lives in [`CODEX.md`](CODEX.md).
- Install path: `$CODEX_HOME/skills/cinematic-ui`

Additional compatibility files:

- [`GEMINI.md`](GEMINI.md) — Gemini / Antigravity-style workflows
- [`AGENTS.md`](AGENTS.md) — shared cross-tool

via SKILL·HOT · 数据来自 GitHub 公开信息 · 原文版权归作者所有