《王者荣耀》的操作交互设计研究

《王者荣耀》是国内最成功的手机版MOBA类型游戏。MOBA从PC的辉煌延续到了手游,当时很多人唱衰手机上的MOBA,主要还是操作上的问题,手机上无法实现鼠标的快速精确定位。为了优化手机版MOBA,大家进行了各种尝试,有触摸点击型(虚荣),有双摇杆型、单摇杆型,最终单摇杆+技能副摇杆结合的《王者荣耀》一统江湖,现在很少有人说王者手感不好的,它的很多设定都成了现在MOBA游戏的标杆。这里,我们就一步步地分解看看,王者的操作手感是如何设计的。...

《王者荣耀》的操作交互设计研究

王者荣耀》是国内最成功的手机版MOBA类型游戏。MOBA从PC的辉煌延续到了手游,当时很多人唱衰手机上的MOBA,主要还是操作上的问题,手机上无法实现鼠标的快速精确定位。

为了优化手机版MOBA,大家进行了各种尝试,有触摸点击型(虚荣),有双摇杆型、单摇杆型,最终单摇杆+技能副摇杆结合的《王者荣耀》一统江湖,现在很少有人说王者手感不好的,它的很多设定都成了现在MOBA游戏的标杆。

这里,我们就一步步地分解看看,王者的操作手感是如何设计的。

1、基本操作

我们从最简单的开始,一个单位的基础动作,无非就是以下两个:

《王者荣耀》的操作交互设计研究

王者(或是其他MOBA)严格遵循魔兽时代留下的规则:移动中,无法执行攻击动作;需要进行攻击,必须停下来,而且目标单位必须在其攻击范围内才会出手。暴雪系的即时战略游戏相当严谨地执行了这套规则。

这点区别与《孤胆枪手》、《奇幻射击》等可以同时移动+射击的双摇杆射击游戏。

《王者荣耀》的操作交互设计研究

继续延伸开,我们会发现,MOBA类游戏里,执行攻击动作前,必须先锁定一个目标。

魔兽争霸》内所有的单位都只能进行单体攻击,“溅射”、“分裂”被当成技能而存在。我们习惯“右键点击”需要攻击的目标,敌人脚下的“圈圈”就是锁定标志。

《王者荣耀》的操作交互设计研究

MOBA游戏脱胎于即时战略,“先锁定、后攻击”的特效被传承。可能有人觉得这很简单,但实际上后面的一系列攻击目标的判断,都是依托于这个框架进行展开的。

2、攻击范围

农药很贴心地把每个英雄的攻击范围标记了出来:

《王者荣耀》的操作交互设计研究

套入到之前的逻辑内, 那么攻击的判断流程如下:

《王者荣耀》的操作交互设计研究

大家看上图可能会有点蒙,啥叫“向前走几步”,具体是走几步?

如果敌人不在攻击范围内,你点了攻击键就傻站着不动了,其实明明敌人的位置也不远,向前走两步就能打到。

所以虽然你没有按移动键,系统也会“帮”你向前走几步,再执行后面的操作,这就引入了下面的这个概念。

3、警戒范围

我们先来看下图:

《王者荣耀》的操作交互设计研究

虽然木头人不在攻击范围内,但赵云也老远就锁定了它,向其发起了冲锋。

再看下图:

《王者荣耀》的操作交互设计研究

一定距离之外,赵云就不再锁定目标,原地玩起了耍花枪。

所以,英雄除了攻击范围之外,还有一个警戒范围,它才是判定是否要追击目标的依据标准。

《王者荣耀》的操作交互设计研究

警戒范围不可见,但确实存在,而且远程和近战是一样的(目测)。

《王者荣耀》的操作交互设计研究

照这样看,远程英雄需要跑动的范围小很多。

4、多目标选择

当然了,攻击范围内不仅仅只有一个敌人,就需要进行多目标的选择。

农药通过自定义设置来决定优先级:

《王者荣耀》的操作交互设计研究

这样就基本上可以解决优先级排列的问题了。此外还有一些极端情况,例如血量一样,位置也一样的情况如何判断?可以随机选择一个目标,或是其他处理方式,这样情况出现极少,这里我就不再继续展开。

由于多目标选择的锁定逻辑比较多,直接置入流程图内会比较庞大难以阅读,所以我把这部分模块单独拿出来,希望能理解:

《王者荣耀》的操作交互设计研究

这部分模块就可以单独处理了:

《王者荣耀》的操作交互设计研究

我们可以看到,两种偏好都是以“血少、最近”为原则,只是依次先后判断的区别。

针对自己英雄的特点或喜好进行选择(远程为了拉开距离减少位移,可能选择最近单位;近战或刺客为了集火点杀可能选择血少)。

5、特殊攻击按钮

虽然有了警戒范围、锁定优先级等设置,但还是有很多应用场景无法满足。

我们用“自由攻击模式(推荐)”的操作方式,经常会出现想去打敌方英雄,却在砍小兵的情况,更加致命的是,技能的释放也是同步攻击的目标的,所以会出现大招打在小兵身上的“惨剧”。

由于手机点击无法实现PC鼠标“指哪点哪”的精确定位,天美在这方面可谓是下了很大功夫,于是“自由攻击模式(进阶)”的操作方式出炉了:

《王者荣耀》的操作交互设计研究

这种操作方式说明看似简单,加入了两个单独的特殊攻击按钮(补刀、推塔),实际上,连普攻按钮的逻辑也发生了改变。

在这之前的操作方式,小兵和英雄视为等同(敌人),而功能键的加入,让其各司其职,以应对不同场景的需求(对线、团战)。

按钮有了针对敌人类型的优先级,分别如下:

普攻:英雄>塔>小兵

补刀:小兵>塔>英雄

推塔:塔>小兵>英雄

那么,“多目标选择锁定”模块相应进行修改:

《王者荣耀》的操作交互设计研究

相当于在原有的机制之上,再套加一层筛选,如果筛选目标唯一,则确定锁定目标。不唯一,就继续下层筛选。

6、特殊锁定按钮

前面几种设定的攻击按钮,实际上是把“锁定”、“攻击”两个绑定在一起,而这种操作模式,则单独将“锁定”功能剥离开来:

《王者荣耀》的操作交互设计研究

点击“小兵”、“英雄”按钮,自己的英雄不会进行任何移动或攻击动作,重复点击根据优先级,在范围内不断切换锁定目标。判断逻辑和第二种基本类似,这里就不再赘述。

锁定功能遵循,有“锁一直锁“”的原则,如果不进行特殊方式切换锁定的目标,则一直保持锁定状态。

那要如何解除锁定呢,目标死亡,消失(隐身或入草丛)或是跑远了,脱离锁定范围,就解除锁定。脱离锁定的范围比警戒范围略大,几乎都要出屏了。(也就是说,脱离锁定的范围>进入锁定的范围)

另外,王者的锁敌头像功能可谓是相当高级,看起来很别扭,实际是非常好用的,可以说,天美可真的是用尽了各种办法,最大限度地还原了鼠标操作的需求,赞一个!

《王者荣耀》的操作交互设计研究

另外,还有自动攻击,不仅仅是对单个目标的持续攻击,并且在目标死亡或消失后,可以自动攻击警戒范围内其他目标,可谓是非常用心。

今天这里介绍完了《王者荣耀》的普通攻击逻辑,仅仅普攻就有这么多小心机设定。如今大热的各类吃鸡手游,虽然各种操作不便,但依然对其有信心,因为大家相信,只要有设计师的精心设计和持续的版本迭代,就没有满足不了的需求。

今日推荐

多人游戏关卡设计视觉化指南

好用大于好看?关于游戏UI界面设计的思考

十分钟,看懂研发、发行和渠道的那些事儿

一键添加

《王者荣耀》的操作交互设计研究
《王者荣耀》的操作交互设计研究

加小编微信,享双重福利

1.加入GAD策划交流群,获取行业干货;

2.领取17G腾讯内部分享等独家策划资料。

《王者荣耀》的操作交互设计研究

《王者荣耀》的操作交互设计研究

原创文章,作者:交互精选,如若转载,请注明出处:https://www.iamue.com/35357/

(0)
交互精选交互精选
上一篇 2018-02-26
下一篇 2018-02-26

相关推荐

  • 产品经理必修课:那些隐藏在界面里的交互设计

    投稿作者:温晴公众号“爱累加”首发我们在做交互设计的时候,一般都是通过线框图和文字说明进行展示,有时候遇到一些复杂的功能我们还需要配上流程图进行补充说明,详细的全方位的交互设计文档不仅可以让研发人员方便的投入工作而且还可以让测试人员清楚的了解产品功能,方便测试细节。但是有时候我们会遇到一些无法用线框图展示出来的需求,但是又会经常遇到,下面分享给大家一些界面上看不到的交互设计。案例一用户A在使用一款应用程序的时候,突然网络断开了,那么这时...

    2018-05-05
  • 【18应届报考北师大map用户体验方向】经验分享贴

    BNU学习小组互助互帮,轻松考取北师大,我们团队致力于为报考北师大MAP心理学专业的学弟学妹提供最精准的专业课辅导,官方微信:yanni513351。QQ:2194691060。专业课方面:普心、社会心理学我主要是看书背知识点,这两门课不难理解,看书熟悉内容以后将知识点背熟就可以,另外要通过做题检验自己的程度。测量心理学、实验心理学和统计心理学这三门课注重理解,尤其是统计心理学,要将每个知识点弄懂是什么意思,再做题巩固。而实验心理学重点...

    2018-04-15
  • Axure RP软件 | UI设计师的必备神器,20G视频教程+软件+实战素材

    直达链接:http://www.xiaobaixitong.com/(复制电脑粘贴下载)在浏览器上百度搜索【小白】即可找到,点击带有官网标志的链接哦,其他的均为山寨软件哦Hi,我叫小白,可以协助你安装电脑系统哦小白公众号一直在做的两件事:1.协助用户安装windows系统2.分享海量的学习资料包(相信聪明的你应该知道去哪里找的)三年来,小白一直专注于电脑系统安装已经免费为数钱千万用户成功安装上系统操作界面用小白成功安装上,系统后简直不要...

    2018-04-04
  • 掌握交互设计思想,从用户视觉心理开始

    什么是交互设计师?在刚刚开始研究交互的时候,我也经常问自己:什么是交互设计师?这两年“用户体验”这个词非常火,以前在技术沟通中经常生硬的用“用户体验”这个词来说服技术,难免有些空洞。其实用户体验不止于产品的交互设计有关,还包含产品的内容和服务、表现形式,大部分情况下产品的内容和服务才是整个用户体验的核心。而我所理解的交互设计就是把表现形式、内容和用户行为相互协调的一门学问,是影响用户体验的关键因素之一。另外,按国内就业情况来看,目前交互...

    2018-04-26
  • 聊聊Axure RP 8 的动态面板(文末赠书)

    点击上方“蓝字”关注本公众号《Axure RP 8入门手册》本书的写作初衷是面向初学者,由浅至深地引导读者学习Axure RP 8.0的使用方法,从而实现最终的学习目标。本书不但适合初学者学习,在知识结构与案例的安排上,也非常适合工作中的查阅与参考。初学者只需要按照从前至后的顺序进行学习,就能够迅速、全面地掌握原型开发技能。具备一定原型开发基础的读者,也能够在本书的大量案例之中,获得各种实战的参考。书中的案例均为网站或App中采用的一些...

    2018-04-09
  • Fitbit:一份用户体验案例研究

    当谈论到锻炼时,这个世界上有三类人:每时每刻都在健身的健康达人;那些一天中全部锻炼内容就是从前门走到车里,每天在沙发看电视的人们;在这两者之间,想变的健康强壮但缺少一些动力去健身房的人(又称在屁股上踢一脚才行动的人)。 我,和我知道的大多数人一样,都是第三种类型的人。我们被称为是

    微信热点 2018-03-31
  • 如何在Sketch中快速创建调色板?

    今天我将会教你如何在Sketch中快色的创建调色板。这是个很棒的技巧,是年前我从Marc Edwards那里学到的。首先我们先创建三个正方形,它们是可以被三整除。在我们的例子中,我们将先创建一个240pt高和240pt宽的正方形。我们将重命名这些图层为红色、绿色和蓝色。让我们将红色图层的填充改为#FF6161,绿色图层为#4F953B和蓝色的图层为#0076FF。选中这3个图层,然后按“A”快捷键来选择画板工具。我们现在从右边的检查器上...

    2018-04-17
  • 用户体验和可用性之间的联系和差异,你都知道吗?

    本文转自本文由优设网作者 :Amy Smith,版权归作者所有阅读需 5 分钟Amy Smith – 最近几年来,用户体验设计逐步成为了目前设计圈中广泛认同的重要设计环节。而“可用性”这一词也作为改善用户体验设计的重要度量而发挥着无与伦比的作用。于是乎,除了“用户体验设计师”这一职位,在欧美的产品和设计团队当中还诞生了“可用性工程师”这样的专业职位。另一方面,这些相互关联,在含义和功能上有所重叠的专业词汇,让许多设计师和相关的从业者感到...

    2018-03-03
  • 交互设计 | 这到底是交互设计还是黑科技?

    Create Your Difference.           by CYD01能看透你的灯光今天创艺典与你分享的交互装置不再是学习你、跟随你的灯光装置了无论你怎么装高冷当面瘫今天的它能把你扒光把你一览无余地看透我觉得你必需服Aura这是Aura,一个视听和互动装置它解读和翻译人类的情感,然后将其转化成发光窗帘光的强度、形状和颜色会随着人情绪的变化而精确地改变这样的绿,或许代表了平静而这位哥们儿的绿,恕我直言,或许是一种失恋的绿这样...

    2018-04-30
  • 奥斯陆建筑学院国际建造课程招募!| 2018楼纳教育启航

    📌 编辑 | YHz奥斯陆建筑与设计学院(AHO)位于挪威首都奥斯陆,是挪威顶尖的建筑学院,也是挪威研究型大学系统中的自治机构。学院提供建筑与工业设计领域的教育,在建筑教育领域有很大影响力。- 课程背景 -2018年4月,奥斯陆建筑与设计学院(AHO)将首次在中国楼纳开设建造课程——“传统木构节点的数字化演绎”工作坊,将由于2012年在奥斯陆建筑与设计学院成立的Scarcity and Creativity Studio(以下简称“SC...

    2018-03-13