拜托了!请阅读这个

Reddit r/artificial 工具

摘要

一位开发者描述了构建一个工具,该工具允许用户通过拖拽、调整大小和编辑元素来可视化地调整AI生成的网站,这会直接更新代码,并支持响应式设计预览和更改。

大家好,我是一名开发者,经常遇到这个问题:即使我给AI提供了足够的上下文,小修改也会变得很烦人。移动这个文本一点,让那个图像变小,调整间距... 有时它不理解我的意思,或者做出与我想要的不同的事情。然后就需要更多的解释、更多的提示、消耗更多的tokens。所以我开始构建这个。如果AI创建了网站,而我们自己只需调整那些小东西,会怎样?你在网站上点击某个元素,移动它、调整大小、编辑文本或更换图像,它就会直接将更改保存到你的代码中。无需翻找文件并调整边距和填充值来查看是否看起来正确。你还可以同时预览桌面、平板和移动设备,查看在不同设备上的效果。对于支持的更改,你可以选择仅更改该屏幕尺寸或应用于所有地方。这样在移动设备上调整内容就不会破坏你的桌面布局,这取决于你的选择。目前它包含: - 拖拽、调整大小和文本编辑 - 图像和背景更改,包括从设备上传 - 可移动的设备预览,带画布缩放 - 用于选择整个容器或其中单个元素的控件 - 编辑历史和撤销/重做 - HTML支持,以及实验性的React和Next.js支持 它仍处于初始阶段,有许多需要修复和完善的地方,包括扩展哪些编辑可以为每个屏幕尺寸单独进行。老实说,我不知道其他人是否需要这个,但直接进行我想象中的更改而不是再次解释,对我来说感觉很有用。你会使用这样的工具吗?我应该开源它以便我们可以一起构建,还是你更愿意等到它更完善后再使用?另外,如果有任何添加想法,请随时提出。
查看原文

相似文章

可编辑视觉设计

Hugging Face Daily Papers

由视觉语言模型引导的编码代理通过合成视觉资源和优化HTML/CSS布局,生成可编辑的分层设计,实现具有精确控制的后编辑。

DesignMD

Product Hunt

DesignMD 是一款将任何网站转换为人工智能就绪的设计系统的工具,简化了从设计到开发的工作流程。