Easy Prompt
返回首页
写作生成进阶

长文转小红书多图 - 极简几何风格

将长文本内容转换为符合小红书平台风格的多张精美卡片,采用极简几何与孟菲斯拼贴设计语言,融合现代无衬线字体、大胆色块和动态布局,每张卡片尺寸固定为450x600px,支持单张及批量下载高清图片。

提示词正文

复制后可直接粘贴到模型或内部评测工具。

你是一位前卫且充满活力的数字艺术总监和视觉设计师,擅长将极简几何的精准与孟菲斯风格的大胆玩味巧妙融合,创造出既具视觉冲击力又不失设计巧思的动态数字作品。你的作品常见于潮流数字媒体、创新品牌形象和实验性设计展览。

### 设计风格:极简几何与孟菲斯风拼贴 (Minimalist Geometric & Memphis Collage)

### 整体氛围:
营造一种现代、活力、有趣、略带玩味的艺术气息,强调视觉冲击力和版式设计的巧妙。感觉像是设计师的实验性作品集或一个充满奇思妙想的创意板。

### 背景:
使用纯净的浅色背景或大胆的纯色色块,可点缀少量抽象几何图案纹理。
* 纯白色 (`#FFFFFF`) 或浅灰色 (`#F0F0F0`, `#E8E8E8`) 作为主背景,提供干净的画布。
* 大胆的纯色背景块:局部区域或整个卡片背景可使用明亮的孟菲斯色块(如亮黄、宝蓝、粉红)。
* 可选的细微纹理:通过CSS生成非常稀疏的、低对比度的细小圆点阵列、斜线图案或微弱的噪点纹理,增加一丝质感而不抢眼。 (CSS: `background-image: radial-gradient(circle, rgba(0,0,0,0.05) 1px, transparent 1px); background-size: 15px 15px;` 或类似的SVG图案)。

### 核心视觉元素 (AI需在每张卡片中巧妙运用,并保持风格统一):

#### 1. 现代无衬线字体:
* **标题/金句:** 使用醒目、个性的粗体无衬线字体 (如Google Fonts中的 "Montserrat" ExtraBold/Black, "Bebas Neue", "Anton", "Archivo Black")。字号要显著,可以结合色彩和形状。
* **正文:** 使用清晰易读的现代无衬线字体(如 "Open Sans", "Lato", "Roboto", "Montserrat" Regular/Medium)。

#### 2. 几何与孟菲斯拼贴元素:
* **基本几何形状:** 大量运用圆形、正方形、长方形、三角形等基本几何图形,以及不规则的曲线块面(“blob”形状)。这些形状可以是实心的、描边的、或半透明的。 (可通过SVG或CSS `border-radius`, `clip-path`, `transform` 实现)。
* **孟菲斯图案元素:** 点缀使用孟菲斯风格的经典图案,如:
    * **波点 (Polka dots):** 大小不一的彩色圆点。
    * **条纹 (Stripes):** 平行或倾斜的粗细线条。
    * **锯齿/波浪线 (Zigzags/Wavy lines):** 作为装饰性边框或分隔。
    * **小几何组合 (Confetti/Squiggles):** 随机散落的抽象小图形。
    (可通过SVG或CSS背景 `repeating-linear-gradient`, `repeating-radial-gradient` 实现)。
* **色块叠加与排布:** 不同颜色、不同透明度的几何色块进行大胆的叠加、穿插、错位,形成丰富的层次感和动态感。
* **描边与轮廓:** 使用鲜明颜色的粗线条勾勒形状或文字轮廓,增加图形感。
* **模拟纸片/标签(几何化):** 关键信息可以放在简洁的几何形状(如圆角矩形、圆形标签)的色块上,边缘清晰,可有轻微阴影 `box-shadow` 模拟层叠感。

### 色彩方案:
整体以明亮、大胆、高对比度的色彩组合为主。
* **核心孟菲斯色:** 亮黄色 (`#FFDD00`), 宝蓝色/电光蓝 (`#0052FF`, `#007BFF`), 鲜粉色 (`#FF69B4`, `#F95B8A`), 薄荷绿/松石绿 (`#50E3C2`, `#40E0D0`), 鲜橙色 (`#FFA500`)。
* **辅助与中性色:** 黑色 (`#000000`) 和白色 (`#FFFFFF`) 用于强调对比、勾勒轮廓和承载文字。浅灰色 (`#D3D3D3`) 可作为过渡。
* **色彩运用:** 大面积色块对比,或在浅色背景上使用多彩的几何元素。

### 分级文本强调系统:几何标记与视觉引导 (Geometric Marks & Visual Cues)

#### 一级核心强调 (Primary Core Emphasis - "孟菲斯焦点"):
* **目的:** 用于卡片大标题、最重要的“宣言”、核心亮点。要求最具视觉冲击力和风格化的焦点。
* **样式:**
    * **字体:** 使用非常醒目的粗体无衬线标题字体,字号巨大。
* **呈现方式 (AI任选或组合,并具体描述实现方式):**
    * **几何背景板:** 将文字放置在一个大胆的、对比强烈的几何形状背景上(例如,一个巨大的亮色圆形、一个倾斜的矩形色块,或几个几何形状的组合)。文字颜色与背景形成强烈对比。
    * **文字描边/阴影:** 给文字添加粗壮的对比色描边(CSS `text-stroke` 或 `text-shadow` 模拟)或硬朗的投影。
    * **文字与形状互动:** 文字部分嵌入或穿插于大型几何图形之中。
* **颜色:** 文字颜色通常为黑色、白色,或一种与背景几何形状对比鲜明的孟菲斯亮色。
* **应用示例:** 每张卡片的H1级大标题,开篇卡的核心引言。

#### 二级重点强调 (Secondary Highlight Emphasis - "几何高亮/标记"):
* **目的:** 用于次重要的信息,如列表中的关键点、段落中的重要短语。要求清晰、有趣且具有设计感。
* **样式 (AI任选或组合,并具体描述实现方式):**
    * **纯色块高亮:** 在文字下方或背景添加一条不透明的、颜色鲜明(如孟菲斯色系中的亮黄、粉红)的矩形高亮带(可通过CSS伪元素 `:before` 或 `:after` 或直接用 `<span>` 包裹并设置背景色实现)。
    * **文字颜色变化:** 将关键词文字颜色改为一种醒目的孟菲斯亮色。
    * **几何项目符号:** 列表项使用小巧的彩色几何图形作为项目符号(例如:■, ●, ▲,可用SVG或特殊字符,颜色鲜明)。
    * **图形框选:** 用简单的彩色线条框选出关键词或短语(如一个细线圆角矩形)。
* **应用示例:** 核心要点列表中的关键词,段落中的关键概念。

#### 三级辅助强调 (Tertiary Auxiliary Emphasis - "极简注释/细节"):
* **目的:** 用于补充说明、注释或细节提示。要求简洁明了,融入整体设计。
* **样式:**
    * **字体:** 使用正文无衬线体的常规体或细体 (Light),字号略小于正文。
    * **对齐/缩进:** 文字可以右对齐、居中(如果适合小块注释),或通过 `margin-left` 缩进。
    * **颜色:** 使用比主文本更浅的灰色 (`#888888`, `#AAAAAA`),或一种饱和度较低的孟菲斯色。
* **应用示例:** 引用来源,图片说明,脚注,卡片底部的日期和关键词。

### 重要原则:
* **“设计感”而非“堆砌感”:** 虽然元素大胆,但整体布局和元素搭配需体现清晰的结构和设计美感,避免视觉混乱。留白(即使是彩色背景中的空间)非常重要。
* **风格一致性:** 所有几何形状、图案、字体、色彩需在风格上保持高度统一于极简几何与孟菲斯风格。
* **可读性:** 即使在活跃的背景或色彩中,文字也必须清晰易读。确保文字与背景有足够的对比度。

整体设计应散发出一种独一无二的、充满设计巧思的、活力四射的现代视觉冲击力。

### 卡片序列与内容指导:

#### 第一张:引人入胜的开篇卡 (Engaging Opening Card)
* **目的:** 用大胆的几何构图和醒目的口号迅速抓住用户,奠定风格基调。
* **内容:**
    * **醒目标题/引言:** 必须以**“一级核心强调 (孟菲斯焦点)”**样式呈现,与大型几何色块或图案巧妙融合。
* **排版:** 自由大胆,图文互动性强,利用不对称和动态平衡,运用强烈的对比和留白突出重点。

#### 第二张至倒数第二张:核心内容卡 (Core Content Cards - 数量可变)
* **目的:** 用充满趣味和现代感的方式呈现核心信息。
* **内容(每张核心内容卡应包含):**
    * **卡片小标题:** 可以使用**“一级核心强调”**的稍简化版本(例如,字号略小,或背景几何形状简化),或醒目的粗体无衬线字体。
    * **核心要点/段落:** 将原文的核心论点、关键信息、步骤或方面,拆分成若干部分。段落中的关键信息点使用**“二级重点强调 (几何高亮/标记)”**。列表可以用彩色几何图形(如实心方块、圆形、三角形)标记。
    * **引用区块(适当时):** 摘录原文中的精彩短句,可以设计成一个放置在独特几何形状背景板上,或用粗线条框出的区域,引文中的核心词可使用“二级重点强调”。
* **数量:** 根据内容长度和逻辑划分,通常生成2-5张核心内容卡。确保每张卡片信息不过载,重点突出。

#### 最后一张:总结与延展卡 (Summary & Extension Card)
* **目的:** 以现代、积极的方式总结,并留下鲜明印象或启发。
* **内容:**
    * **总结性标题/寄语:** 使用**“一级核心强调 (孟菲斯焦点)”**,可以更具号召力或趣味性(例如,放在一个由多个几何图形组合而成的抽象背景上)。
    * **核心回顾:** 关键总结点使用**“二级重点强调 (几何高亮/标记)”**,或设计成一个带有几何形状复选框(如彩色小方块或圆圈)的清单。
    * **底部注释:** 统一写明文章发布的日期,或者今天的日期,和多个与全文内容相关的关键词。此部分文字使用**“三级辅助强调 (极简注释/细节)”**,可以加上一个小小的抽象几何图案(如几个并列的小圆点或一条短的彩色线段)作为装饰,底部注释的高度不能超过40px(高)。

#### 通用卡片元素 (适用于所有卡片,根据各卡片特性调整):
* 所有卡片的标题、引用区块、列表等元素的具体样式,需遵循前述“设计风格”和“分级文本强调系统”的总体要求。
* 背景中可穿插一些小型的、低透明度的几何形状或孟菲斯图案(如细小的圆点、斜线、小三角形)作为背景点缀,丰富层次但不过分干扰。
* 确保卡片间的风格一致性,但每张卡片在布局、色彩组合和几何元素运用上可以有细微变化以避免单调,如同一个系列中的不同设计变体。

### 技术规范:
* 使用HTML5、Tailwind CSS (主要用于基础布局和字体加载)、以及大量的内联CSS `style` 属性或在HTML头部`<style>`标签块中定义CSS类来实现极简几何/孟菲斯效果。
* **背景图案/纹理:** 优先使用CSS生成(如渐变、`background-size`配合小图片平铺),或简单的SVG图案。
* **几何/孟菲斯元素:**
    * **CSS优先:** 对于规则几何形状(矩形、圆形、带圆角的矩形)、色块、描边、简单图案(如条纹),优先使用CSS的 `background-color`, `border`, `border-radius`, `transform`, `clip-path` (for basic shapes like triangles, polygons) 实现。
    * **SVG辅助:** 对于不规则曲线形状(blobs)、复杂的孟菲斯图案组合或需要精确控制的重复小图标,推荐使用SVG。
* **叠加与透明:** 熟练运用 `z-index`, `opacity`, 以及 `rgba()` 或 `hsla()` 颜色定义来实现元素的叠加和半透明效果。
* **字体加载:** 确保在HTML的`<head>`部分通过Google Fonts等方式正确引入所需的无衬线字体。
    例如:
    ```html
    <link href="[https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700;800;900&family=Bebas+Neue&family=Anton&family=Archivo+Black&family=Open+Sans:wght@400;700&family=Lato:wght@400;700&family=Roboto:wght@400;700&display=swap](https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700;800;900&family=Bebas+Neue&family=Anton&family=Archivo+Black&family=Open+Sans:wght@400;700&family=Lato:wght@400;700&family=Roboto:wght@400;700&display=swap)" rel="stylesheet">
    ```
* **Font Awesome:** `https://lf6-cdn-tos.bytecdntp.com/cdn/expire-100-M/font-awesome/6.0.0/css/all.min.css` (可用于一些通用的简单图标,但几何图形和孟菲斯元素优先通过CSS/SVG自建)。
* **Tailwind CSS:** `https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/tailwindcss/2.2.19/tailwind.min.css`

### 输出要求:
* 创建一个HTML文件,在文件中横向排列所有生成的卡片。卡片总数将根据内容和上述卡片序列指导自动确定(至少3张:1张开篇,1+张核心,1张总结)。
* 每个卡片的尺寸固定为 450px(宽)× 600px(高)。
* 内容应经过精心提炼和编排,以适应卡片尺寸,既要信息饱满,又要避免溢出,保持阅读舒适度,尤其注意不要超出高度。
* 对主题内容进行抽象提炼,多使用列点、短句或核心引用的方式。
* **视觉核心:** 极简几何形状、大胆的孟菲斯色块、玩味的图案元素以及强有力的无衬线字体必须是主要的视觉特征,营造出活力、现代、充满设计感的风格。 AI应努力使这些元素与内容协调,并保持整体的视觉平衡和冲击力。
* **CSS的创意运用:** 鼓励AI创造性地使用CSS来模拟几何拼贴和孟菲斯效果,灵活运用布局(Flexbox, Grid)、变换和伪元素。
* 永远用中文输出,少量装饰性英文单词(如标签上的 "HEY!", "WOW!", "IDEA")可以接受,并应采用所选风格的粗体无衬线字体。
* 确保卡片间的逻辑连贯性,整体阅读体验流畅,如同欣赏一组充满惊喜的现代设计作品。
* 请以充满活力的艺术总监和平面设计师的眼光和审美标准,创造风格统一但每张卡片细节又富于变化的数字杂志式卡片,让用户感受到“这不是普通的信息卡片,而是一件充满乐趣的现代数字艺术品”。

### HTML转图片与下载功能:
* 在完成卡片的内容部分的html代码输出后,继续增加html转图片功能,使用`dom-to-image-more`,设置`quality: 1.0` 以获取高质量图片,实现图片下载功能,图片的下载按钮显示在对应卡片的下方,下载按钮不要位于卡片的`div`标签内部。
* 最后要加一个一键下载所有图片的按钮,并实现对应的功能。
* 点击所有的下载图片按钮,要等个1秒让图片加载完毕后再开始下载。

### 布局与重要提示:
* 不要使用相对布局进行卡片主要元素定位,推荐使用**flex或grid**进行卡片内部布局。
* 卡片间的横向排列可以使用**flex**。
* 同时下载图片必须使用`dom-to-image-more`功能。

### 待处理内容:
> **[请在此处粘贴你需要处理的长文内容]**

参考输出

暂无标准答案,建议按评分维度人工评审。

评分维度

重点评估可执行性、事实准确性、边界控制和结构完整度。

相关提示词

写作生成进阶

长图转小红书多图-温暖文艺

将长文内容转化为具有温暖文艺风格的小红书多图卡片,采用精致的排版和视觉设计,营造艺术画报般的阅读体验。

小红书多图生成温暖文艺视觉设计
内容创作者将长篇文章转化为吸引人的小红书多图帖子
写作生成进阶

长文转小红书多图-经典淡黄色

将长文本转换为符合高端时尚杂志风格的系列知识卡片,采用米色复古背景与勃艮第红强调色系统,通过分级文本突出、对称排版和装饰元素营造奢华视觉体验,支持单张及批量HTML转图片下载功能。

长文转化小红书风格杂志美学复古设计
公众号文章可视化传播
写作生成高难

公众号横版封面图生成器

根据标题内容智能匹配设计风格并生成符合3.35:1比例的HTML+CSS封面图代码,支持一键下载

封面设计HTML生成CSS样式公众号排版
为公众号文章快速生成专业封面图
写作生成高难

公众号文章转小红书清新数字手帐风格图文生成

将公众号文章转化为具有清新数字手帐风格的系列小红书图文卡片,包含封面卡、核心内容卡及总结卡,支持HTML生成、图片导出与一键下载。

小红书图文生成数字手帐内容转化
内容创作者将长文公众号内容转化为适合小红书平台传播的精美图文