下载 App

「自制卡牌游戏DIY」游戏主界面设计

2025/08/03139 浏览主题教程
我正在尝试用『星火编辑器』创作一款卡牌游戏。
在前面几期,我们完成了卡牌和卡牌包功能的制作,并在实机测试中看到了想要的效果。而对于一款卡牌游戏,主界面的设计尤为重要,它将直接影响玩家的观感。星火官方给出了游戏UI的评价标准(P2):左图那样杂乱的UI只能是D档,右图那样将UI合理摆正则能达到C档。那么A档的UI是怎么样的呢?虽然官方没有给出参考,但今天我们就要挑战设计一款A档UI水准的游戏主界面!
让我们先从游戏开始按钮做起。这里规划了4种游戏模式——贯穿游戏前中期的主线关卡、让玩家冲击巅峰的无尽模式,给玩家上压力的生存模式,最后是高玩挑战巅峰的舞台——作者的试炼。先建立一个大的开始游戏面板panel,然后在其中创建4个按钮button,布局在界面右侧。尺寸和间距这些规格都在布局栏严格设计好,这里我将按钮之间间距定为173。小圆设置按钮则布局在界面右上,既使玩家轻松找到,又不会遮挡主界面和游戏内场景的视线(P3)
我们在每个按钮上都创建一个按钮文字的label显示按钮功能,在开始游戏面板的上端显示当前上场卡牌张数;然后在这几个按钮下方显示与模式对应的挑战信息,比如在主线关卡按钮下的文字用于显示当前关卡,无尽模式按钮下的文字显示玩家在本模式最长坚持时间,生存模式按钮下显示玩家最高生存波数,让玩家直观看到自己在每个游戏模式中的进度,激励玩家持续挑战(P4)
下面思考玩家在主界面可能用到的功能。首先玩家一定需要一个入口打开卡牌包;然后存放物品的背包也是必要;接着是邮件,毕竟系统消息、系统奖励和玩家短信都需要在邮件中查看;再接下来是强化,游戏养成系统必不可少;最后是商店,给玩家一个(氪金)购物天堂[笑哭R]那么还是老样子,界面底部建立大的首页下方图标栏panel,然后在其中建立5个button,添上文字label就ok(P5)
除此之外,是不是要给玩家一些奖励和激励?那么我们就在界面左上醒目位置加上每日签到功能,让玩家一进游戏就能点进去领奖,玩家留存UP!然后既然是卡牌游戏,抽卡功能必不可少;还有让高玩证明自己实力的排行榜!这三个让玩家惊喜的按钮布局在游戏左上,醒目亮眼(P6)
这样一来,游戏的主界面就有模有样了吧?是不是完爆官方图上那个C档的UI(P2)!下一期我准备分享一波手搭3D背景——让主界面更加高大上。最后感谢大家的关注点赞支持,下一期我们还是不见不散!
猜你想搜
星火编辑器 卡牌游戏设计
星火编辑器-修改官方预制自定义物品信息模板截图
星火编辑器-修改官方预制自定义物品信息模板
大家对DIY物品信息显示都很热衷,但是在具体实现上还是比较费神费力的,这次的更新将会极大程度上减少开发者的困难,而且非常好用。 首先,需要将编辑器更新到10版本,这次的更新官方重构了物品提示信息面板,并在界面编辑器中加入了7个全新的页面: 我们所要修改的页面主要是【物品信息_物品信息模板】中的【物品信息】控件: 其中【上部属性面板】就是背包效果,【下部属性面板】就是装备效果 这两个不需要管它,我们
18 赞
3 回复
星火编辑器客户端物品获取属性值的方法截图
星火编辑器客户端物品获取属性值的方法
物品添加属性分两种情况 1:设置额外属性 2:添加词缀 各有各的优缺点。 本次主要讲的是添加词缀如何在客户端获取属性值。 第一种情况:词缀buff里的属性值是设置好的固定值。 这类添加给物品后,在客户端获取就很容易。 因为添加的词缀是“装备”词缀,只需要遍历指定的装备词缀列表这条语句,获取到buff_id 再直接将buff_id通过转化成(数编表:buff),再对数编表buff里的属性修改里去获取
9 赞
35 回复
00:09
背包自动整理:一看就会,超简单!截图
背包自动整理:一看就会,超简单!
背包一键整理,星火编辑器触发几行就能轻松做出背包一键整理功能,纯小白也能学会~ 先看视频效果: 一、核心目标 点 “整理背包” 按钮,让背包里的物品自动排序(比如好东西放前面、同类集中),把零散格子空出来,找东西更方便! 二、步骤拆解(对应截图逻辑) 1. 启动整理流程(事件触发) 选 “游戏 - 触发自定义事件”,绑定 “背包整理按钮点击” 。意思是:点按钮时,启动整理功能。 2. 提取背包物品
5 赞
星火三消之三连检测截图
星火三消之三连检测
上一回完成了消块实例化的显示(P2)(https://www.bilibili.com/video/BV1qLeUzKEHS?spm_id_from=333.788.recommend_more_video.0&vd_source=f9c1188016e81eabc613ade954e6d482),红框部分可以看到随机生成的消块构成了三连、四连。 为了避免这一情况我们在生成消块前加入对随机到的消块
3 赞
1 回复
「自制卡牌游戏DIY」自动生成卡牌(4)截图
「自制卡牌游戏DIY」自动生成卡牌(4)
#星火编辑器 #星火编辑器入门 #卡牌游戏 #星火编辑器小功能分享教程 我正在尝试使用『星火编辑器』将一张游戏卡牌变成一款卡牌游戏。 在前面几期中,我们已经实现了自动生成卡牌功能的UI设计和服务端部分,而且客户端部分的逻辑实现也在高歌猛进。那么这期我们继续为实现这一阶段的目标而努力——做出一个如 P2 这样带滚动条、动态显示卡牌信息、可选择卡牌上下场的卡牌包,而且卡包中的卡牌还要根据玩家已有卡牌
「自制卡牌游戏DIY」制作一个卡牌包(上)截图
「自制卡牌游戏DIY」制作一个卡牌包(上)
#卡牌游戏 #星火编辑器 #星火编辑器入门 #我的游戏日记vol7 我正在尝试用『星火编辑器』制作一款卡牌游戏。众所周知,要做出一款卡牌游戏,光有一张游戏卡牌是不够的,还要有一个能装卡牌的卡牌包,并且最好要能清晰呈现卡牌信息。以下是我的详细操作—— (1)先绘制3个panel框,并在每个框底部配上一个深色的背景,在色调上和卡牌颜色区分。其中左侧的大框代表卡牌显示区,即显示拥有的卡牌;右上的框代表
1 赞
「自制卡牌游戏DIY」战斗抽卡系统(2)截图
「自制卡牌游戏DIY」战斗抽卡系统(2)
#星火编辑器 #星火编辑器入门 #星火编辑器案例 在上期内容中,我们从卡牌状态的切换打开思路,将从卡池中刷新场上卡牌逻辑用触发器一步步实现,并通过洗牌的方法确保玩家从入场卡池中刷出的卡牌具有随机性。但在此之后系统还需要将抽取的卡牌替换为新卡,并为抽到的法术卡添加法术,方可将刷出卡牌的信息完备地打包给客户端以呈现给玩家,而这正是今天要做的。话不多说,来吧。 接着上期,在对卡池中未抽取的卡牌进行
2 赞
「自制卡牌游戏DIY」战斗抽卡系统(1)截图
「自制卡牌游戏DIY」战斗抽卡系统(1)
#星火编辑器 #星火编辑器入门 #星火编辑器案例 上一期我们完成了游戏的核心功能——战斗抽卡系统的设计,并将主要设计梗概用思维导图的形式清楚呈现。今天我们要着手开始用触发器编写逻辑,实现这个游戏核心玩法系统。本期车速较快,请站稳扶好! 首先我们先做好前置准备,确保已经有了“标准卡牌”类以及足以存储卡牌所需信息的各个成员变量(P2) 同样的,确认玩家信息类里面已经有了这三个“标准卡牌”数组
1 赞
「自制卡牌游戏DIY」自动生成卡牌(3)截图
「自制卡牌游戏DIY」自动生成卡牌(3)
#星火编辑器 #星火编辑器入门 #卡牌游戏 #星火编辑器小功能分享教程 我正在尝试用『星火编辑器』将一张卡牌变成一款卡牌游戏。 前面的尝试让我们顺利做出卡牌和卡牌包,并向更复杂的自动生成卡牌功能发起冲击。上期这个功能的服务端逻辑已经告一段落,这期主打客户端部分。但在此之前要从UI层面做一个生成卡牌页面的实例。点击页面上方“+”号新建页面,这里我将其命名为“卡牌选择页面”。然后在页面中新建pane
3 赞
新版的背包存档截图
新版的背包存档
舍弃老版超长代码逻辑还不好用的背包存档。想多少个格子就多少个格子不用一个格子创建一个变量,不用写一堆繁琐重复的代码。适用性更强,支持恢复到指定格子,多背包恢复 主要实现核心围绕云变量表这个类型变量来进行处理、获取用户背包栏,循环背包栏获取指定背包栏的物品存入云变量表,然后提交。 读取的话反之也是获取的云变量赋值给云变量表,循环读取背包栏并且获取格子,在将物品放入指定格子 最后附上demo地址 h
36 赞
5 回复