有一程序员朋友说把画图好太难,那是他不会GTP2 ✍ 小小东🕐 2026-05-21📦 7.8 KB 🟢 已读 𝕏 文章列表 文章介绍了如何利用 GPT-image-2 生成高可读性的手绘风格架构图,解决了程序员“把图画好看难”的问题。作者将信息设计师的经验提炼为 prompt,涵盖排版、色彩、图标层级等七个维度,并提供了完整的 workflow 和 prompt 范本。 AI绘图架构图Prompt工程可视化手绘风格ChatGPT工作流设计 # 有一程序员朋友说把画图好太难,那是他不会GTP2 **作者**: 小小东 **日期**: 2026-05-20T13:29:05.000Z **来源**: [https://x.com/xiaoxiaodong01/status/2057091239825359108](https://x.com/xiaoxiaodong01/status/2057091239825359108) ---  我有个程序员朋友。最近看完我在 X 上发的 gpt-image-2 系列,跟我说大为震撼。跟我诉苦:"平时把图画好看太难了——你帮我出一期架构图吧。" 我说,那是你不懂GPT2的好。于是,这我把 prompt、workflow、为什么这样设计、踩过的坑,一次性给他。他拿走也没有跟我说一句谢谢。 ## 先回答那句"把图画好看难" 画图真的难吗?不是画图难——是把图画好看难。 架构图其实分两种。 一种是给机器和同行 review 看的——mermaid、PlantUML、draw.io。这一档程序员从来不缺工具。拓扑要对、箭头方向要准、组件命名要标准。这种图我们画了十年,谁都会画。 另一种是给非工程师看的——给 PM、给老板、给跨团队的同事、给客户。这种图的目的不是"拓扑校验",是让一个没有 context 的人在 30 秒内抓住核心。这一档程序员的工具箱里一直没有合适的东西。 第一种我们都会画。第二种过去得靠信息设计师 / 排版师——程序员看了想用但学不来。直到 gpt-image-2 + 这段 prompt。于是,我才用了一种手绘的方式来做: ## 手绘风架构图,到底"风"在哪 不是把图画成卡通。也不是加几个 emoji。 手绘风的核心是七个维度同时锁住——气质、信息密度、阅读路径、图标层级、色彩语义、版式、手感。每一个维度都有明确边界。 举三个最容易丢的: "高密度但不拥挤"。 程序员做 PPT 经常陷入两个极端——要么一张图塞满 10 个组件没人看得清,要么一张图就 5 个框看起来像 demo。手绘风强制模块化分区,圆角框分组,每个模块 3-4 条 bullet,模块之间留呼吸感。看起来"满",但读起来不挤。 "先抓住核心,再逐格阅读,最后记住一句话"。 这是新闻和咨询报告的金字塔结构——不是装饰,是注意力工程。顶部一句强标题 + 右上角"核心目标"便签 = 读者 3 秒抓住 takeaway。中部 5 个编号模块 = 给愿意细读的人。底部一句话收束 = 让人记得住。 "图标只做路标,不抢走文字层级"。 程序员一画图就爱加 emoji。手帐风明确禁。图标只用作工具符号(aws icon、spring 图标)、流程箭头、强调号。文字才是主体——图标抢戏,整张图就塌成 PPT 模板。 说穿了,手帐风看着像手画的,本质是把一位信息设计师 + 排版师的工作经验,压成了一段 prompt。AI 不是替你画画——是替你把信息设计师的判断装进了 prompt 里。 ## 怎么做:2 步 + prompt 全文 整个 workflow 就 2 步。 第 1 步:复制下面这段 prompt,贴给 ChatGPT(ChatGPT 现在的图像生成用的就是 gpt-image-2,直接在对话框里贴)。 ``` 请把我提供的内容转化成一张高可读性的手绘知识图解。风格像认真整理过的创意手帐 + 白板推演 + 咨询报告信息图,而不是冰冷模板。 【输出目标】 生成一张适合传播、汇报和复用的知识图解。它必须先让人抓住核心判断,再沿着模块逐步阅读,最后记住一句结论。 【语言要求】 图上所有可见文字根据用户的输入来确定语言,中文,英文或其他 不要混用语言,除非是技术名词、产品名、协议名、代码路径或数字指标。 【画布要求】 比例:{16:9 / 5:4 / 4:3 / 21:9} 质量:4K high resolution 背景:浅米白 / 浅暖灰,保留轻微纸张纹理和呼吸感。 整体清晰、留白稳定,不要把文字挤到看不清。 【信息设计规则】 不要逐字搬运原文。先压缩信息,再画图。 请把内容整理成: 1. 顶部:强标题 + 一句话核心判断 2. 中部:3–6 个主模块,按流程、对比、阶段或因果关系排列 3. 模块内:每个模块最多 3–5 条短 bullet 4. 底部:一条 Flow Summary / Decision Summary / Bottom Line 5. 如果内容很多,只保留最关键的 8–10 个判断,避免微型文字 【可读性规则】 标题必须最大、清楚、有重量。 模块标题要有秩序,正文必须短句化。 每个模块不要超过 6 行正文。 每条 bullet 尽量简短。 不要使用密密麻麻的小字表格。 不要为了完整而牺牲可读性。 【视觉风格】 黑色或深墨色手写线条建立阅读骨架。 使用圆角分区、细线框、轻阴影、编号、箭头、标签和小图标。 线条允许轻微手绘抖动,但整体对齐、边距、分组要稳定。 图标只做路标和强调,不要抢走文字层级。 【配色规则】 使用克制的标记笔色彩: 浅米白背景 + 黑色主线条; 低饱和青绿、鼠尾草绿、淡紫、柔橙、浅蓝作为分区和路径颜色。 避免霓虹色、强渐变、过度商业光效和整页单色化。 彩色区域只占少量到中等面积。 【准确性规则】 严格保持输入内容中的技术链路、组件名称、箭头方向、协议、端口、数据流和判断。 不要自行新增未提供的组件。 不要把动作写错,例如“读取日志”不能画成“生成日志”。 如果空间不足,优先保留主链路、关键差异和最终判断,删掉次要解释。 【内容】 {请输入你的内容或者参考图片} ``` 第 2 步:输入你的要求——文字 or 图片,然后等出图。 - 已有架构图 → 直接上传图:mermaid 截图、draw.io 导出、白板照片,丢上去就行。AI 不重新设计架构,只换皮——信息保留,视觉变温暖。 - 从零开始 → 写文字:列出读者画像、主结论、5-8 个模块的标题和 bullet。文字越具体,图越准。 等图。第一次出图大概率不完美——同一个 prompt 多跑 2-3 次,挑最好的那张。 几条踩过的坑: - 模块超过 8 个就要拆图——一张图塞 10 个模块,信息密度会塌,AI 自己也会乱 - 英文术语别译——OpenSearch、Filebeat、JVM 保留英文。译成中文反而让读者要切语义 - 色彩交给 prompt 别手动指定——prompt 里"色彩语义"那段已经处理了,你再指定容易撞色 - 重要判断放顶部便签 + 底部一句话——这是手帐风注意力路径的标准位 ## 结尾 看几个实际的例子:我那位程序员朋友发给我的(其实我找他要的):        如果你也觉得把图画好看难——prompt 在上面,拿走不用谢。 ## 相关链接 - [小小东](https://x.com/xiaoxiaodong01) - [@xiaoxiaodong01](https://x.com/xiaoxiaodong01) - [5.1K](https://x.com/xiaoxiaodong01/status/2057091239825359108/analytics) - [draw.io](https://draw.io/) - [draw.io](https://draw.io/) - [Upgrade to Premium](https://x.com/i/premium_sign_up) - [9:29 PM · May 20, 2026](https://x.com/xiaoxiaodong01/status/2057091239825359108) - [5,126 Views](https://x.com/xiaoxiaodong01/status/2057091239825359108/analytics) - [View quotes](https://x.com/xiaoxiaodong01/status/2057091239825359108/quotes) --- *导出时间: 2026/5/21 09:47:43*
G GPT2 高拓展性进化史信息图提示词 本文分享了一套专为 GPT-2 设计的提示词,旨在生成“高拓展性、强组织性、高审美”的进化史信息图。作者通过咖啡豆、苹果、内裤等多个主题的测试,验证了该提示词在理解主题、自动梳理时间脉络、匹配视觉风格(如深/浅色模式、配色系统、排版节奏)方面的强大能力。文章详细列出了从结构定义到视觉融合的 19 条设计原则,强调避免模板化,力求为每个主题定制专属的博物馆级视觉呈现。 技术 › 工具与效率 ✍ 小小东🕐 2026-04-27 GPT2提示词AI绘图信息图设计可视化工作流
我 我是如何用 Codex 做自己的个人IP生图工作流的 作者分享了如何利用 Codex 构建个人 IP 生图工作流的经验。通过借鉴优秀项目,将思路从拼图改为拼提示词,开发了封面图和段落图两个 Skill。文章详细介绍了风格确定、人物特征锚定、内容总结及安全区适配等优化过程,强调了 AI、代码与人在工作流中的职责分工。 技术 › Codex ✍ naiyue777🕐 2026-07-26 CodexAI绘图个人IP工作流Skill自动化设计开源项目
蓝 蓝黄配色封面生成 Prompt:宜家德邦风格的设计指南 本文分析了宜家、德邦等品牌常用的“深蓝+明黄”配色逻辑,将其转化为一套完整的 AI 绘图提示词。该提示词定义了扁平矢量大字封面的核心视觉定位、版式系统及色彩规范,旨在生成既醒目又具秩序感的现代设计作品。 技术 › 工具与效率 ✍ Adrian Punk🕐 2026-07-13 提示词Prompt设计AI绘图配色封面生成设计规范蓝黄配色扁平化工作流
M Minecraft 方块世界海报提示词指南 文章介绍了 AI 海报设计的第 5 种风格:Minecraft 方块世界。核心思想是将主题词进行“方块化重构”,使其成为画面中的建筑、地形或机关,而非简单的文字贴图。文中提供了详细的 Prompt,指导如何通过隐喻、构图和色彩设计,生成具有游戏感和高传播力的封面图。 技术 › LLM ✍ Adrian Punk🕐 2026-05-27 提示词AI绘图设计ChatGPTMidjourney视觉设计海报风格模板AIGC
1 15张可直接复用的AI画图工作流架构图 本文介绍了一套包含15个高清架构、流程和数据图的AI画图工作流,并非Demo,而是可直接用于实际业务场景的技能集合。内容涵盖企业架构、系统设计、BPMN流程、云架构、数据链路、UML、网络拓扑、思维导图及信息图表等。这些工具适合开发者绘制系统设计,产品经理梳理流程与规划,以及技术写作者制作文档和汇报材料,旨在提升方案文档的结构化和专业性。 技术 › 工具与效率 ✍ libapi🕐 2026-05-25 AI画图架构图工作流BPMNUML系统设计技术文档HermesSkill可视化
十 十几张配图带来几十万流量,花了不到五毛钱,朋友以为我请了专业设计 作者分享了使用 GPT-Image-2 生成低成本高质量信息图的经验。通过设定特定的配色(如#4B91F3)和风格约束(类似 SaaS 数据报告),作者成功生成了流程图、对比图和数据图,总成本不到 0.5 元人民币。文章详细介绍了 Prompt 编写技巧、迭代过程以及如何避免 AI 绘图的常见陷阱。 技术 › 工具与效率 ✍ 百年 AI×出海🕐 2026-04-29 AI绘图GPT-Image-2Prompt工程信息可视化设计效率工具Claude Code配图技巧
零 零基础小白用上GPT-Image-2全流程实操讲解 本文详细介绍了零基础用户如何从零开始免费使用 GPT-Image-2 生成高质量图片。文章涵盖了准备工作(网络环境、海外邮箱注册)、Outlook 邮箱及 ChatGPT 账号的注册流程,并展示了该模型在绘制小红书四宫格、汉服拆解图、动漫海报及工业品图等方面的强大能力,适合设计师、电商商家及知识博主参考。 技术 › 工具与效率 ✍ 唐清乐TangQingyue🕐 2026-04-24 GPT-Image-2AI绘图ChatGPT教程实操OpenAI设计电商工具效率
2 2026最强 AI 组合之一:Codex + Figma,不会代码也能做产品! 本文介绍了 Codex 与 Figma 结合的 AI 产品开发工作流。通过 Figma MCP 连接两者,实现了从需求梳理、设计生成到代码开发及浏览器验证的闭环。文章详细讲解了如何利用 Codex 进行需求分析和代码编写,以及如何在 Figma 中进行双向协作与设计评审,大幅降低了产品原型开发的门槛。 技术 › Codex ✍ 云析🕐 2026-07-28 AI产品开发FigmaCodexMCP前端开发设计工作流
用 用Codex打造个人IP形象全流程教程 文章详细记录了作者利用 Codex 和 grill-me 从零打造个人 IP 形象的全过程。核心在于通过设计访谈将模糊需求转化为契约,由 Codex 自动执行生图、迭代、归档,并最终沉淀为可复用的 repo-only 配图 skill,构建了一套可持续的内容生产系统。 技术 › Codex ✍ Chasen🕐 2026-07-21 个人IP工作流AI绘画自动化Skill设计
全 全平台AI绘图提示词指南 本文针对X、小红书、公众号、电商、教程及PPT等10大常见场景,解析不同平台的视觉逻辑,并提供可复用的中文提示词模板与微调建议,助你生成高质量图片。 技术 › 工具与效率 ✍ 多肉🕐 2026-07-21 AI绘图提示词小红书电商公众号PPT设计社交媒体营销运营
t tldraw 不仅仅是白板:你可以构建的 14 种应用 文章介绍了 tldraw 作为一个可编程的 React 无限画布 SDK 的强大功能。除了基础的白板功能,它支持将 React 组件转化为画布形状、构建可视化的工作流自动化、集成 AI 视觉交互、实现多人实时协作以及作为持久化应用数据存储。tldraw 适用于构建各种空间软件,从架构图到 AI Agent 管道。 技术 › 工具与效率 ✍ mr-r0b0t🕐 2026-07-20 tldrawReactSDK无限画布可视化工作流实时协作AI开源前端
多 多平台AI绘图提示词实战指南 本文详细解析了X/Twitter、小红书、公众号、电商、教程、PPT等10个常见场景的作图策略。文章指出不同平台的用户习惯和算法偏好差异巨大,并提供了针对每个场景的中文提示词模板及微调建议,帮助用户生成高转化、高质感的图片。 技术 › 工具与效率 ✍ 多肉🕐 2026-07-16 AI绘图提示词社交媒体电商设计小红书公众号可视化创作技巧