搞了个 AI 涂鸦板
前阵子把涂鸦画板重写成了一个 React 白板组件,写完总觉得少点什么。白板能画、能改、能撤销,但终究还是得自己一笔一笔去画。于是顺手在上面接了个大模型:右边一个对话框,说一句「画一只坐着的小猫」,它就自己在白板上动笔。

体验地址:https://inchill.github.io/react-whiteboard-ai/
画出来什么样
目前接的是 DeepSeek,随便画了一圈,效果比我预想的好。小猫、小兔子、帆船日落、灯塔、冒热气的咖啡杯,都是一句话出来的,线条带点手绘的笨拙感,反而挺可爱。
最让我意外的是那块黑板。我说「画一个几个算术公式构成的画,像黑板写的那样」,它思考了二十来秒,摆了 20 个图形:深绿底、棕色边框、粉笔槽、两列算式,左上角还写了个「今日算术」,右下角画了个笑脸。这种东西它不是在「画」,而是在「排版」,反而是它最擅长的。
当然也有翻车的时候。「画一只大象」那次思考了 45 秒,出来的大象就……比较抽象,像是谁家孩子画的。不过放在一个涂鸦板里,这种稚拙感好像也说得过去。
几个小设计
- AI 画的每一笔都是真的图形,不是一张贴图。画完你可以选中、拖动、改颜色、擦掉一部分,跟自己画的没有区别。
- AI 每轮修改算一步,不满意就 ⌘Z 一次性撤回,不用一笔一笔往回退。
- 下面分了手绘、结构图、布局、编辑几种模式,也放了几个预设的点子(小老鼠头像、仙人掌盆栽、热气球……),不知道画什么的时候点一下就行。
给小孩玩挺合适
做着做着我意识到,这东西最合适的用户可能不是我,而是家里的小朋友。小孩脑子里画面多,手上功夫跟不上,现在说一句就能看到它画出来,画完还能自己上手涂改、添几笔。一个出主意,一个动手,挺好玩的。
问题是小孩不太会打字。所以下一步想加上语音转文字:按住说话,松手就开画。这样三四岁的孩子也能玩起来。
先这样,等语音做好了再来更新。