首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

泰坦黎明(Dawn of Titans)UI设计师分享

对于手机游戏而言,游戏的规模及其内容的深度是巨大的,而该项目所带来的挑战至少也是如此。

我是UI团队的一员,不仅在视觉方面,而且在技术问题和解决方案方面都学到了很多东西,并且有机会进一步扩展了我的知识。

我只想对UI团队的其他成员表示感谢,因为他们的贡献对于您将在此处看到的设计至关重要:工作室是一个充满活力的环境,我们一直在互相提供和接受彼此的设计。我个人一直在努力提高自己的风格,并向其他成员学习,因为他们不断提高标准。

工作模式

我最喜欢的任务之一就是创建一系列可以在整个游戏中反复利用的模式。首先要做的是隔离单个图形元素或模块,可以将其复制以形成图案。为此,并赋予游戏界面,利用通用元素实现的早期设计。

在这里,您可以看到模块以及如何组装它们的各种示例。图案已被限制为与游戏按钮尺寸相同的矩形。

UI元素

下一个和已完成的操作

在这里,您可以看到我为游戏的HUD设计的一些元素,并带有不同的图形处理。图片的下半部分页脚元素,用到的是上图一些设计的模式是如何使用在设计中。

UI元素

建筑物标签

在用户界面的一种迭代中,玩家可以构建和管理的各种建筑物都由标签标识。每栋建筑均由一个图标标识,并且大多数都可以升级。在某些情况下,需要一种特殊的状态,例如“在训练中托管一个部队”。绘制这些图标是一个挑战,而且很有趣,因为设计图标始终是我最喜欢的任务之一。

UI ELEMENTS

泰坦卡牌界面是该项目最重要的功能之一,并且可能是整个游戏的核心,它经过了多次修订。在这种特殊情况下,我重新设计了指示其状态的横幅,并构思了一个新的泰坦老虎机设计,以符合当时的游戏风格。

准备战斗

整个项目中最有趣的挑战之一就是应对其复杂性:尽管它是一款手机游戏,但仍有许多信息需要显示,在这一方面,游戏的深度通常与游戏机相关或PC游戏。问题是,由于可读性或技术问题,在移动设备上您的屏幕要小得多,并且存在一系列限制。

在这种情况下,要显示的信息可能会使玩家感到困惑,因此在重新设计此面板时,我尝试把简化作为这里非常重要的概念。

在下面的图像中,您还可以看到我研究了不同的场景,具体取决于游戏的进度,并且我尝试使其保持可读性和整洁性。

我需要设计这个特殊的弹出窗口,同时要牢记其内容将由另一个人来管理,并且需要适应许多布局。设计准备就绪后,我将整理出一系列规则和建议,这些规则和建议如下图所示,可以在不破坏弹窗结构的情况下指导玩家继续以下内容。

升级

升级时刻需要为玩家庆祝,但游戏还需要传达许多信息。因此,我设计了一个元素,该元素将分为两个阶段:首先,带有新级别编号的大横幅将出现在屏幕中间,然后将其缩小为弹出窗口的标题,会告诉玩家他们在游戏中获得了哪些奖励。

人们还赞赏这个概念,因为它会使用团队设计的弹出模板作为起点,在UI当时使用的各种模板中创建一些独特但可识别的东西。

其他弹出窗口

在这里,您可以看到我为游戏设计的弹出窗口的一小部分。创建可以在许多不同情况下和不同类型的内容中重复使用的东西。

您还可以查看游戏UI的一次迭代到下一个UI的变化。

捆绑弹出商店窗口

当我开始使用Starter Bundle弹出窗口时,我牢记这一理念。目标是创建足以被识别的独特内容,但这也遵循UI样式。它还需要足够灵活以包含不同类型的内容,并且需要以一种清晰易懂的方式进行显示。还应考虑技术限制:例如,我们构建图像的方式(在何处以及如何放置图像以充分利用透明边框)及其最大尺寸。

产生了多种变体之后,这就是设计被认可的方法。

在下面的图像中,您可以看到如何将设计转换为类似卡片的格式。那时,我还在研究屏幕的总体布局以及所显示的其他元素(例如Gems卡)的设计。

是玩家在游戏中可以获得的特殊物品,可以使他们有机会根据其王国的经济或直接为他们的泰坦队解锁特殊能力。

自从我从《泰坦黎明》开始工作之初,我看到了它们从简单的功能到复杂的游戏功能的演变。您可以看到有四种不同的稀有度,分别由不同的颜色,数字和徽章来标识(随着卡的稀有度的增加,其变得越来越复杂)。图标告诉玩家他们正在看什么类型的神器。不同类型的遗物需要不同的文字处理,但是它始终会在特定阈值下变成红色,告知玩家特定的卡即将过期。

在下面的行中,您可以看到可用于文物的各种插槽。

专用弹出窗口

在这里您可以看到与文物相关的弹出窗口的选择。通常,但也许特别是在这些设计中,您还可以看到我对将两种不同方法合并到同一设计中的可能性着迷,一种方法更具装饰性,另一种则更加简洁抽象,试图查看它们的对比是否会在视觉水平上工作。

在“添加遗物弹出窗口”上选择的效果是一种脉冲动画,它会逐渐淡入淡出,并在此处以最大不透明度表示。

相关清单

游戏中收集的所有文物将存储在库存中。在这里,您可以看到与上面显示的屏幕样式完全不同的屏幕版本。那是因为游戏在不断发展,UI团队一直在寻找更有趣的视觉方法。

该屏幕是文本最密集的屏幕之一,要找到一个可以确保可读性并避免本地化问题的良好视觉解决方案并不容易。

我还需要考虑到,由于显示的组件数量过多,此屏幕可能会极大地影响性能(可能播放器可以无休止地滚动),因此我尝试使面板尽可能轻。

RELICS融合/修复

这是我从头到尾一直使用的最大功能之一。接下来,您将看到一组旨在研究此特定功能流程的设计。在此阶段,我仅专注于需要显示的信息和可以使用的交互类型。

在下方,您可以看到完成的屏幕,从左侧面板中选择了一个遗物。在选项卡中,您会注意到三种卡中只有两种可用,因为在此特定屏幕中无法使用第三种卡。

RELICS寺庙和文物

开幕草图

当《泰坦黎明》开始查看其所有屏幕以使UX更加流畅时,我被要求就可能的新流程或圣殿的新表示形式勾勒出一些想法,玩家可以在那里获得日常工作遗物或购买新的。

我想出了不同的场景,来自不同的灵感,但是与我们现有的方法相比,这种通用方法绝对是三维的。在某些情况下,我建议使用新型的交互方式,在这种情况下,触觉方面更为重要:通过在手势和游戏行为之间建立联系,这还可以为玩家带来更丰富的体验。

不幸的是,我没有时间进一步探索这些解决方案。

用户体验重新设计

这里显示了在《泰坦黎明》的UX重新设计阶段设计的一些线框。

从上到下,您可以看到三个不同的区域:具有排行榜和奖励进度的事件,具有各种模板选择的弹出窗口以及具有展示台页面新结构的商店,可以使您水平访问旋转木马。

UX

草图最后,您可以在这里以快速草图的形式看到更多的UX部署,在这里我很有趣,试图找出引导玩家从不同起点进入战斗的新有趣方式。

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20210108A0DS4G00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券