绝了,图片秒变代码,开发越来越简单了!

科技   2024-11-21 21:34   广东  

来源:Jack Cui

大家好,今天继续聊聊科技圈发生的那些事。

一、screenshot-to-code

一款将屏幕截图转换成代码的开源工具。

通过截取屏幕图像,screenshot 工具可以识别出代码的页面布局,生成HTML、CSS、Javascript 等常用的代码,同时还能预览代码实现的效果。

透过这个功能,似乎就像是 screenshot 帮我们戴上一副透视眼镜。仅仅根据截图,我们就能透过图像,直接看到背后的代码结构。当然,这背后的工作仍然要交给 AI 。

我们尝试将 Taylor Swift 的 Instagram 个人主页截图下来,并将其上传给 screenshot。

可以看到, screenshot 在很短的时间内就生成了新代码,将 Taylor  的主页以很高的还原度“复制”了下来。

对于 NYTimes 的新闻, screenshot-to-code 也有不错的表现。

单看这两个示例,我们可以发现,抛开选用的图像,只谈页面布局的话,说不上是一模一样,但 screenshot 至少能给出相似且舒服的代码,实现类似的布局效果。

在项目的主页上,作者团队声明使用了以下的AI大模型:

  • GPT4-Vision
  • Claude 3 Sonnet
  • DALL-E

工具主要使用 GPT4-Vision 生成代码,而 Claude 3 Sonnet 用于辅助(在某些输入情况下,它比 GPT4-Vision 性能更好),并使用 DALL-E 生成图像。

目前 screenshot-to-code 有两种使用方式。一种是在作者团队的网站上在线使用,需要付费。

地址:https://screenshottocode.com

另一种是本地部署。

项目地址:

https://github.com/abi/screenshot-to-code

除了上传截图生成代码外,工具同样支持输入网页URL在线获取截图。

还可以将网站的视频/录转换成网页,演示如下:

项目已开源,可以自己部署进行体验。

二、manga-image-translator

当你作为一名资深二次元,跑遍了论坛,求遍了群友,终于,找到了一份期待已久的漫画资源。

嗯,画面和之前看到的切片差不多,可就是哪不对..

生肉?!可没人说看个漫画还得精通语言啊!看不懂,咋办?

于是,manga-image-translator来了。

正如其名,manga 即日语的漫画, manga-image-translator 是一款开源的图像翻译器,上传图片,它能够识别图像中的文本部分,并将其翻译成你想要的语种。

OCR(Optical Character Recognition),光学字符识别技术。基于这项技术, manga-image-translator 可以通过亮-暗检测的模式,精准的提取出图片中的文字,将其转换成可处理的数据。

manga-image-translator 接入了很多翻译器,将OCR提取出的文字进行翻译。

此外,manga-image-translator 还有去除文本气泡里面内容的功能,方便后续进行编辑美化。当然,在进行文本去除后,manga-image-translator 还会对余下的气泡部分进行修复,保证了视图的美观和完整。

去除气泡内文字

项目地址:

https://github.com/zyddnys/manga-image-translator

目前项目已经开源,支持命令行执行Web服务器执行两种模式。感兴趣的小伙伴可以自己试一试。


AI算法与图像处理
考研逆袭985,非科班跨行AI,目前从事计算机视觉的工业和商业相关应用的工作。分享最新最前沿的科技,共同分享宝贵的资源资料,这里有机器学习,计算机视觉,Python等技术实战分享,也有考研,转行IT经验交流心得
 最新文章