江山时序：一张能拖动时间轴看的中国历史地图
文章介绍了一个开源项目「江山时序」，这是一张可交互的中国历史地图，覆盖从公元前403年三家分晋至今的18个历史时期。用户拖动时间轴即可看到版图变化，如战国七雄、三国、南北朝各政权同屏展示，并通过「透视镜」功能将现代省界叠加在古地图上对照。点开古城可查看历代地名、政区沿革及重大历史事件；搜索曹操、李白、苏轼等人物，地图会以弧线串起其一生足迹。还有古地名小游戏，通过史事线索猜城名。网页即开即用，适合读历史、背古诗时对照参考。
全部文档 / 标签: 可视化
36 篇
How I Turn Any Question Into a Machine You Can Run
作者介绍了一个免费 Claude Code skill——anatomy（作者 wheresryan22，MIT 许可），可以把任意问题变成一个可交互的『机器』教学页面：一个独立的 HTML 页面，包含真实的机器模型、按步骤点击的按钮、展示内部工作原理的剖视窗口、由真实模型驱动的实时数字仪表、每步提示和拟声词。文章以意式咖啡机如何产生 9 bar 压力为例，详细给出安装、构建提示词、可读性优化、儿童绘本风格样式和自动化质检等 6 个步骤及全部提示词，特别适合向孩子解释机械原理。
99%的人都不知道 Claude Code 能把技术原理画成一台会动的立体机器
文章介绍了开源 Skill《Anatomy》，它能配合 Claude Code 将技术原理可视化为可交互的立体机器模型。例如询问 A380 涡扇发动机如何产生推力，即可生成包含 220 个零件的发动机模型，拖动油门可实时看到推力变化。对于抽象概念（如缓存命中），也会被转化为真实机器形象（弹子锁）来演示。作者推荐常写技术博客或做分享的人使用。目前该 Skill 专为 Claude Code 开发，绘制普通图需 30~90 分钟，复杂图需 2~4 小时，项目已在 GitHub 开源。
We'll be spending a lot more time trying to understand the outputs of language models
Karpathy 分享了理解和消化 LLM 输出的技巧与思考。他建议从纯文本逐步升级到更好的输出形式：用 ASD-STE100 受控语言规范让 LLM 输出更简洁易读的文字；再进一步要求生成图表；更好是直接输出 HTML 交互网页；他最看好定制化讲解视频，如 3b1b 风格并结合 ElevenLabs 语音解说。他总结：随着 LLM 能力增强，人类工作将更多转向监督与理解层面，而 LLM 本身也能生成大量以前不值得做的定制、可抛弃的软件产物，帮助人们完成这一转变。
一段超级提示词让 Opus 5.5 直接画出整个项目的架构地图
作者分享了一段超级提示词，可以让 Claude Opus 5.5 直接生成整个项目的可视化架构地图。与 Devin 的 deepwiki 偏文档式 wiki 不同，这种方式更偏可视化。作者在自己的项目上实测，效果非常好，并将原作者针对特定项目的提示词改写成了通用版本发布在 gist 上。回复中提到 grok 也可以实现，只是 Opus 效果更好，但作者对界面美观度仍不太满意，认为需要再优化。
我把《红楼梦》里的大观园，做成了一个能走进去的 3D 世界
作者将《红楼梦》中的大观园重建为可在浏览器中漫游的三维世界，把文本与空间放进同一窗口。项目整理了二十处景致，涵盖五十九回原文、三十三首诗词和一百五十八位人物。读者可点选景致查看对应原文与诗笺，跟随第十七回贾政游园路线导览，或在漫步模式中自由行走，并可切换四季、昼夜与天气共三十六种环境状态。整个项目依据原著游园路线与北京大观园复建格局推定，最终打包为约 2.7 MB 的 HTML 文件，离线也能体验，成为一份可交互、可行走的阅读批注。
在 AI 时代我认为只有不敢学没有学不会
作者分享了在 AI 时代降低学习门槛的方法：一个 /eli5 Skill 和配套 Prompt 模板，可将任何学习资料生成图解 HTML 页面（Artifact）。Prompt 要求按概念依赖顺序梳理核心概念，用两格漫画卡片呈现每个概念的烦恼与解决办法，配固定角色、统一视觉风格（手绘风 SVG），并在末尾提供领域指标尺子和学习路线。作者用它来学习 AI Infra、投资等各领域内容，大幅降低理解成本。
内容创作者都应该把 archify Skill 用起来
Archify 是一个近期登上 GitHub Trending 榜首、Star 超 5.3 万的开源 Skill，主要功能是将文字内容输出为带动画、可交互、可导出的独立 HTML 文件。作者深度体验两天后总结出两大用法：一是把复杂文字变成有层级、有主线的视觉简图，作为文章配图，并可导入 Figma 或 Illustrator 替换字体配色以统一视觉风格；二是为文章、视频和社交媒体制作动态素材，支持导出 PNG、SVG、WebM，或通过录屏展示交互流程配合口播讲解复杂机制。作者认为这两点对内容创作者非常有用，并欢迎分享更多创意用法。
show-me Skill 实测：把复杂话题压缩成清晰视觉结构
作者实测了近期火爆的 show-me Skill 五天，其核心作用是将当前讨论话题压缩成最小、最清晰的视觉结构，帮助一眼看懂复杂关系。作者作为内容创作者，主要将其用于四个场景：一是找选题，通过画出事件背景、关键角色和影响路径理顺关系；二是生成适合截图传播的 HTML 信息图或迷你幻灯片素材；三是理解 Agent、RAG、MCP 等复杂 AI 概念的运行流程和数据流；四是学习复杂 AI 工具，画出完整工作流。此外还适合解释复杂机制、梳理系统结构、看懂流程变化和整理知识，开源库已在 GitHub 公开。
AI驱动的智能书籍知识图谱工具DeepRead
文章介绍了开源工具DeepRead，它能将书籍转化为智能知识图谱。通过AI自动提取书中的人物、事件、概念和地点，并挖掘深层关联，以可视化立体网络呈现，支持多维度探索和一键跳转。用户可在线体验《三体》《红楼梦》《西游记》等经典示例，也可自建部署，将任何书籍转换为交互式知识库，帮助读者突破线性阅读局限，构建立体知识体系，真正提高阅读效率。
（小白视觉篇）让AI做成高级页面，必须知道提示词
本文介绍了如何通过具体的提示词指导AI生成具有高级感的网页设计。内容涵盖了CSS质感（如毛玻璃、轻阴影、Bento网格）、排版规则、克制动效以及3D空间感的营造，旨在帮助零基础用户避免设计平庸。
提升学习和工作效率，这2个GitHub热门开源项目千万不要错过
文章介绍了两个提升效率的GitHub开源项目：OmniGet整合下载、播放、阅读和笔记功能，一站式管理内容资源；Microsoft的Flint Chart是专为AI智能体设计的图表描述语言，简化图表生成流程。
软件工厂为何失败：让代码评审回归
文章探讨了为什么仅靠模型无法长期维护代码库质量，提出了“模型作为评审者”的局限性。作者主张将代码评审权交还给人，并采用四阶段方法来提升开发效率：产品需求、系统架构、程序设计和垂直切片。通过早期规划和可视化工具，减少误解，提高代码质量。
tldraw 不仅仅是白板：你可以构建的 14 种应用
文章介绍了 tldraw 作为一个可编程的 React 无限画布 SDK 的强大功能。除了基础的白板功能，它支持将 React 组件转化为画布形状、构建可视化的工作流自动化、集成 AI 视觉交互、实现多人实时协作以及作为持久化应用数据存储。tldraw 适用于构建各种空间软件，从架构图到 AI Agent 管道。
多平台AI绘图提示词实战指南
本文详细解析了X/Twitter、小红书、公众号、电商、教程、PPT等10个常见场景的作图策略。文章指出不同平台的用户习惯和算法偏好差异巨大，并提供了针对每个场景的中文提示词模板及微调建议，帮助用户生成高转化、高质感的图片。
Codex 中文 X 创作者必装 Skills
文章精选了7个适用于 Codex 中文环境的实用 Skills，旨在帮助 X 创作者提升效率。涵盖了文本润色、去 AI 味、账号涨粉策略、情报调研、全流程写作以及配图和多平台分发工具，全方位覆盖了内容创作、包装与推广的需求。
手把手教你用AI处理表格，5种方法覆盖大部分场景
本文介绍了利用AI（以Codex为例）高效处理Excel表格的5种实用方法：制作专业模版与数据录入、批量清洗异常数据、编写公式或VBA宏进行复杂计算、挖掘数据价值生成可视化报表、以及制作交互式HTML看板。通过具体的提示词示例，展示了如何将繁琐的表格工作自动化。
GitHub 开源宝藏：线性代数可视化教材与 3D 交互教学工具
文章推荐了两个 GitHub 上的优质开源教育资源。一是《线性代数不难》，这是一套通过几何可视化、动画和配套 .ipynb 笔记本将抽象概念直观化的开源教材，适合机器学习入门。二是 AetherViz Master，一个利用 Three.js + SVG 自动生成 3D 交互式教学网页的工具，能帮助教师将复杂的物理、数学等知识点转化为可视化的互动演示。
15张可直接复用的AI画图工作流架构图
本文介绍了一套包含15个高清架构、流程和数据图的AI画图工作流，并非Demo，而是可直接用于实际业务场景的技能集合。内容涵盖企业架构、系统设计、BPMN流程、云架构、数据链路、UML、网络拓扑、思维导图及信息图表等。这些工具适合开发者绘制系统设计，产品经理梳理流程与规划，以及技术写作者制作文档和汇报材料，旨在提升方案文档的结构化和专业性。
有一程序员朋友说把画图好太难，那是他不会GTP2
文章介绍了如何利用 GPT-image-2 生成高可读性的手绘风格架构图，解决了程序员“把图画好看难”的问题。作者将信息设计师的经验提炼为 prompt，涵盖排版、色彩、图标层级等七个维度，并提供了完整的 workflow 和 prompt 范本。
GPT2 信息图生成提示词
文章介绍了一个用于生成高密度信息图的“仙品”提示词。该提示词旨在让 AI 生成的画面兼具建筑方案板的秩序与奢华产品手册的质感，强调冷静、精密与可信的视觉风格。提示词详细描述了版面布局、色彩逻辑、光影处理及排版要求，适用于将各类主题转化为具有博物馆级说明牌秩序的视觉作品，如 PPT 关键页、研究报告或海报。
告别黑框框：开源项目 html-anything 让 Agent 拥有世界级设计审美
文章介绍了开源项目 html-anything，旨在解决 AI Agent 输出内容格式单一、缺乏审美的问题。该工具支持 75+ 顶级设计模板，能兼容 18 种主流 Code Agent，将文本、数据等多种格式一键转化为精美 HTML 或图片，并支持全平台分发，极大提升了 AI 内容的呈现效率。
文本转视觉提示词：高桥流风格长文转海报
作者分享了一个专为视觉型学习者设计的 ChatGPT 提示词，旨在将冗长杂乱的文本转换为符合认知逻辑的高桥流风格海报。该提示词通过运用苹果设计师与海报大师的思维，对长文本进行智能提炼与压缩，重点突出核心信息，并优化移动端显示效果。这不仅有助于读者快速抓取重点，也能帮助创作者生成图文并茂的内容，提升信息传播效率。
AI 时代怎么学习？免费生成个性化教学 Demo
文章介绍了一种利用免费开源大模型（蚂蚁百灵 Ring-2.6-1T）生成交互式物理教学 Demo 的方法。通过编写特定的 Prompt，让 AI 一键生成包含弹簧振子、单摆、布朗运动等场景的单文件 HTML 代码，帮助学生直观理解晦涩的物理概念和函数图像。这种方法不仅免费、无需编程基础，还能为学生、家长和老师提供量身定制的可视化教具，比传统死记硬背更高效。
有趣的交互式科学应用创意 Part 2
文章展示了作者开发的系列交互式科学应用 Demo，包括黑洞时空扭曲可视化、达芬奇扑翼机机制实现以及科幻彗星探测器等。作者结合了 GPT Images、Nano Banana 2 进行设计，并使用 Gemini 3.1 Pro 编写代码。文章还分享了设计灵感和前端控件交互示例，旨在打造儿时向往的科学杂志风格的互动体验。
GPT2 提示词：将“如何做”教程转化为极简信息图
文章介绍了一个利用 GPT2 将“如何做（How-to）”类教程文本转化为可视化信息图设计稿的提示词。该提示词采用苹果设计体系与高桥流风格，强调极简高密度的排版和符合直觉的视觉路径。它能够智能优化内容，将复杂步骤转化为可直接用于制作海报或卡片的版面描述，适用于制作小红书图文或百科卡片。
GPT-2 案例：可视化提示词解剖模板
文章介绍了一个名为“Visual Prompt Anatomy Template”的模板，旨在通过可视化的方式拆解提示词的结构。文章详细列出了构建高质量提示词的各个功能模块（如角色、任务、上下文、输出格式等），并提供了产品包装设计、落地页文案、研究报告和电影图像生成等四个具体案例的模板应用，帮助用户理解如何编写结构严谨、意图明确的提示词。
Hermes WebUI 终极指南：在浏览器中掌控你的 AI 终端
本文介绍了专为 Hermes Agent 打造的 WebUI 可视化控制台。该工具采用 Python 原生后端与 Vanilla JS 前端，旨在提供零框架、零构建的秒级启动体验。文章详细阐述了其核心功能，包括流式输出、思维链可视化、内嵌文件浏览器及安全护栏，并提供了原生与 Docker 两种部署方案及常见问题排错指南。
MemOS —— 给Hermes打造永续记忆
文章探讨了如何利用 MemOS 插件为 Hermes Agent 构建长期记忆系统。作者指出，单纯的模型能力不足以支撑持续成长的 Agent，关键在于记忆的组织与沉淀。MemOS 通过全量写入、语义切块、去重合并、混合检索及任务归纳等机制，将对话转化为结构化的经验记录，并配合可视化面板实现了记忆的本地化管理。这使得 Hermes 能够记住用户习惯与上下文，从“一次性工具”进化为“越用越顺手”的生产力系统。
GPT2 高拓展性进化史信息图提示词
本文分享了一套专为 GPT-2 设计的提示词，旨在生成“高拓展性、强组织性、高审美”的进化史信息图。作者通过咖啡豆、苹果、内裤等多个主题的测试，验证了该提示词在理解主题、自动梳理时间脉络、匹配视觉风格（如深/浅色模式、配色系统、排版节奏）方面的强大能力。文章详细列出了从结构定义到视觉融合的 19 条设计原则，强调避免模板化，力求为每个主题定制专属的博物馆级视觉呈现。