加入收藏 | 设为首页 | 会员中心 | 我要投稿 衡阳站长网 (https://www.0734zz.cn/)- 数据集成、设备管理、备份、数据加密、智能搜索!
当前位置: 首页 > 综合聚焦 > 网络游戏 > 网页游戏 > 正文

关于手游技能的UI设计

发布时间:2020-03-18 23:07:17 所属栏目:网页游戏 来源:站长网
导读:副标题#e# 一、背景 现在是一个手游时代,很多的端游都移植到了手机上,这里会面临一个问题,如何把端游上的大量技能放置在手机小小的屏幕上,同时让玩家的操作舒适,又能够快速精准的释放技能。在这里我总结一些游戏的思路。 二、MOBA类 2.1 这里以王者荣
副标题[/!--empirenews.page--]

  一、背景

  现在是一个手游时代,很多的端游都移植到了手机上,这里会面临一个问题,如何把端游上的大量技能放置在手机小小的屏幕上,同时让玩家的操作舒适,又能够快速精准的释放技能。在这里我总结一些游戏的思路。

  二、MOBA类

  2.1 这里以王者荣耀作为一个例子,首先,MOBA的端游设定,是一个英雄拥有:4个主动技能,1个被动技能,2个召唤师技能,若干装备技能,1个插眼技能。在这里,王者荣耀为了游戏的简易性,对英雄的技能拥有做了改变(暂时讨论大部分英雄):3个主动技能,1个被动技能,1个召唤师技能,1个装备技能(如果出了多个主动装备的话会被覆盖),没有插眼技能。我们来看一下王者战斗时的UI:

关于手游技能的UI设计

  一、二、三技能:表示英雄拥有的三个技能,一二技能为普通技能,4级之前就能够学习,三技能为大招,4级才能学习。这里可以想一下,为什么大招要放在普通攻击按键的上方。首先,这个游戏中,普通攻击是最常用的,所以,在你横屏手持手机时,你的两个大拇指所自然放置的位置下方(一般人手持的话,大拇指会在手机屏幕中间,因为中间和上方都要显示信息,所以只能把操作的大部分放置在下方,保证手不挡住视角),左手拇指就是移动键,右手拇指就是普攻键。那么我们回到一三技能的问题上,现在你的右手放置在普攻上,向左和向上移动,观察一下整只手的协同幅度,你会发现你上下移动的幅度会大于左右移动。这里就是为什么大招是要放在普攻键上方,因为大招的特性决定的:冷却时间长(大部分英雄)导致使用次数少。现在的一个优化是,英雄的3个技能都可以由玩家切换位置,因为有的英雄,比如露娜,娜可露露,赵云等的大招,都是需要大范围拖动的,控制不好就会拖动到取消区域,导致错失良机,所以这一类英雄的大招在高玩的手中可能会在二位置,防止出现误操作。

  推塔,补兵按键:普攻键的子功能键,所以依附在普攻键的周围。这个是我个人常用的方案,我的主玩位置是射手,推塔按键对我来说是很重要的,在推水晶的关键时刻,如果你身为一个射手还在用普攻键攻击英雄/小兵,是会被队友喷死的,在游戏中,普攻键的优先级为:英雄>小兵/野怪>防御塔/水晶。

  召唤师技能列:图中的惩戒按钮,位置为一技能的左边。在游戏中,召唤师的技能冷却为30-120秒,在冷却时间上来说,是偏久的,召唤师技能在设定上,是一个偏辅助的技能,但是在关键时刻也能有很大的作用,例如大闪,群奶。所以在下一排的三个技能中(还有回城,恢复),召唤师技能的位置必须要最靠近一二三技能。剩下的两个技能按照使用的频率依次向左排列。

  三、MMORPG类

  3.1 完美世界手游

关于手游技能的UI设计

  完美世界手游人物拥有的技能:普通技能10个(包括一个普攻和一个躲避技能),图中红色方框内,真元技能3个,图中黄色方框内,一共是13个技能。普攻技能仍然是在最中心,但是,在这个游戏里面普攻其实并不是最频繁使用的一个技能,也就是说,普通没有必要放在最中心的位置。各个技能的使用频率是按照CD决定的,你用完一轮技能后,第一个使用的技能CD又好了,在这个过程中是不需要普攻的(看普攻和技能的dps决定是否要在技能中穿插普攻)。所以,UI在设计的时候可能是按照用户的常用习惯而不是技能释放的实际需求来设计这个UI。现在来看一下这8个技能是如何切换的

关于手游技能的UI设计

  图中的白色区域4个是一组,当玩家用大拇指以半圆姿势划过白色的圆圈时,技能会切换到下一组(轮盘动画),这样就切换到了另外的4个技能。那么你怎么知道未显示的技能CD已经完毕了呢?

关于手游技能的UI设计

  看图中的二技能的,当技能冷却完毕之后,会在相应的技能位置出现技能的阴影图示,大概出现半个圆的区域,1秒之后移动回原位置。这么做有一些弊端:

  大拇指可能会挡住提示

  出现提示的时间大概1秒左右,玩家可能没有即时注意到

  那么我们在看看轮盘切换型技能UI的优缺点

  优点:

  右下角的技能显示少,显得简洁

  缺点:

  转换轮盘提升了操作量

  CD完毕提示不明显

  我个人认为只要右下角安排合理,空间是足够放置8个技能的。在修改之前,我们看看右下角还有什么功能。

  4技能右边的准心:改变当前选择目标,例如在boss召唤小怪时优先击杀小怪时使用。

  普攻键右下角的跳跃。在副本中,这个技能的使用频率几乎为0,因为设定中跳跃是不能躲避攻击的,在战斗中也没有对跳跃这种功能的互动,所以跳跃键的加入是画蛇添足的。

  4个技能左边的躲避键,躲避键的设定在这种UI设计中,我认为是合理的,在战斗中,你可以通过躲避键躲避boss的技能,如果是放在轮盘中的话,你要躲避之前可能要滑动轮盘才能使用,增加了操作量。所以躲避技能独立出来的设计是合理的。

  黄色区域的三个真元技能。在完美世界中,真元技能的释放需要通过普通技能的释放积累真元,逻辑如下

关于手游技能的UI设计

  在实际的游戏体验中,大概30秒能够积累200真元,才能满足技能的释放,同时真元的上限是400,决定了一定时间内最多可使用2个技能,所以把真元技能放在普通技能之外的位置是合理的。

  药品快捷使用键

关于手游技能的UI设计

  如图分别是78和80的所示位置,这里官方的设定是安排了两个药品的快捷使用键,相对于MOBA游戏的话则是恢复键。完美世界中,瞬间恢复药品的使用CD是90秒,一般情况下,瞬间回血的需求会比较高,包括副本,PK。而瞬间回蓝的需求几乎为0(我玩的职业法师同时使用了对应等级的持续恢复蓝量药品,游戏中也没有职业技能能够减少敌对玩家的蓝量,所以瞬间回蓝药品的设定只是为了和瞬间回血组成一对罢了)。所以一个位置放置瞬间回血药品,另一个位置可放置一些功能药品,例如:

关于手游技能的UI设计

  四、如何设计好的技能UI和我的理解

(编辑:衡阳站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

推荐文章
    热点阅读