文章目录
前言
之前写过一篇文章讨论图形化编程中的 AI 助手 , 当时的实验展示了一些有趣的可能性, 但实用性并不高。 随着 GPT-4o 的发布, 尤其是多模态能力的提升(不久将发布音频流, 视频流 API), 图形化编程中的 AI 助手(或导师) 变得真正具有吸引力: 你可以通过对话与之交流, 它能够实时看到你在做的事情, 理解你的困境并给予建议或引导
Snap! (即将发布 Snap! v10)近期的巨大改进。尤其是 lisp code 功能的发布(积木与代码是同构的)，使得 Snap 成为可以与 AI 进行深度协作的图形化环境。
通过 Snap! 的JavaScript function 功能, 我们可以将 GPT-4o 的能力全部引入 Snap! , 无需对 Snap! 源代码做任何修改!
我将 GPT-4o 的功能包装为一个 Snap! 库
其中最常用的积木是 stream chat completions, 这个积木流式地输出 GPT-4o 的回复, 与你在 ChatGPT app 的使用体验非常相似。
这个积木的参数如下:
text: 提示词vision: 将 Snap! 某个区域的图像发送给 GPT-4o。你可以选择让 GPT-4o 看到以下任一内容,- IDE: 当前整个页面
- Stage: 舞台区
- Camera: 摄像头
- Scripting Area: 脚本区(暂未实现)
- Palette: 最左边的积木区域(暂未实现)
- None: 不携带图像(只进行文本对话)
callback: 回调函数。每当 GPT-4o 返回了信息时, 将调用这个回掉函数, 通常来时，它是say, 或者设置某个变量temporary: 这个开关用来控制是否是临时对话, 如果不是临时对话, 对话的内容都将存储在messages变量中。 你可以使用clear messages积木清理它。
描述摄像头的内容
在这个简单的例子(点击运行)中, 我们让 GPT-4o 描述它看到的摄像头内容
你需要先在积木填写 API key, 才能运行。为了获得 API key, 需要有一个 openai 账号(目前只有 Plus 用户才能够使用 GPT-4o 的 API, 未来可能会有变化), 然后通过 这个链接 申请 API key。
如果你是企业, 想为国内用户提供 GPT-4o 的 API 服务, 需要等到微软的 Azure OpenAI Service 支持 GPT-4o。 我为 Azure OpenAI Service 也构建了对应版本的驱动库, 如有需要，可以联系我。
生成图像
将文字生成的图像, 用作角色的造型:
聊天界面
你可以使用 Snap! 的菜单库构建类似聊天软件的界面, 原理是为 messages 变量构建合适的 UI 界面。
图形化编程中的 AI 助手
我将 AI 助手 构建为一个普通的 Snap! 角色, AI 助手只是一个使用了 GPT-4o 库的普通角色, 作为用户的你(你可能是产品经理或老师), 可以随意修改它来实现脑子里的原型, 由于整个过程只是拼搭积木, 因此无需委托"软件工程师"来帮助你实现想法。
我喜欢在 Snap! 的 “用户环境” 中工作, 而不是在源代码中工作, 它有更好的活性(liveness), 不仅效率更高, 而且更加愉快。
分享我之前做的一些实验, 它们都包含在这个项目中: AI Assistant(点击运行)
运行项目之前，首先需要切换到 AI Assistant 角色里， 填写 API key.
视频演示
这个 演示视频(图形化编程环境中的 GPT-4o) 介绍了更多的内容, 如果你对 AI Assistant 项目感兴趣，推荐先看完视频。
以下是几个比较简短的视频展示 AI Assistant 的能力:
向用户解释页面中的任务(通过视觉能力看到当前任务):
当用户感到困惑时, 看到用户的困境(与用户共享相同的视野), 并给与合适的建议
解释答案, 并给出可运行的积木代码:
我试着在以下例子中测试 GPT-4o 的能力边界：
基于给定的积木, 以及一例展示了lisp code 语法的样本, GPT-4o 就完成了这个任务:
GPT-4o 的视觉能力帮助纠正了我任务描述中的错误(内径误写为外径)， 思维链对于增强它的数学能力非常有用。例子来自Test Driving ChatGPT-4o (Part 2)。
将 Snap! 的 Puzzle 功能与 GPT-4o 相结合来构建 microworld,
Seymour Papert 最早在《Mindstorms》里提出 microworld 的想法, 《终身幼儿园》复述了这个重要想法。 这是个非常有潜力的方向，我目前认为它可能是在图形化编程中的 AI 助手的最佳方向, 它可以显著减少幻觉。
更多的演示参考 演示视频(图形化编程环境中的 GPT-4o)
FAQ
如何改进 GPT-4o 的 lisp code 生成能力？
- 提供语法的形式描述
- 提供足够的代码样本用于 fine-tuning
- 写一个爬虫从 Snap! 社区爬取所有项目, 用于 fine-tuning
接下来会做什么?
目前的 GPT-4o 版本只是 v1, 有很多工作值得继续探索:
- embedding for blocks(help text)
- 音频流(openai 暂未发布 api)
- 视频流(openai 暂未发布 api)
你是如何构建 GPT-4o 库的?
使用 JavaScript function 引入 OpenAI JavaScript library。
GPT-4o 库的每一个积木, 都可以展开阅读, 通过阅读这些自定义积木, 你可以弄懂它们是如何构建的。
如何将其转化为标准的 Snap! 库?
目前 GPT4o 库 已成为了 Snap! 中文版 内置库.
更多细节参考 如何将其转化为标准的 Snap! 库?
Realtime API
参考 视频演示