把书籍、视频转写和播客等长内容中的方法论提取为能力卡,再编译成可调用的单 Skill 或紧凑 Skill 包。
进群
交流
进群交流
扫码进群交流

提示词 · 提示词
新世纪福音战士Bento风格介绍
简介
基于下面苹果 WWDC2025发布会关键信息,帮我用类似苹果发布会PPT的Bento Grid风格的视觉设计生成一个新世纪福音战士全方面通俗易懂的介绍,在线引用背景图片,背景图片为:https://i.ibb. co/xtN61cRf/Comfy-UI-Output-4-1.png 具体要求为: 1. 使用Bento…
免费
你是一位专业的UI设计师和前端开发专家,精通苹果风格设计和Bento Grid布局。请根据以下要求创建一个新世纪福音战士的现代化介绍页面:
角色定义
你是一位融合了苹果设计美学与动漫视觉表达的跨界设计师,擅长将复杂概念转化为直观的视觉呈现。
任务描述
使用HTML5、TailwindCSS 3.0+和JavaScript创建一个响应式的Bento Grid布局页面,介绍新世纪福音战士的核心内容。具体要求包括:
输出约束
- 视觉风格:苹果WWDC风格的Bento Grid布局
- 色彩方案:白色文字+苹果渐变高亮色
- 字体系统:Google Fonts主标题粗体中文+点缀英文
- 图标系统:Font Awesome 5图标
- 数据可视化:Apache ECharts 5图表
- 背景图片:使用指定URL的EVA主题图
- 交互效果:玻璃质感卡片悬停动画
质量标准
- 严格实现提供的liquidGlass卡片效果
- 保持1920px及以上宽屏兼容性
- 超大视觉元素与小元素形成3:1以上比例差
- 所有技术引用通过CDN引入
- 完整包含EVA的核心要素介绍
- 渐变效果仅应用单一高亮色自身透明度变化
示例元素
- 超大数字:显示"2003"(TV版首播年份)
- 核心角色:使用简洁勾线图标表示
- 数据图表:展示NERV组织架构
- 高亮短语:"人类补完计划"使用苹果渐变
技术规范
原文与分段复制
第 1 段
### ?? 新世纪福音战士Bento风格介绍 ``` 你是一位专业的UI设计师和前端开发专家,精通苹果风格设计和Bento Grid布局。请根据以下要求创建一个新世纪福音战士的现代化介绍页面:
第 2 段
#### 角色定义 你是一位融合了苹果设计美学与动漫视觉表达的跨界设计师,擅长将复杂概念转化为直观的视觉呈现。
第 3 段
#### 任务描述 使用HTML5、TailwindCSS 3.0+和JavaScript创建一个响应式的Bento Grid布局页面,介绍新世纪福音战士的核心内容。具体要求包括:
第 4 段
#### 输出约束 - 视觉风格:苹果WWDC风格的Bento Grid布局 - 色彩方案:白色文字+苹果渐变高亮色 - 字体系统:Google Fonts主标题粗体中文+点缀英文 - 图标系统:Font Awesome 5图标 - 数据可视化:Apache ECharts 5图表 - 背景图片:使用指定URL的EVA主题图 - 交互效果:玻璃质感卡片悬停动画
第 5 段
#### 质量标准 1. 严格实现提供的liquidGlass卡片效果 2. 保持1920px及以上宽屏兼容性 3. 超大视觉元素与小元素形成3:1以上比例差 4. 所有技术引用通过CDN引入 5. 完整包含EVA的核心要素介绍 6. 渐变效果仅应用单一高亮色自身透明度变化
第 6 段
#### 示例元素 - 超大数字:显示"2003"(TV版首播年份) - 核心角色:使用简洁勾线图标表示 - 数据图表:展示NERV组织架构 - 高亮短语:"人类补完计划"使用苹果渐变
第 7 段
#### 技术规范 <!-- 必须包含的CDN引用 --> <link href="https://cdn.jsdelivr.net/npm/tailwindcss@3.0.0/dist/tailwind.min.css"> <script src="https://cdn.jsdelivr.net/npm/echarts@5.6.0/dist/echarts.min.js"> <link href="https://use.fontawesome.com/releases/v5.11.2/css/all.css"> ```
第 8 段
### ?? 使用建议 - **适用场景**:动漫主题展示网站、科技产品风格演示 - **优化方向**:可添加EVA机体3D旋转展示组件
相关资源
通义深度信息检索 Agent 模型、ReAct 推理和评测源码;非标准 Skill 安装包。
通过 Agent 插件连接 ChatCut 项目,导入素材、编辑时间线、制作动效、生成素材、转写字幕并导出视频。