01 / 15
翻页

四种轻工具

AI 时代 Builder 触达世界的瑞士军刀

创作者困境

你的好内容,为什么没人看?

写了三千字的方案发到群里,没人打开

做了精美PPT,对方说「能不能发个链接我手机看」

不是内容不好——是包装太重,传播太难

未打开 发到群里的 PDF 作品展示 立即查看 3秒打开 发到群里的网址

今天的工具

三片刃 + 一个刀柄

1993 HTML 网页的底层语言 2001 SVG 放多大都不糊的图 2004 Markdown 结构化的写作方式 2008 GitHub 全世界的代码仓库

曾经程序员专属,今天被 AI 重新激活——你只需认识它们,然后让 AI 去执行

结构之刃 / Markdown

你和 AI 沟通的「普通话」

不是编程语言——是一种标记约定,像给文字贴标签

用 # 表示标题,用 - 表示列表,用 ** 表示重点

所有 AI 工具的提示词、文档、配置文件,都在用它

学会 Markdown,就是学会了跟 AI 说话的语法

my-course.md # 我的商业计划 ## 目标客户 - 25-35岁女性创业者 - 有内容产出但**缺流量** ## 解决方案 1. 个人网站搭建 2. SEO 基础优化 3. 社群引流矩阵 > 先做出来,再慢慢改
结构之刃 / Markdown

左边写几个符号,右边变成排版

你写的不是代码,是带格式的笔记——AI 和所有工具都认识这些符号

源码
# 我的 AI 摄影课

## 你能获得什么
- **3天**掌握手机摄影 + AI 修图全流程
- 零基础可学,每天只需 30 分钟

## 课程大纲
1. 手机構图与光线
2. AI 一键修图实战
3. 朋友圈视觉体系搭建

## 往期学员评价
> "终于知道怎么拍出好看的产品图了!"

[→ 立即报名](https://example.com)
渲染

我的 AI 摄影课

你能获得什么
  • 3天掌握手机摄影 + AI 修图全流程
  • 零基础可学,每天只需 30 分钟
课程大纲
  1. 手机構图与光线
  2. AI 一键修图实战
  3. 朋友圈视觉体系搭建
"终于知道怎么拍出好看的产品图了!"
→ 立即报名
结构之刃 / Markdown

为什么所有 AI 都在用 Markdown?

ChatGPT 回复
# 商业计划书
## 目标客户
- 25-35岁女性创业者
## 解决方案
1. 个人网站搭建
2. SEO 基础优化

AI 说话天然就是 Markdown

SKILL.md
---
name: idea-to-github-page
---
# 使用步骤
1. Fork 项目
2. 描述你的想法
3. 自动部署

AI 工具的配置文件也是 Markdown

system.md 提示词
# 角色
你是一个营销文案专家
# 规则
- 用口语化表达
- **重点**加粗标注
- 每段不超过3句

指挥 AI 的提示词也是 Markdown

写一次,到处能用
→ 渲染成网页 → 导出成 PDF → 发到公众号 → 做成幻灯片(就像这个)

同一份内容,不用重新排版

呈现之刃 / HTML

HTML:给内容穿上衣服

Markdown 是骨架,HTML 是皮肤——文字变成网页的关键一步

源码
<div class="hero">
  <h1>用 AI 拍出爵士感照片</h1>
  <p>3天小白变达人</p>
  <img src="demo.jpg">
</div>

<div class="features">
  <div class="card">手机就能拍</div>
  <div class="card">AI一键修</div>
  <div class="card">零成本</div>
</div>

<button class="cta">
  立即加入 ¥199
</button>
渲染

用 AI 拍出爵士感照片

3天小白变达人

作品展示图
手机就能拍
AI一键修
零成本
呈现之刃 / HTML

一个网页能装下所有东西

你想展示的一切,都能塞进一个链接里

T
文字排版标题、段落、列表、引用
图片与配色产品图、Banner、品牌色
视频嵌入YouTube / B站 / 自托管
表单交互报名、预约、问卷收集
动画与特效滚动渐入、悬停放大、计数器
my-course.github.io

AI 摄影实战课

3天拍出爵士感照片

02:34

嵌入视频:第一课免费试看

立即报名 ¥199
本周 内容产出分布 文章 30% 视频 20% 图文 25% 其他 15%
图形之刃 / SVG

让 AI 帮你画图,不花钱、无版权

流程图、对比图、数据图——你用嘴说,AI 用 SVG 画

矢量格式,手机电脑大屏都清晰;不用找设计师,不用买图库

你拥有了一个随叫随到、不收费的插画师

图形之刃 / SVG

SVG:AI 画图的「交付格式」

你不用看懂代码——这段代码就是一张图,改文字改颜色 AI 三秒搞定

源码
<svg viewBox="0 0 280 200">
  <!-- 漏斗图:客户转化路径 -->
  <polygon points="40,20 240,20 200,70 80,70"
    fill="#dbeafe" />
  <polygon points="80,75 200,75 180,125 100,125"
    fill="#93c5fd" />
  <polygon points="100,130 180,130 165,180 115,180"
    fill="#3b82f6" />
  <text x="140" y="50">访问 1000人</text>
  <text x="140" y="105">咨询 200人</text>
  <text x="140" y="160" fill="#fff">
    成交 30人</text>
</svg>
渲染
访问 1000 人 咨询 200 人 成交 30 人 100% 20% 3%
刀柄 / GitHub

全世界 Builder 的宝藏库

一键发布网站,免费、不限流量、自动生效

每次修改都有记录——别人能看到你来时的路

全世界最优秀的人都在这,你的作品也该在

YOU
your-idea 公开作品集 · 持续更新中
产出记录
12Projects
48Commits
1URL

国内落地

同样的路,国内也能走

G

Gitee

存代码、记录成长

gitee.com
E

EdgeOne Makers

代码变网址

cloud.tencent.com/product/teo
S

SkillHub

找现成的好工具

skillhub.cn
跟 AI 说

我有做好的网页,请教我怎么上传到 Gitee 并通过腾讯云 EdgeOne 部署上线

EdgeOne Makers 有免费版,额度以官网为准

想法到网址,四步搞定

M

梳理结构

用 Markdown 把想法写成有层级的文档

# 我的课程
## 学什么
## 谁适合
## 怎么报名
跟AI说:帮我用 Markdown 列一个大纲:我要做一个XX的介绍页,包含XX、XX、XX几个部分
H

生成页面

AI 把 Markdown 变成带设计的 HTML 网页

跟AI说:把这份 Markdown 变成一个好看的网页,要有导航、大图、卡片介绍区
S

补充图形

让 AI 画图表、Logo、图标,插入页面

跟AI说:帮我画一个XX的示意图,SVG格式,配色用蓝色系
G

发布上线

Push 到 GitHub,自动获得一个网址

✓ 已发布
your-name.github.io
跟AI说:教我怎么把这些文件上传到 GitHub 并开启 Pages

每次修改都自动更新,不用重新发文件给任何人

想偷懒?最后一页有个 Skill,帮你四步跑通

传统方式

发文件、等别人下载

打开率低,加载15秒人已经走了
手机打不开、样式乱、格式不兼容
改了得重新发,无法追踪谁看了
搜索引擎永远找不到你
更轻量的触达

一个网址,随时随地

3秒打开,手机电脑平板通吃
改完自动生效,不用重新发
可被 Google 收录,陌生人也能找到你
7x24 在线,永不过期,替你打工
图文视频全支持 任何设备通吃 可被搜索引擎收录 持续沉淀作品集

去探索,去创造,去被看见

AI 时代的 Builder,不缺想法——缺的是让想法落地的最后一步

idea-to-github-page skill
公众号:算力白肉