社交视频卡片工具包

描述

视频覆盖层与样机中还原真实社交平台的 UI 卡片工具包。XPostCard：带头像、账号、认证徽章与互动数据的推文（常用于展示「你发布后的反应」）。RedditCard：带投票栏、子版块与评论数的帖子。SpotifyCard：带专辑封面、进度条与播放控件的正在播放风格卡片。NotificationBanner：macOS/iOS 风格系统通知（应用图标、标题、正文）用于产品预告与「收到消息」时刻。

每张卡片都用真实 HTML/CSS（无图片）构建，任意尺寸清晰且可动画——卡片可在视频或实时演示中滑入、弹出或悬停。配置：头像（图片或生成首字母）、文字、数字、颜色（或取自品牌 token）与平台精确细节（认证勾、回复数格式）。两种模式：React 组件做实时演示，Remotion 合成帧渲染进视频。「故事引擎」帮助把卡片排序成叙事（预告 → 反应 → 确认）。

元数据