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

《王者荣耀》是国内最成功的手机版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

相关推荐

  • Axure绘制专题页原型

    专题策划对于SEM至关重要,如果策划及文案都搞定了,接下来如何与设计进行沟通呢,这篇文章我们一起聊聊专题页原型绘制的话题。一、Axure界面介绍Axure的使用极其简单,只需要几个拖拽动作就可以基本搞定。接下来我们实际上手用学历教育的例子,带大家一起来看看。绘制这个原型可以分为两步,首先是手机的绘制,然后是文案内容的绘制。左侧面板(快捷键:Ctrl+Shift+[),主要是元件库,将需要用到的元件,直接拖拽就可以。右侧面板(快捷键:Ct...

    2018-03-04
  • 联想实习 | 手机事业部招聘交互设计实习生

    公司简介联想是一家营业额达460亿美元的《财富》世界500强公司,在全球消费、商用以及企业级创新科技领域居领先地位,为用户提供安全及高质量的产品组合和服务,当中包括个人电脑﹙经典的Think 品牌和多模式YOGA品牌﹚、工作站、服务器、存储、智能电视,以及一系列移动互联产品如智能手机﹙包括联想和摩托罗拉品牌﹚、平板电脑和应用软件等。招聘岗位手机事业部-交互设计实习生岗位描述1. 参与联想ZUI手机操作系统的交互设计;2. 参与产品的规划...

    2018-04-21
  • 交互设计:谈谈那些极具争议的设计方法

    作者:中大yzh全文共 2556 字,阅读需要 6 分钟———— / BEGIN / ————交互设计是一门有关设计学、用户心理学、图形学和计算机理论的综合型新兴领域,由于其及其复杂的学科交叉性,以及在不同的情景下,对同一类组件的要求经常会有所不同,导致目前在该领域内有时会出现一些看似正确其实极富争议的设计方法。在这里,我们就讨论一下这些具有争议的设计方法。争议方法1:在线填表时应该标注“可选填”的填表项在线填表时,需要在表格上面注明“...

    2018-02-01
  • 国际用户体验设计论坛邀请函

    点击上方蓝字关注我们国际用户体验设计论坛暨中国工业设计协会用户体验产业分会第一届理事会预备会!  开始报名啦  !官方海报如下👇报名方式一👇长按识别下方二维码,通过报名页面报名👇报名方式二点击文章最底部“阅读原文”,通过H5报名页面完成报名了解我们关注我们长按下图二维码关注“UXE优艺智造”这里有最新的行业动向最前沿的学术研究来一探用户体验的商业价值吧联系我们电话15868193198邮箱uxestudy@126.com欢迎投稿

    2018-03-30
  • WEB用户体验

    点击标题下「智业人」可快速关注摘要:随着软件行业的迅速发展,各种软件产品更是形形色色,用户不再满足软件对其所需要的功能实现,更追求一种使用过程中的心里感受,因此用户体验足够好的才能走向最前端。用户体验的定义有很多,用一种比较简单的说法就是“用户对访问网站的感受”。本文主要从用户体验角度出发,从网站的构建到数据渲染完毕的过程提高用户体验。关键字:加载速度、动画、用户体验、布局一个好的网站离不开对用户体验的追求。因为良好的用户体验才能增加用...

    2018-02-03
  • 交互设计套路之——导航设计

    当前浏览器不支持播放音乐或语音,请在微信或其他浏览器中播放Five Hundred MilesThe Shadows - Dance With The Shadows/The Sound Of The Shadows亲爱的小伙伴们好久不见啦你们的涂涂回来啦!!不知是时间太快还是指缝太粗总是留都留不住总之感谢小伙伴们的不离不弃话不多说赶快准备好小板凳和瓜子嗑着瓜子咱们就开聊吧下面开始分享app的套路之一导航设计一、导航的分类1.标签式导航...

    2018-02-11
  • 干货!Sketch49交互原型新功能大解析

    2月28日发布了Sketch49新版本的消息,笔者打开了官网看到了最新的版本更新视频,确实还是挺激动的。觉得Sketch按照这样的发展趋势,马上就能“统一六国”了,哈哈。一起来看看Sketch49的版本更新了哪些新功能吧!(先看介绍,使用教程在后面哦!)亮点一:交互原型功能画板(Artboards)和热区(Hotspot)链接实现页面间的跳转,实现动态交互原型(类似交互软件Marvel中的热区链接 )Sketch49版本中的交互原型预览...

    2018-03-07
  • 02.案例:用户体验与结婚教练 | 打造产品思维30讲

    02.案例:用户体验与结婚教练来自时间前哨00:0017:10用产品经理的视角来看人今天我想讲一个结婚教练的故事。她是我的一个朋友,现在做的工作就是指导30多岁下定决心要结婚的女生,如何能够在一年半之内搞定结婚。她的方法已经帮助了30多个30多岁的女生完成了结婚。这个结婚教练以前是干什么的呢?她以前是一个互联网公司的产品经理。她的这一套结婚的体系内容挺多的,这堂课我想把她最重要的一个环节拿出来分享。这个环节就是如何观察和判断一个人。因为...

    2018-02-14
  • 交互设计的知识体系架构 做好产品与人的“翻译官”

    面临毕业季想从事交互设计这个行业,但毫无头绪?交互设计是什么鬼?工作一段时间发现转业交互设计,一直找不到学习的途径。接到一个需求,兴奋地开始画图,提交后产品和开发向你提出一大堆问题,你不停自否定的改图陷入死循环。互联网交互行业越来越受到追捧,看似入门的门槛很低,会画线框图就可以了。事实上交互设计师大部分是输出抽象方面的东西,对象是行为。一位知名人士曾将人与系统交互的过程分为五个要素:用户、行为、目标、场景、媒介,这些你曾了解过吗?这次M...

    2018-02-09
  • 交互设计申请关注度最高的5个问题,第一个就头疼.. | 大咖说

    说到交互设计很多同学的第一反应就交互思维、交互体验...准备申请交互专业的同学也是非常心焦!说起来容易做起来难,我们还是多和专业老师取取经。伦艺学姐回答的5个交互专业问题,收好哦~Q1:转专业学生申请应该注意什么?我觉得需要看这个问题怎么定义转专业,因为在一个设计类的学科,很多设计的思维方式和实践能力是共同的,我们可以通过设计的方式去解决问题。如果想要转到交互或者用户体验的专业,其实提供的是一种用交互的方式和研究结果解决现有用户的问题。...

    2018-04-26