部署DeepSeek模型,进群交流最in玩法!
立即加群
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >专栏 >用腾讯云HAI+AI助手,不懂代码也能自己做页游

用腾讯云HAI+AI助手,不懂代码也能自己做页游

原创
作者头像
穿过生命散发芬芳
发布2025-03-21 06:38:30
发布2025-03-21 06:38:30
3000
代码可运行
举报
运行总次数:0
代码可运行

一、什么是HAI

腾讯云高性能应用服务(HAI,Hyper Application Inventor)是腾讯云推出的一款专注于AI与科学计算领域的云服务产品,旨在为开发者、企业及科研人员提供高效、易用的算力支持与全栈解决方案。当前主要使用场景为: AI作画,AI对话/写作、AI开发/测试。

二、一键开通HAI

点击购买页面,在这里选择内置社区应用—DeepSeek-R1,可选按量计费或者包年包月。

三、连接HAI资源

1)这里我们算力连接选择CloudStudio。

2)打开在在线IDE环境。

3)在插件市场中搜索腾讯云AI代码助手,并安装。

四、使用AI助手开发页游

1)打开AI代码助手,选择Craft模块,输入你想要实现的内容。比如我这里想开发一个游戏:

代码语言:python
代码运行次数:0
运行
复制
我现在使用cloudstudio的IDE在线开发环境,帮我写一个可以在浏览器上玩的消消乐游戏

2)然后它自己就开始设计,并执行生成了index.html文件。

3)任务完成之后,可以选择全部采纳。

4)代码已经完成,但是怎么执行呢?这个你可以继续问AI助手。

代码语言:python
代码运行次数:0
运行
复制
如何在这个IDE环境来执行index.html

5)可以看到它很快给出了解决方案,在终端中输入以下命令来启动Python的HTTP服务器。

代码语言:python
代码运行次数:0
运行
复制
python3 -m http.server 8080

6)这里我们选用8000端口来执行。

7)为了能在互联网上访问到这个端口,我们需要把HAI的8000在安全组中添加允许。

进入HAI的管理页面,然后在端口配置里编辑规则。

8)之后会跳到安全组,添加入站规则。为了安全起见,在来源这里添加自己的公网IP。

在浏览器中可以查看自己的公网IP。

添加完成之后如图所示:

9)添加完规则之后,在HAI控制台查看下公网IP。

10)激动人心的时刻就要来了,现在我们通过本地浏览器来访问下刚才创建的游戏。相当不错,直接就可以玩了。

在终端侧也可以看到有链接访问进来。

11) 我们还可以让AI助手继续来丰富下这个页面,比如可以让它在页面上增加下游戏规则。

代码语言:python
代码运行次数:0
运行
复制
帮我优化下上面消消乐游戏,在页面上增加游戏规则的说明,同时增加简单和复杂两种模式选择。

12)完成优化,并且优化的具体区别都罗列了出来。同时更新了index.html。这里我们还是选择全部采纳。

13)我们再来访问下刚才的页面,可以看到了游戏规划和两种模式,还加入了倒计时。

来玩上一局,so easy,嘿嘿。

14)我们再尝试增加一个炫酷的背景,看看是否能增加个音效。

15) 优化完成后,新增了一个README.md文档,还是全部采纳。

16) 再来看下修改后的效果,背景已经是个简单的动态效果,在右上角可以看到音效的开关。

不过这里AI助手不具备生成音频文件,需要我们自己来放到对应的目录下。在终端也可以看到点击的话,是没有这些文件的。

到这里基本上我们就完成了一个页游,最后游戏的效果还可以哈。是不是全程没有写任何代码,不但不感叹现在AI发展的太快了。

五、总结

腾讯云 HAI 结合 AI 代码助手,提供了无代码开发体验。即使没有编程经验,也能通过可视化工具快速搭建页游,降低开发门槛。有如下的优势:

1、无需编程经验:只要逻辑足够缜密,想法足够多,零基础用户通过和AI助手对话也能开发出优秀的页游。

2、效率提升:对于有丰富经验的开发者,那么HAI+AI 把复杂的开发任务缩短至数小时或数天。

3、成本可控: HAI拥有独立的公网IP,且可以按需计费,同时腾讯也经常有试用活动。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 一、什么是HAI
  • 二、一键开通HAI
  • 三、连接HAI资源
  • 四、使用AI助手开发页游
  • 五、总结
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档