跳到正文
cccskills
免费在 GitHub 公开

social-carousel

小红书选辑 / anthology 横滚社交模板 — 8 张竖卡连续 auto-scroll snap loop,每张几何裁切 mask(拱 / 椭 / 半穹顶 / 斜)+ 宋体标题 + 一个 SVG 装饰符号 + 角部期号元数据。用于摄影系列 / 艺术指导 / mood reel / 品牌瞬间集 (6-10 帧)。

触发:"做个 anthology 选辑 / 横滚画廊 / mood reel / 摄影系列展 / 第 0X 辑封面集"。NOT 教程类(用 digital-eguide),NOT < 4 张系列,NOT 文字密集卡(横滚速度藏文字)。

中文简介正在准备中。当前显示原文说明。

查看安装方法

包含的文件(2)

  • SKILL.md3.8 KB
  • scroll-gallery.html12.0 KB

SKILL.md(原文)

安装前可以查看交给 AI 代理的指令内容。

Social Carousel Template

Use this template when the artifact is a curated multi-card anthology — 6–10 images that share an editorial identity and want to be experienced in rhythm, not as a list.

Distinct from digital-eguide/social-carousel.html (12-frame field-notes guide with 50/50 photo + metadata). This one is gallery-paced, no per-card metadata table, sculptural geometric masks.

Use When

  • The user wants to publish a series / anthology / 选辑 / collection — photography, art direction, branding moments, mood reel.
  • Each card carries one image + a short serif title + a volume number (第 0X 辑).
  • The viewing context is browsing / pause / browse — not step-by-step instruction.
  • The output is a fixed-image set (HTML-to-image) or an embedded auto-scrolling strip.

Avoid When

  • The content is a tutorial or numbered steps — use digital-eguide/social-carousel.html (it has progress + per-step metadata) or social-card-swiss/.
  • The series is < 4 entries — make individual cards instead.
  • The content is text-heavy (quotes, body copy) — gallery rhythm hides text.
  • The platform expects discrete swipeable posts (XHS multi-image post) — this is one scrolling strip, not 9 separate posts.

Required Reading

Read this SKILL.md first. Do not read scroll-gallery.html by default.

Read scroll-gallery.html only when you need: the geometric-mask shapes (arch / oval / half-dome / diagonal), the auto-scroll easing values, the seamless-loop double-render trick, or the hover-slowdown behavior. Extract patterns; do not copy the placeholder Songti titles, photo URLs, or class names wholesale.

Design Strategy

Commit to the anthology spine before designing cards:

  • one cover frame role per card (full-bleed, arched, oval, diagonal, masked half-dome)
  • a single rotating ornamental SVG mark style (don't mix flower + grid + arrow)
  • consistent corner metadata (volume + tag + year, picked once)
  • one title font (Songti SC), one meta font (PingFang SC), no third voice

If the cards don't share a visual system, the auto-scroll exposes the inconsistency.

Layout Bias

Prefer:

  • 2:3 or 7:9 portrait per card; mix sparingly, never randomly
  • restrained warm palette (creams / terracottas / sage) over white or near-black
  • one geometric mask per card, rotated through the set
  • ornamental marks small and consistent, in a single accent ink
  • continuous slow auto-scroll, pause on hover, infinite loop

Avoid:

  • emoji or 3D plastic stickers in corner metadata
  • mixing portrait + landscape card aspects randomly
  • adding step numbers (this is not a tutorial)
  • decorative gradients behind images — the mask is the decoration
  • 黑金 / neon palettes — the template's identity is editorial / warm

Platform / Size

A horizontal strip of vertical cards (~ 360×540 each). Designed for embedding on a long page or capturing as a wide image. If the user wants discrete XHS posts, export each card individually.

评价

还没有评价。欢迎分享你的使用感受。

评论

无需登录即可发表。欢迎分享使用感受、提问,或说明在哪些环境下无法运行。

还没有评论。来写第一条吧。

提交后会立即公开。请勿填写邮箱、电话等个人信息。URL 最多 2 个。

0 / 1000 字

此表单受 reCAPTCHA 保护,适用 Google 的隐私权政策和服务条款。

同一仓库的技能

agentic

免费

Conversational AI-first interface with minimal controls, clear outcomes, and delegated task flows for agentic workflows.

中文简介正在准备中。当前显示原文说明。

WyvernCW/Monich32026年6月20日 更新

ant

免费

Structured, enterprise-focused design system emphasizing clarity, consistency, and efficiency for data-dense web applications.

中文简介正在准备中。当前显示原文说明。

WyvernCW/Monich32026年6月20日 更新

App dashboard with purple-themed aesthetic, top-bar navigation, card-based layouts, and developer-first workflows.

中文简介正在准备中。当前显示原文说明。

WyvernCW/Monich32026年6月20日 更新

artistic

免费

High-contrast, expressive style with creative typography and bold color choices for visually striking interfaces.

中文简介正在准备中。当前显示原文说明。

WyvernCW/Monich32026年6月20日 更新

Generate a single-file product landing page with a layered ASCII cosmos hero (rotating ASCII planet, drifting irregular asteroids, comet trails, nebula gas clouds — each in its own harmonious color) plus full marketing sections (about / features grid / showcase / spec / pricing / CTA / footer). Takes a natural-language description of one product (any kind — a note app, a coffee subscription, a CLI tool, an indie hardware, a hosting service…) and outputs ONE working .html file with deep-space dark or warm-letterpress theme. Runs in BOTH Claude Code (writes to ~/Desktop) and GLM / online chat (outputs HTML inline). Trigger phrases: "做个宇宙风产品落地页", "生成 ASCII 产品官网", "ascii-cosmos-gen ...", "做个独立软件 / 独立硬件落地页", or when user drags this skill folder into chat asking for an atmospheric product landing page.

中文简介正在准备中。当前显示原文说明。

WyvernCW/Monich32026年6月20日 更新

Magazine-grade, collage-driven editorial system: warm paper canvas, surreal plaster-and-architecture imagery, oversized display type, hairline rules, and Roman-numeral section markers.

中文简介正在准备中。当前显示原文说明。

WyvernCW/Monich32026年6月20日 更新

查看 WyvernCW 的全部技能

报告此技能的问题