🍹 Insight Daily 🪺
Aitrainee | 公众号：AI进修生
Hi，这里是Aitrainee，欢迎阅读本期新文章。
一个实现了Claude 3.5 Sonnet Artifacts 类似功能的开源项目现在升级了，界面变得更好，最重要的是它现在可以免费使用 OpenAI 的 o1 模型，而且是 o1 preview，这真让人难以置信。
▲ o1-preview
并且目前提供免费模型还有 Llama3.1 405B、Claude3.5 Sonnet 、Gemini Pro 等等。
这个项目名叫 ai-artifacts，用户界面与 v0（往期文章） 非常相似。
它是 E2B 公司开源的，像是一个让 AI 运行代码的沙箱环境。总之，这是一个可以在本地托管和使用的开源 Artifacts 替代品。
我对其中的模型进行了许多编程任务的测试，下面我们来看看吧：
> 为了让这些模型发挥最佳性能，所有提示词使用英文，视频或截图出现中文是为了方便观看。
音乐播放器:开发一个简单的音乐播放器，允许用户上传和播放自己的音乐文件。
Claude 3.5 Sonnet
如果你观看了视频，会发现他完成的很棒，
太太太太 ...
所有的功能都正常运作。
然后相同的提示词我继续使用 o1-mini 和 Gemini Pro来测试：
丸辣
两个转了半天没有转出来，Gemini Pro 甚至一个代码字符都没憋出来，所以他们都失败了。在此，o1-mini 好感度 -1
创建一个应用程序，用户输入一个问题，并返回一个人工智能生成的答案。
非常完美，后续我还让他：
“ 想要添加更复杂的功能控件，并将将对话框发送在底部 ”
太酷啦 ...
创建一个天气桌面应用程序，显示当前天气和未来几天的天气预报。
claude
真的很完美，尤其右上角那些下拉菜单那些功能都能用甚至还有一个录制截屏视频的，而且还提供了界面暗色、亮色的切换。
o1-mini
当 o1-mini 跑出了几乎相同的app界面的时候，我在想他们的某些训练数据是不是一样的，或者这就是这种提示词下最标准的编程实践，还有或许是 ai-artifacts 框架导致的。
当然o1-mini生成的和claude有一点不同的是左边直接提供了天气应用程序api的接入框，总的来说这个任务下二者做的都不错。
健康跟踪应用程序:设计一个应用程序，帮助用户记录和跟踪健康指标，如体重、锻炼和饮食。
o1-mini 失败了
在线投票系统:设计一个简单的在线投票应用程序，允许用户创建投票并查看结果。
gpt4-o效果很一般
这行忘删了：创建一实时天气应用程序，使用Vue.js显示当前天气数据。
使用Gradio开发一个AI代理应用程序，允许用户通过选择不同的任务与多个模型进行交互。
o1-preview，虽然创建出来了，但是和指令似乎并不那么相关
生成一个看起来很酷很现代的桌面天气应用，使用虚拟数据。
这个看起来还是不错的。
创建一个集成多个AI模型与Streamlit的代理开发平台，用户可以选择不同的AI模型(如文本生成、图像生成、情感分析等)，并通过简单的拖放界面将这些模型组合起来，创建个性化的应用程序。
Claude 3.5 Sonnet 也没有做出来，提示指令太复杂了并且没有细分。
o1 preview 也处于一直转不出来的状态
构建一个 Gradio 应用程序，用户可以在其中实时输入文本并生成图像。提供多种滤镜和样式选项，允许用户在生成过程中调整图像效果并共享其作品的链接。
Llama3.1 70B 失败了
创建一个Streamlit应用，用户输入文本描述后生成相应的图像。
Gemini Pro生成错误。
好了所有的测试先到这里，总的来说我觉得这个开源项目做的整个界面相当不错，就像v0一样，而且运行得很好，你可以用自己的 API 密钥在本地使用，让我告诉你如何在本地设置它：
Get Started
Prerequisites
• git
• Recent version of Node.js and npm package manager
• E2B API Key
• LLM Provider API Key
1. Clone the Repository
只需去 GitHub 仓库并将其克隆到你的计算机上：
git clone https://github.com/e2b-dev/ai-artifacts.git2. Install the Dependencies
完成后进入仓库目录，运行 npm install 命令，依赖项应该会被安装：
cd ai-artifacts运行以下命令以安装所需的依赖项：
npm i3. Set the Environment Variables
安装完成后，然后输入你可以从 E2B 免费获取的 API 密钥：
https://e2b.dev/dashboard
创建一个 .env.local 文件并设置以下内容：
# Get your API key here - https://e2b.dev/
E2B_API_KEY="your-e2b-api-key"
# OpenAI API Key
OPENAI_API_KEY=
# Other providers
ANTHROPIC_API_KEY=
GROQ_API_KEY=
FIREWORKS_API_KEY=
TOGETHER_AI_API_KEY=
GOOGLE_AI_API_KEY=
MISTRAL_API_KEY=4. Start the Development Server
运行以下命令以启动开发服务器：
npm run dev5. Build the Web App
一切准备好后，我们就可以开始使用了。只需运行 npm run 命令，它就会启动，转到它显示的本地端口。
npm run buildE2B的简介&特色
E2B可以给你的ai应用程序集成代码解释器
还有许多其他功能
总的来说，代码生成这一块我更喜欢Claude3.5，o1与它的表现相近，但是要付出更多的时间和成本。我本来期望o1-preview能在复杂的app生成上做得比Claude3.5好，可惜实际并不是这样，也许o1在其他复杂任务上会更好，如数学、逻辑推理思考等。Claude3.5确实比较适合写代码。
对于其他的模型，Gemini Pro、405B、70B、Mistral等等，我觉得他们并不能写出很棒的效果，稍微复杂一点就挂了。当然，基本上我也没有测试比较简单的东西，其他模型，比如Mistral因为都失败了所以没有放出来了。
🌟希望这篇文章对你有帮助，感谢阅读！如果你喜欢这系列文章请以 点赞 / 分享 / 在看 的方式告诉我，以便我用来评估创作方向。
[1] github：https://artifacts.e2b.dev
知音难求，自我修炼亦艰
抓住前沿技术的机遇，与我们一起成为创新的超级个体
（把握AIGC时代的个人力量）
点这里👇关注我，记得标星哦～
