Claude 绘制精美小红书图文

显示全部楼层

以 DeepSeek 开源周为例子

DeepSeek 开源周 Day 1

DeepSeek 开源周 Day 2

DeepSeek 开源周 Day 3

DeepSeek 开源周 Day 4

DeepSeek 开源周 Day 5

DeepSeek 开源周 Day 6

如何使用

打开 Claude （Claude.ai）
使用下面的提示词
在提示词模板后面添加要可视化的资料，中英文皆可

提示词模板

# 任务：
请你制作适合小红书平台发布的精美卡片（SVG），竖屏，适合手机阅读。

## 要求：
- 符合小红书平台上流行的"高颜值、有设计感、信息清晰"的风格，柔和色调，既时尚又保持技术内容的专业性。
- 整体结构舒展，同时保持视觉美感和信息清晰度。
- 视觉舒适，设计精美，整体设计让小仙女们看了一眼沦陷！
- 包含面向技术小白的通俗解读
- 突出重要和关键信息
- 不要包含“小白”、“炸裂”、“通俗”和平台极限词

## 精美卡片（SVG）示例
<svg xmlns="http://www.w3.org/2000/svg"viewBox="0 0 750 1334"width="750"height="1334">
 <!-- 定义渐变和阴影 -->
 <defs>
  <linearGradient id="bgGradient"x1="0%"y1="0%"x2="0%"y2="100%">
   <stop offset="0%"style="stop-color:#FFD4E5;stop-opacity:1"/>
   <stop offset="100%"style="stop-color:#AAE0FF;stop-opacity:1"/>
  </linearGradient>
  <filter id="softShadow"x="-10%"y="-10%"width="120%"height="120%">
   <feGaussianBlurin="SourceAlpha"stdDeviation="5"/>
   <feOffset dx="0"dy="3"result="offsetblur"/>
   <feComponentTransfer>
    <feFuncAtype="linear"slope="0.2"/>
   </feComponentTransfer>
   <feMerge>
    <feMergeNode />
    <feMergeNodein="SourceGraphic"/>
   </feMerge>
  </filter>
 </defs>

 <!-- 主背景 -->
 <rect width="750"height="1334"fill="url(#bgGradient)"/>

 <!-- 装饰元素：几何形状 -->
 <circle cx="50"cy="150"r="80"fill="#FFB6D9"opacity="0.5"/>
 <circle cx="700"cy="200"r="120"fill="#B6E5FF"opacity="0.4"/>
 <circle cx="120"cy="1200"r="100"fill="#FFC8A2"opacity="0.3"/>
 <circle cx="650"cy="1100"r="90"fill="#ADFFD6"opacity="0.3"/>

 <!-- 内容区域 -->
 <rect x="75"y="280"width="600"height="880"rx="30"ry="30"fill="white"filter="url(#softShadow)"/>

 <!-- DeepSeek标志和标题区 -->
 <rect x="75"y="140"width="600"height="180"rx="30"ry="30"fill="#615DFA"filter="url(#softShadow)"/>

 <!-- 标题文本 - 得意黑 -->
 <text x="375"y="220"font-family="'LXGW WenKai', sans-serif"font-size="44"font-weight="bold"fill="white"text-anchor="middle">DeepSeek：3FS 文件系统</text>
 <text x="375"y="280"font-family="'LXGW WenKai', sans-serif"font-size="28"fill="white"text-anchor="middle">DeepSeek开源周第五天重磅发布</text>

 <!-- 技术解读区域 - 思源黑体 -->
 <g font-family="'Noto Sans SC', sans-serif"fill="#333333">
  <text x="105"y="360"font-size="26"font-weight="bold">这是什么？一句话解释?</text>
  <rect x="105"y="380"width="540"height="70"rx="15"ry="15"fill="#FFF4F9"/>
  <text x="125"y="425"font-size="22"fill="#333">3FS是一个能充分利用SSD存储和网络带宽的文件系统</text>
 
  <!-- 核心数据指标 -->
  <text x="105"y="490"font-size="26"font-weight="bold">? 性能有多强？</text>
 
  <!-- 数据点1 -->
  <rect x="105"y="510"width="255"height="120"rx="20"ry="20"fill="#E2F6FF"/>
  <text x="232.5"y="550"font-size="22"font-weight="bold"fill="#333"text-anchor="middle">读取速度</text>
  <text x="232.5"y="590"font-size="30"font-weight="bold"fill="#615DFA"text-anchor="middle">6.6 TiB/秒</text>
 
  <!-- 数据点2 -->
  <rect x="390"y="510"width="255"height="120"rx="20"ry="20"fill="#FFEFEF"/>
  <text x="517.5"y="550"font-size="22"font-weight="bold"fill="#333"text-anchor="middle">排序性能</text>
  <text x="517.5"y="590"font-size="30"font-weight="bold"fill="#FF6B95"text-anchor="middle">3.66 TiB/分钟</text>
 
  <!-- 数据点3 -->
  <rect x="105"y="650"width="255"height="120"rx="20"ry="20"fill="#F2FFEF"/>
  <text x="232.5"y="690"font-size="22"font-weight="bold"fill="#333"text-anchor="middle">KVCache查询</text>
  <text x="232.5"y="730"font-size="30"font-weight="bold"fill="#52BF90"text-anchor="middle">40+ GiB/秒</text>
 
  <!-- 数据点4 -->
  <rect x="390"y="650"width="255"height="120"rx="20"ry="20"fill="#FFF8E1"/>
  <text x="517.5"y="690"font-size="22"font-weight="bold"fill="#333"text-anchor="middle">集群规模</text>
  <text x="517.5"y="730"font-size="30"font-weight="bold"fill="#FFA726"text-anchor="middle">180节点</text>

  <!-- 为什么重要 -->
  <text x="105"y="810"font-size="26"font-weight="bold">? 为什么这很重要？</text>
  <rect x="105"y="830"width="540"height="170"rx="15"ry="15"fill="#F5F5FF"/>
 
  <text x="125"y="865"font-size="22"fill="#333">• 让AI模型训练和推理数据管理更高效</text>
  <text x="125"y="905"font-size="22"fill="#333">• 支持数据预处理、加载和检查点存储</text>
  <text x="125"y="945"font-size="22"fill="#333">• 向量搜索和推理KVCache查询更快</text>
  <text x="125"y="985"font-size="22"fill="#333">• 分离式架构保证数据一致性</text>

  <!-- 开源链接 -->
  <text x="105"y="1040"font-size="26"font-weight="bold">? 开源地址</text>
  <rect x="105"y="1060"width="540"height="70"rx="15"ry="15"fill="#EDFFF5"/>
  <text x="125"y="1100"font-size="20"fill="#333">github.com/deepseek-ai/3FS</text>
 </g>
</svg>


## 参考资料：
---
? Introducing NSA: A Hardware-Aligned and Natively Trainable Sparse Attention mechanismforultra-fast long-context training & inference!

Core components of NSA:
• Dynamic hierarchical sparse strategy
• Coarse-grained token compression
• Fine-grained token selection

? With optimized designformodern hardware, NSA speeds up inferencewhilereducing pre-training costs—without compromising performance. It matches or outperforms Full Attention models on general benchmarks, long-context tasks, and instruction-based reasoning.

? For more details, check out our paper here: https://arxiv.org/abs/2502.11089
---

可用于小红书图文、各种信息展示卡片~

示例

以绘制 DeepSeek 发布的 NSA 为例

效果图

完整提示词

# 任务：
请你制作适合小红书平台发布的精美卡片（SVG），竖屏，适合手机阅读。

## 要求：
- 符合小红书平台上流行的"高颜值、有设计感、信息清晰"的风格，柔和色调，既时尚又保持技术内容的专业性。
- 整体结构舒展，同时保持视觉美感和信息清晰度。
- 视觉舒适，设计精美，整体设计让小仙女们看了一眼沦陷！
- 包含面向技术小白的通俗解读
- 突出重要和关键信息
- 不要包含“小白”、“炸裂”、“通俗”和平台极限词

## 精美卡片（SVG）示例
<svg xmlns="http://www.w3.org/2000/svg"viewBox="0 0 750 1334"width="750"height="1334">
 <!-- 定义渐变和阴影 -->
 <defs>
  <linearGradient id="bgGradient"x1="0%"y1="0%"x2="0%"y2="100%">
   <stop offset="0%"style="stop-color:#FFD4E5;stop-opacity:1"/>
   <stop offset="100%"style="stop-color:#AAE0FF;stop-opacity:1"/>
  </linearGradient>
  <filter id="softShadow"x="-10%"y="-10%"width="120%"height="120%">
   <feGaussianBlurin="SourceAlpha"stdDeviation="5"/>
   <feOffset dx="0"dy="3"result="offsetblur"/>
   <feComponentTransfer>
    <feFuncAtype="linear"slope="0.2"/>
   </feComponentTransfer>
   <feMerge>
    <feMergeNode />
    <feMergeNodein="SourceGraphic"/>
   </feMerge>
  </filter>
 </defs>

 <!-- 主背景 -->
 <rect width="750"height="1334"fill="url(#bgGradient)"/>

 <!-- 装饰元素：几何形状 -->
 <circle cx="50"cy="150"r="80"fill="#FFB6D9"opacity="0.5"/>
 <circle cx="700"cy="200"r="120"fill="#B6E5FF"opacity="0.4"/>
 <circle cx="120"cy="1200"r="100"fill="#FFC8A2"opacity="0.3"/>
 <circle cx="650"cy="1100"r="90"fill="#ADFFD6"opacity="0.3"/>

 <!-- 内容区域 -->
 <rect x="75"y="280"width="600"height="880"rx="30"ry="30"fill="white"filter="url(#softShadow)"/>

 <!-- DeepSeek标志和标题区 -->
 <rect x="75"y="140"width="600"height="180"rx="30"ry="30"fill="#615DFA"filter="url(#softShadow)"/>

 <!-- 标题文本 - 得意黑 -->
 <text x="375"y="220"font-family="'LXGW WenKai', sans-serif"font-size="44"font-weight="bold"fill="white"text-anchor="middle">DeepSeek：3FS 文件系统</text>
 <text x="375"y="280"font-family="'LXGW WenKai', sans-serif"font-size="28"fill="white"text-anchor="middle">DeepSeek开源周第五天重磅发布</text>

 <!-- 技术解读区域 - 思源黑体 -->
 <g font-family="'Noto Sans SC', sans-serif"fill="#333333">
  <text x="105"y="360"font-size="26"font-weight="bold">这是什么？一句话解释?</text>
  <rect x="105"y="380"width="540"height="70"rx="15"ry="15"fill="#FFF4F9"/>
  <text x="125"y="425"font-size="22"fill="#333">3FS是一个能充分利用SSD存储和网络带宽的文件系统</text>
 
  <!-- 核心数据指标 -->
  <text x="105"y="490"font-size="26"font-weight="bold">? 性能有多强？</text>
 
  <!-- 数据点1 -->
  <rect x="105"y="510"width="255"height="120"rx="20"ry="20"fill="#E2F6FF"/>
  <text x="232.5"y="550"font-size="22"font-weight="bold"fill="#333"text-anchor="middle">读取速度</text>
  <text x="232.5"y="590"font-size="30"font-weight="bold"fill="#615DFA"text-anchor="middle">6.6 TiB/秒</text>
 
  <!-- 数据点2 -->
  <rect x="390"y="510"width="255"height="120"rx="20"ry="20"fill="#FFEFEF"/>
  <text x="517.5"y="550"font-size="22"font-weight="bold"fill="#333"text-anchor="middle">排序性能</text>
  <text x="517.5"y="590"font-size="30"font-weight="bold"fill="#FF6B95"text-anchor="middle">3.66 TiB/分钟</text>
 
  <!-- 数据点3 -->
  <rect x="105"y="650"width="255"height="120"rx="20"ry="20"fill="#F2FFEF"/>
  <text x="232.5"y="690"font-size="22"font-weight="bold"fill="#333"text-anchor="middle">KVCache查询</text>
  <text x="232.5"y="730"font-size="30"font-weight="bold"fill="#52BF90"text-anchor="middle">40+ GiB/秒</text>
 
  <!-- 数据点4 -->
  <rect x="390"y="650"width="255"height="120"rx="20"ry="20"fill="#FFF8E1"/>
  <text x="517.5"y="690"font-size="22"font-weight="bold"fill="#333"text-anchor="middle">集群规模</text>
  <text x="517.5"y="730"font-size="30"font-weight="bold"fill="#FFA726"text-anchor="middle">180节点</text>

  <!-- 为什么重要 -->
  <text x="105"y="810"font-size="26"font-weight="bold">? 为什么这很重要？</text>
  <rect x="105"y="830"width="540"height="170"rx="15"ry="15"fill="#F5F5FF"/>
 
  <text x="125"y="865"font-size="22"fill="#333">• 让AI模型训练和推理数据管理更高效</text>
  <text x="125"y="905"font-size="22"fill="#333">• 支持数据预处理、加载和检查点存储</text>
  <text x="125"y="945"font-size="22"fill="#333">• 向量搜索和推理KVCache查询更快</text>
  <text x="125"y="985"font-size="22"fill="#333">• 分离式架构保证数据一致性</text>

  <!-- 开源链接 -->
  <text x="105"y="1040"font-size="26"font-weight="bold">? 开源地址</text>
  <rect x="105"y="1060"width="540"height="70"rx="15"ry="15"fill="#EDFFF5"/>
  <text x="125"y="1100"font-size="20"fill="#333">github.com/deepseek-ai/3FS</text>
 </g>
</svg>


## 参考资料：
---
? Introducing NSA: A Hardware-Aligned and Natively Trainable Sparse Attention mechanismforultra-fast long-context training & inference!

Core components of NSA:
• Dynamic hierarchical sparse strategy
• Coarse-grained token compression
• Fine-grained token selection

? With optimized designformodern hardware, NSA speeds up inferencewhilereducing pre-training costs—without compromising performance. It matches or outperforms Full Attention models on general benchmarks, long-context tasks, and instruction-based reasoning.

? For more details, check out our paper here: https://arxiv.org/abs/2502.11089
---

网页使用过程

使用小技巧

比较适合推特资料转图文分享
资料不要太多，信息太多会排不下
长资料分段提供，制作多图
如果有编辑 SVG 的需要，可以使用 VSCode文本编辑器编辑。

官网下载链接：https://code.visualstudio.com/Download

SVG文本编辑器网盘链接：https://pan.quark.cn/s/3d5b46777fc1

也可以通过PPT编辑元素，添加到 PPT，选择「转为图形」