一款真正的金钱休闲游戏应用程序MGPL-用户体验案例研究

At Totality Corp, our core mission has always been to build products which help people to add fun into their lives. When I first joined Totality almost 2.5 years ago I was assigned for this particular project MGPL- Mobile Gaming Premier League where you can select the game of your choice and compete with real people and if you win the game you win the reward. We already had private beta 1 & 2 releases and had some users using the product now we’re planning to release the public beta.

在Totality Corp,我们的核心使命一直是开发有助于人们增添生活乐趣的产品。 大约2.5年前,当我第一次加入Totality时,我被分配参加了MGPL-移动游戏超级联赛这一特殊项目,您可以选择自己喜欢的游戏并与真实的人竞争,如果赢得比赛,您将获得奖励。 我们已经有私有beta 1和2版本,并且现在有一些用户在使用该产品,我们正计划发布公共beta。

I’ll be discussing how we solved challenges and designed MGPL from public beta to production serving 2M+ players. Keep reading.

我将讨论我们如何解决挑战并设计MGPL,从公开测试版到面向2M +播放器的生产。 继续阅读。

了解产品 (Understanding the product)

Product idea was very simple, product has a minimal game store where you can select a game of your choice and compete with any real opponent of your similar skill level. We matched players of similar skill based on elo rating system. You can either play with coins or play with real money.

产品的想法非常简单,产品拥有最少的游戏商店,您可以在其中选择自己喜欢的游戏,并与具有类似技能水平的任何真正对手竞争。 我们基于elo评分系统匹配了具有类似技能的球员。 您可以玩硬币或玩真钱。

MGPL basically had —

MGPL基本上有-

  • Multiple games

    多个游戏
  • Different tournament types

    不同的比赛类型
  • Play with coin or real money

    玩硬币或真钱
  • Skill based match-making

    基于技能的比赛

Below was the happy flow of core function in MGPL private beta 1 —

以下是MGPL私人Beta 1中核心功能的快乐流程-

Image for post
Happy flow of MGPL Private Beta 1
MGPL私人Beta 1的快乐流程

In further private beta releases this flow has been improved to reduce steps and make it a one step process. We further improved the experience in public beta of MGPL. Will get back to it, stay tuned.

在其他的beta版中,此流程得到了改进,以减少步骤并使其成为一个步骤。 我们进一步改善了MGPL公开测试版的体验。 会回到正题,敬请期待。

了解用户 (Understanding the users)

In my experience I’ve found that watching what our users do is much more helpful than actually talking with them.

从我的经验中,我发现观察用户的行为比实际与他们交谈更为有用。

We had just started and had around 10K users but it was more than enough to understand them. Our users were mostly in bracket of 18–24 and 25–34 age group, two different type of users had different needs and motivations. We wanted to focus our efforts so decided to first focus on 18–24 as it was our most engaged age group. Target persona was decided and our further developments were focused for this particular set of users.

我们刚开始时有大约1万名用户,但了解他们已经绰绰有余。 我们的用户大多位于18-24岁和25-34岁年龄段,两种不同类型的用户具有不同的需求和动机。 我们想集中精力,因此决定首先关注18-24岁年龄段,因为这是我们最活跃的年龄段。 目标角色已确定,我们的进一步开发针对此特定用户。

We had analytics in place so understanding their behavior was easy. Analytics was targetted around one metric i.e. number of game plays. In our experience we’ve found that watching what our users do is much more helpful than actually talking with them. This doesn’t mean that talking didn’t help us, in fact it gave us a really good idea about their environment and established an emotional connect. This was going to help us in the long run. I made different buckets of users to talk to them —

我们已经进行了分析,因此了解他们的行为很容易。 分析的目标是围绕一个指标(即游戏次数)进行。 根据我们的经验,发现观看用户的行为比与他们实际交谈​​要有用得多。 这并不意味着谈话对我们没有帮助,实际上,这给了我们关于他们的环境的真正好主意,并建立了情感上的联系。 从长远来看,这将为我们提供帮助。 我让不同的用户群与他们交谈-

  • Highly engaged active players playing with real money

    高度投入的活跃玩家玩真钱
  • Highly engaged active players who never played with real money

    高度投入的活跃玩家,从未用过真钱游戏
  • Players who played first set of games and left

    参加过第一盘比赛并离开的球员
  • Highly engaged players who left the platform

    离开平台的高度参与的玩家

We had the set of indicators for high engagement using which we created buckets and talked with them one by one.

我们拥有一套高参与度的指标,通过这些指标我们创建了广告系列并与他们进行了逐一交谈。

为什么创建这些特定的用户存储桶? (Why did I create these specific user buckets?)

Image for post
Understanding users: user-buckets and direct impact on product
了解用户:用户群以及对产品的直接影响

We all are big fan of Simon Sinek, so yeah asking why has been a ritual. If you haven’t joined him yet. Here’s a video for you .

我们都是Simon Sinek的忠实拥护者 ,所以是的,问为什么是一种仪式。 如果您还没有加入他。 这是给你的视频

Okay let’s get back to the point, why did I created these buckets? Answer is clear these were directly related to some of our biggest challenges. Understanding these users was going to provide a direction for us. We analyzed the analytics as well as the information I collected by talking to them to understand their

好吧,让我们回到点,为什么我创建了这些存储桶? 答案很明显,这些与我们最大的挑战直接相关。 了解这些用户将为我们提供指导。 通过与他们交谈以了解他们的分析,我们分析了分析以及我收集的信息

  • Needs

    需求
  • Motivations

    动机
  • Pain points &

    痛点 &
  • Gains

    收益

After analyzing all the collected data, we found important user patterns which were going to change the shape of our product in future. We also found problems that users were facing with the current product.

在分析所有收集到的数据之后,我们发现了重要的用户模式,这些用户模式将在未来改变我们产品的形状。 我们还发现了用户当前产品所面临的问题。

问题 (Problems)

After analyzing both quantitative and qualitative data we received, we had a huge list of issues, problems and feature requests which we had to work on before we release the public version.

在分析了收到的定量和定性数据之后,我们发布了大量问题,问题和功能要求的清单,在发布公共版本之前,我们必须进行这些工作。

Image for post
Notes of User’s feedback and comments & solutions that we implemented
用户反馈的注释以及我们实施的评论和解决方案

This is the fun part where we use our ninja design techniques to find out patterns within the problems and come up with the potential solutions. After analyzing both quantitative and qualitative data we received, we had a huge list of issues, problems and feature requests which we had to work on before we release the public version. We cannot do everything at once right, we started focusing on the main issues and converged a bit more. We grouped our problems in 4 main categories—

这是一个有趣的部分,我们使用忍者设计技术找出问题内的模式并提出可能的解决方案。 在分析了我们收到的定量和定性数据之后,我们发布了大量的问题,问题和功能要求列表,在发布公共版本之前,我们必须进行这些工作。 我们不能一次完成所有事情,我们开始专注于主要问题,然后进行了更多融合。 我们将问题分为4个主要类别:

  • Brand awareness and Trust issues

    品牌知名度和信任问题
  • Transactions related issues

    交易相关问题
  • Communication and Support issues

    沟通和支持问题
  • Usability, Visual Design and UX issues

    可用性,视觉设计和UX问题
Image for post
Problems Affinity map
问题亲和力图

品牌知名度和信任问题 (Brand awareness and Trust issues)

We didn’t have a strong social media presence or brand identity, users were hesitant to put money on a new platform. We were doing things right and we felt that we need to have a strong brand presence as well to create a perception and a good impression in their mind. People were having doubts whether they’re getting genuine players or bots, they used to withdraw their winnings as soon as they get it. This was all indicator that we were having a significant trust issue.

我们没有强大的社交媒体形象或品牌形象,用户不愿意在新平台上投入资金。 我们做得正确,我们认为我们也需要拥有强大的品牌形象,以在他们的脑海中建立一种感知和良好的印象。 人们对是否要获得真正的玩家或机器人感到怀疑,他们过去常常一获得钱就撤回奖金。 所有这些都表明我们遇到了重大的信任问题。

交易相关问题 (Transaction related issues)

Our product has a very high amount of transactions happening every second, some third party services were also involved in the payment infrastructure and if anything went down, people had to face some kind of transaction issues. We had our own wallet named MGPL wallet where people can collect their winnings to withdraw or add more money to play new games. So every interaction with the core function of product required some kind of money transactions and people had a lot of issues there as well.

我们的产品每秒发生非常大量的交易,支付基础结构中还涉及一些第三方服务,如果出现任何问题,人们将不得不面对某种交易问题。 我们有一个自己的钱包,名为MGPL钱包,人们可以在其中收集奖金以提取或增加玩新游戏的钱。 因此,与产品核心功能的每次交互都需要某种货币交易,并且人们那里也有很多问题。

沟通和支持问题 (Communication and Support issues)

In an ideal world we should not be having any kind of issues, but in reality there are far more complexity involved than we see on the surface of any product. Although we try to minimize the moving parts within the system there are some issues that might still show up. We found that we were missing a clear and transparent communication with the users for the issues they’re facing and lack of necessary support to help them solve those issues. We were happy that we took it as a challenge to solve it within the limited resource and time constraints.

在理想的世界中,我们不应遇到任何问题,但实际上涉及的复杂性要比我们在任何产品表面看到的复杂得多。 尽管我们试图最大程度地减少系统中的活动部件,但仍有一些问题可能仍然存在。 我们发现,对于用户所面临的问题,我们缺少与用户的清晰透明的沟通,并且缺少帮助他们解决这些问题的必要支持。 我们很高兴将它作为在有限的资源和时间限制内解决它的挑战。

可用性,视觉设计和UX问题 (Usability, Visual Design and UX issues)

We kept running the public beta and receiving feedback. We watched user sessions, observed how are they using the app and their repeated behavior in the app. Differences in user journey of a first time user vs a returning user. We also felt that there’s an experience gap when you are in app and when you hit play and open the game, it’s not seamless. Moving in and out from an app into a game and back to app. This happening multiple times in one session has rough and inconsistent experience.

我们一直在运行公开测试版并收到反馈。 我们观看了用户会话,观察了他们如何使用该应用程序以及它们在该应用程序中的重复行为。 初次使用者与回访使用者的使用者旅程差异。 我们还感觉到,当您在应用程序中时,当您点击播放并打开游戏时,体验之间就存在差距。 从应用程序进出游戏并返回到应用程序。 在一个会话中多次发生这种情况时,会有粗糙和不一致的经验。

I will be going through all of these main group of problems and how did we tackle them one by one. They’re interrelated, solving one issue was going to help solve another issue e.g. if we make our communications better it will help us increase the trust with the brand.

我将介绍所有这些主要问题,以及我们如何一一解决。 它们相互关联,解决一个问题将有助于解决另一个问题,例如,如果我们改善沟通,将有助于我们增加对该品牌的信任。

解决方案 (Solutions)

Image for post
A natural process of problem solving
解决问题的自然过程

We followed a very simple and natural process for problem solving. We have a lot of design frameworks and processes but thinking from the first principles never disappoints us.

我们遵循了一个非常简单自然的过程来解决问题。 我们有很多设计框架和流程,但是从第一原则的思考永远不会令我们失望。

We converged from having a huge list of issues, problems and feature requests to a very focused set of problems. Now it’s time to explore for the solutions that might work. We started asking questions like —

从大量的问题,问题和功能要求列表到非常集中的问题集,我们融合在一起。 现在是时候探索可能可行的解决方案了。 我们开始问类似的问题-

我们如何建立品牌信任度? (How might we build Trust for the Brand?)

When we first faced this challenge I started researching about what is Trust and what is a Brand. Well, what’s the better way to understand any topic than to understand its definition first. I found some very interesting explanations, I am not going to go into depth of all of them but one particular explanation by Morton Deutsch, an American social psychologist is worth mentioning here —

当我们第一次面对这个挑战时,我开始研究什么是信任和什么是品牌。 嗯,比先了解其主题更好的理解任何主题的方法。 我发现了一些非常有趣的解释,我将不对它们进行深入介绍,但在这里值得一提的是美国社会心理学家莫顿·德意志 ( Morton Deutsch )的一个特别解释-

“Trust” involves the notion of motivational relevance as well as the notion of predictability. If one has an expectation that something will occur and this event is of motivational relevance, then the concept of trust is often applicable. However the most common usages of the phrase “to trust” have the additional meaning that when the trust is not fulfilled, the trusting individual will suffer an unpleasant consequence. That is, the trusting individual perceives that he will be worse off if he trusts and his trust is not fulfilled than if he does not trust.

“信任”涉及动机相关性的概念以及可预测性的概念。 如果人们期望会发生某些事情,并且这一事件与动机有关,那么信任的概念通常是适用的。 但是,“信任”一词的最常见用法具有其他含义,即当不履行信任时,信任的个人将遭受不愉快的后果。 就是说,信任的个人认为,如果他信任并且没有实现他的信任,就会比不信任更糟糕。

Morton Deutsch.

Morton Deutsch

For our case that unpleasant consequence is losing the money. We realized that trust involved some risk but if that risk doesn’t end up producing an unpleasant result, trust gets stronger.

对于我们来说,不愉快的后果就是赔钱。 我们意识到信任牵涉到一些风险,但是如果这种风险最终不会产生令人不快的结果,那么信任就会变得更加强大。

When you trust someone or something you take the risk for the expectation of some gain and there is a risk of loss. If you end up getting gain instead of loss, you build trust with them.

当您信任某人或某物时,您会冒险期望获得一些收益,并且有损失的风险。 如果最终获得了收益而不是损失,那么您将与他们建立信任。

This has clear implications —

这具有明显的含义-

  • We need to build some sort of risk aversion mechanism in our product for the new users so that they can try out playing with the real money and we ensure that they will get gain out of it. If we’re successful to build trust with them they’ll be less hesitant to put money in the platform.

    我们需要在我们的产品中为新用户建立某种风险规避机制,以便他们可以尝试使用真实货币,并确保他们将从中获得收益。 如果我们能够成功与他们建立信任,那么他们会毫不犹豫地在平台上投入资金。
  • Our transaction and payment systems need to be reliable and should work as expected all the time.

    我们的交易和付款系统必须可靠,并且应始终如期运行。
  • Consistent and transparent communications for any issue.

    任何问题的一致和透明的沟通。

I will be coming back to how we implemented above solutions but let’s first understand another piece of puzzle, “Brand”.

我将回到我们如何实现上述解决方案的方式,但让我们首先了解另一个难题,即“品牌”。

(Brand)

Image for post
Brand defined by Marty Neumeier
Marty Neumeier定义的品牌

When I started learning about the brand I came across tons of information. One that stood out from the crowd was a beautiful definition by Marty Neumeier, author of popular books like Zag and The Brand Gap.

当我开始了解该品牌时,我遇到了很多信息。 脱颖而出的是Marty Neumeier的优美定义,他是Zag和The Brand Gap等热门书籍的作者。

“A brand is a person’s gut feeling about a product, service or company.” Influenced by visual aesthetics, sound of messaging and the overall positioning of the brand in the market

“品牌是一个人对产品,服务或公司的直觉。” 受视觉美学,​​消息传递的声音和品牌在市场中的整体定位的影响

Marty Neumeier

马蒂·纽迈尔

After learning and researching enough about Trust and Brand I was confident and has enough information and resources to now start working on the solution and design implementation part. Let’s look at the solution for building trust and brand —

在对Trust and Brand进行了足够的学习和研究之后,我很有信心,并且拥有足够的信息和资源来开始着手解决方案和设计实施部分。 让我们看一下建立信任和品牌的解决方案-

风险规避机制 (Risk Aversion Mechanism)

We designed a solution where we launched a level progress for the new user and as they play more and clear levels we keep bringing new levels for them. When they clear level they get some variable money reward. This unlocked the door for new players to play with real money and also for players who were highly engaged but didn’t try playing with real money before because of the risk involved and the lack of trust in the system. We also enabled this for our existing users, this came out to be very successful.

我们设计了一个解决方案,在其中我们为新用户启动了一个关卡进度,随着他们玩的越来越清晰,我们会不断为他们带来新的关卡。 当他们清除等级时,他们会得到一些可变的金钱奖励。 这为新玩家提供了使用真钱游戏的机会,也为高度参与但由于涉及风险和对系统缺乏信任而没有尝试使用真钱游戏的玩家打开了大门。 我们还为现有用户启用了此功能,这非常成功。

Image for post
Above is a progress bar in MGPL showing user’s level progress.
上方是MGPL中的进度条,显示用户的等级进度。

Level progress were small tasks e.g. 1st level was practice to be better —

等级进步是一项艰巨的任务,例如,一级要练习得更好-

“Play 10 matches with coins and win reward” we designed rewards to be variable and just enough for some matches. So that users can play some matches, experience the fun and build the trust with the product. We placed the component at the top of the home screen intentionally so that user can see it every time they open the app working as a trigger to take the action.

“用硬币玩10场比赛并赢得奖励”,我们将奖励设计为可变的,足以进行一些比赛。 以便用户可以玩一些比赛,体验乐趣并建立对该产品的信任。 我们有意将组件放置在主屏幕的顶部,以便用户每次打开应用程序时都可以看到它,并作为触发操作的触发器。

When users complete the progress they get a scratch card having a variable reward, users can then use this reward money to play some real money games without the risk of losing the money because this time they didn’t have to put their money, they got it as a reward. It was sufficient for some matches and we were now sure that the risk aversion has been done. If some user still didn’t put money after playing matches with reward money and experiencing it they’re sadly not the user for our product.

当用户完成进度后,他们将获得一张具有可变奖励的刮刮卡,然后用户可以使用该奖励钱来玩一些真钱游戏,而不必担心会输钱,因为这一次他们不必存钱,他们得到了作为奖励。 对于一些比赛来说已经足够了,我们现在确定风险规避已经完成。 如果某些用户在玩了有奖励的比赛并体验了奖励后仍然没有投入金钱,那么他们就不是我们产品的用户。

We saw a significant bump in our retention and engagement after implementing this design in the product. Below are some screens from MGPL showcasing level progress design—

在产品中实施此设计后,我们在保留和参与方面有了很大的提高。 以下是MGPL展示级别进度设计的一些屏幕-

Image for post

“Building trust with a brand is a multifacet problem. Solving other problems like Transactions related issues, Communication issues, Usability, Visual Design and UX issues was all going to help build trust stronger with the brand.”

“建立品牌信任是一个多方面的问题。 解决与交易相关的问题,沟通问题,可用性,视觉设计和用户体验问题等其他问题,都将有助于建立对该品牌的信任。”

Now let’s look at what we did to build a brand and community around it —

现在,让我们看看我们如何围绕品牌建立品牌和社区–

建立品牌和社区 (Building Brand and Community)

We started engaging with our users actively on social media platforms like Instagram and Facebook. We noticed that we were getting high engagement in Instagram so we focused first on Instagram in growing our community. I took it as a challenge to grow the community on Instagram. When I first started we’d around 4K followers on Instagram.

我们开始在Instagram和Facebook等社交媒体平台上积极与用户互动。 我们注意到我们在Instagram上的参与度很高,因此我们首先专注于Instagram,以发展我们的社区。 我认为在Instagram上发展社区是一个挑战。 当我刚开始时,我们在Instagram上大约有4K粉丝。

I ran small contest on Instagram and feature it on our app as well e.g. one of the contest was to score more than 2000 in Ball Blaster, a game in MGPL and post screenshot using #MGPLBlaster. We gave some coupons and featured winners in our Instagram story as rewards.

我在Instagram上举办了一场小型比赛,并在我们的应用程序中进行了展示,例如,其中一项比赛是在Ball Blaster中得分超过2000,这是MGPL中的游戏,并使用#MGPLBlaster发布屏幕截图。 我们在Instagram故事中提供了一些优惠券和特色获奖者作为奖励。

Image for post
#mgplblaster hashtag on Instagram with hundreds of posts from players sharing screenshot using hashtag
Instagram上的#mgplblaster主题标签,来自玩家的数百个帖子使用主题标签共享屏幕截图

Players started participating and engaging with each other and with the brand. I also promoted our Instagram community through in app banners. We have designed communication channels to convey any kind of communication with our players. I have discussed about them in Communication issues part further.

玩家开始互相参与并与品牌互动。 我还通过在应用程序横幅中推广了我们的Instagram社区。 我们设计了沟通渠道,可以与玩家进行任何形式的沟通。 我已经在交流问题中进一步讨论了它们。

Our Instagram community grew from 4K to 40K within some month. Our Facebook page grew as well. As we grew our user base, players and YouTubers started posting videos about MGPL on YouTube.

我们的Instagram社区在一个月内从4K增长到40K。 我们的Facebook页面也有所增长。 随着用户群的增长,播放器和YouTubers开始在YouTube上发布有关MGPL的视频。

交易相关问题 (Transactions related issues)

Our tech team worked hard to perfect the experience our users were getting while doing any transaction with the platform. It was definitely not an easy problem to solve but we knew it’s a big part of the experience so we had to focus on it and solve it.

我们的技术团队努力完善用户在使用平台进行交易时获得的体验。 绝对不是一个容易解决的问题,但我们知道这是体验的重要组成部分,因此我们必须专注于此并加以解决。

We designed communication around different transaction states that we’d in the backend side so that we can communicate appropriate information for the current transaction state by being transparent with our users. In all transactions section we added relevant information for any issues happening with the transactions.

我们围绕后端的不同事务状态设计了通信,以便我们可以与用户保持透明,从而针对当前事务状态传达适当的信息。 在所有交易部分中,我们添加了有关交易中发生的任何问题的相关信息。

Any transaction goes with multiple states in the server before it sends a success response. If a transaction is stuck at any of the step we can tell our users what is the issue and a maximum time under which it should be resolved. So that users know what’s happening and have all the information, it helped us avoid support calls and messages.

任何事务在发送成功响应之前都会在服务器中具有多种状态。 如果交易停滞在任何步骤,我们都可以告诉我们的问题是什么以及应解决的最长时间。 使用户知道发生了什么并获得所有信息,从而帮助我们避免了支持电话和消息。

Below is an example of how we managed 2 main functions of MGPL wallet

以下是我们如何管理MGPL钱包的2个主要功能的示例

  • Add money to wallet

    加钱到钱包
  • Withdraw money from wallet

    从钱包提款
Image for post
Transaction cases and server states of a transaction in MGPL wallet
MGPL钱包中交易的交易案例和服务器状态

Above cases were implemented in design for all transactions and was also available through support. Checkout below component, it shows one of the cases from above i.e. failed state while adding money —

以上案例在设计上适用于所有交易,也可以通过支持获得。 在组件下方结帐,它显示了上面的一种情况,即在加钱时出现故障状态-

Image for post

Solving communication issues started taking shape after we implemented the communication in transactions and it helped us reduce the support queries significantly, improve the user experience and build the trust.

在交易中实现沟通后,解决沟通问题就开始形成,这有助于我们大大减少支持查询,改善用户体验并建立信任。

We further implemented clear, transparent and relevant communication where it was needed. I am going to show some of those changes we did and features we built.

我们在需要的地方进一步实施了清晰,透明和相关的沟通。 我将展示一些我们所做的更改以及我们构建的功能。

Let’s dive deep into the solutions for communication and support issues —

让我们深入探讨沟通和支持问题的解决方案-

沟通与支持 (Communication and Support)

In MGPL most of our games were asynchronous which means that it wasn’t required for 2 players to be live at the same time playing the game. One can finish their match and submit score and we will match them later based on their skill level. This created some of the most significant issues related with matchmaking —

在MGPL中,我们大多数游戏都是异步的,这意味着不需要2位玩家同时玩游戏。 一个人可以完成比赛并提交分数,我们稍后将根据他们的技能水平进行比赛。 这产生了一些与牵线搭桥有关的最重要的问题-

  • When any player starts a new match, we search for the opponent for some seconds and it didn’t matter whether the opponent was found or not, match was started after the search time ends. This means it is possible that you’re playing and after you finish your match you’ll not get the result as we’re still finding your opponent or if opponent is found it is possible that he’s still playing and we are waiting for him to finish the game and submit the score.

    当任何玩家开始新的比赛时,我们会搜索对手几秒钟,无论是否找到对方,比赛都在搜索时间结束后开始。 这意味着您可能正在比赛中,完成比赛后您将无法获得结果,因为我们仍在寻找您的对手,或者如果找到了对手,则有可能他还在继续比赛,我们正在等待他完成游戏并提交分数。
  • Matchmaking had cases like — Waiting for opponent, Waiting for opponent to submit the score or Waiting for result. Proper communication was required if players didn’t get opponent or their opponent never submits her/his score.

    对接会的情况有—等待对手,等待对手提交分数或等待结果。 如果玩家没有对手或对手从未提交过自己的分数,则需要适当的沟通。
  • There was a need to provide an option of support for any of the matches so that if players had some unexpected issues they can contact us.

    有必要为任何一场比赛提供支持,以便球员在遇到一些意外问题时可以与我们联系。
  • Similar support option was required for all transactions as well. Game playing, Matchmaking and Transactions were the core part of the experience and these need to have better communication and support.

    所有交易也都需要类似的支持选项。 游戏,配对和交易是体验的核心部分,需要更好的沟通和支持。
  • We needed more communication channels to promote our offers, announce some important information or run some promotional ads.

    我们需要更多的沟通渠道来推广我们的优惠,宣布一些重要信息或投放一些促销广告。
  • We wanted a communication channel which could ensure that users have been communicated for some important announcements e.g. if payment systems are down or a new offer has been launched for limited time.

    我们希望有一个沟通渠道,可以确保已就一些重要的公告与用户进行了沟通,例如,如果付款系统出现故障或在限定时间内推出了新报价。

Let’s look at the solutions one by one —

让我们一一看一下解决方案-

比赛案例交流 (Match Cases Communication)

Image for post

We first started with putting past matches in 3 main contextual groups —

我们首先从将过去的比赛分为3个主要的上下文组开始-

  • Pending Turns for challenges and tournaments

    等待挑战和锦标赛的转弯
  • Completed Matches

    完成比赛
  • Matches in progress

    比赛进行中
Image for post

Tapping on any match card opens match details where a player can see what’s happening with the current match in detail.

轻按任何比赛卡即可打开比赛详细信息,玩家可以在其中详细了解当前比赛的情况。

In match details page we added contextual communication for different match cases. Match details page consisted below information —

在比赛详细信息页面中,我们添加了针对不同比赛情况的上下文交流。 比赛详细信息页面包含以下信息-

  • Current match state

    当前比赛状态
  • Option to investigate the issue or understand about the current match status further by tapping on it

    通过点击此选项,可以调查问题或进一步了解当前比赛状态
  • A quick comparison between player and opponent score using different score bar height

    使用不同的得分杆高度快速比较玩家和对手的得分
  • Match ID with a handy copy cta which was helpful in communicating with support in case of any issue

    带有方便复制的cta的匹配ID,有助于在出现任何问题时与支持人员进行沟通
  • A dedicated help option to open support for the particular match

    专用的帮助选项可打开对特定比赛的支持

帮助支持 (Help & Support)

Image for post

We integrated a dedicated help and support section having 3 main sections —

我们整合了专门的帮助和支持部分,其中包括3个主要部分:

  • Live support thread

    实时支持线程
  • Last transaction quick preview, if any issue has been identified

    上次交易快速预览(如果已发现任何问题)
  • List of common problems with explanations

    常见问题列表及说明
  • How to use, Privacy policy, FAQs section

    使用方法,隐私政策,常见问题解答部分

Most of the time, players were facing a known issues for that we provided a list of common problems which explained most of the issues for players. If a player faced any unexpected issue we provided a chat support as well.

在大多数情况下,玩家面临一个已知问题,因为我们提供了一些常见问题列表,为玩家解释了大多数问题。 如果玩家遇到任何意外问题,我们也会提供聊天支持。

We resolved players queries on top priority and these design changes helped to minimize them too.

我们以最优先的方式解决了玩家的查询,这些设计更改也有助于将其最小化。

So far we’ve discussed building Brand and Trust, Match status cases communication, Transaction cases communication and Support options for any issues players faced in any of the thing. Most of the main problems have already been solved, we went ahead to design new features which we were going to use in future for different type of communications.

到目前为止,我们已经讨论了为玩家遇到的任何问题构建品牌和信任,比赛状态案例交流,交易案例交流和支持选项。 大多数主要问题已经解决,我们继续设计新功能,这些功能将在将来用于不同类型的通信。

新的沟通渠道 (New Communication Channels)

We implemented some new communication channels which were going to help us announce important information on the fly. There were 2 main design components which we used —

我们实施了一些新的沟通渠道,这些渠道将帮助我们即时发布重要信息。 我们使用了2个主要的设计组件-

  • In-app Banners

    应用内横幅
  • Announcement bar

    公告栏

In-app Banners

应用内横幅

Image for post

We designed In-app Banners intentionally to have a compact size and able to communicate any type of information, promotions or announcement. We placed it on the top in Results section of bottom navigation. We wanted to provide it a location where users navigate frequently so that they can see the updated set of information. We had 2 high traffic sections — Results & Play.

我们故意将应用内横幅广告设计为紧凑的尺寸,并能够传达任何类型的信息,促销或公告。 我们将其放在底部导航的“结果”部分的顶部。 我们想为它提供一个用户经常浏览的位置,以便他们可以看到更新的信息集。 我们有2个人流量大的部分-结果与比赛。

We didn’t want to obstruct the playing experience so we placed banners in the results section. Below is a screenshot from production app —

我们不想妨碍比赛体验,所以我们在结果部分放置了横幅。 以下是生产应用程序的屏幕截图-

Image for post

It is important for us to think design components in terms of scalability and systems. I have experienced it makes your life easy for live-ops when you design in app components scalable and based on a design system. You can focus on high impact design decisions instead of designing every time from scratch. I will be explaining the MGPL Design System in some future post. Now let’s look at another channel —

对于我们而言,从可伸缩性和系统角度考虑设计组件非常重要。 当您在可扩展且基于设计系统的应用程序组件中进行设计时,它使您的生活变得轻松自如。 您可以专注于高影响力的设计决策,而不必每次都从头开始设计。 我将在以后的文章中解释MGPL设计系统 。 现在让我们来看另一个频道

Announcement Bar

公告栏

We wanted to make sure that the communication is delivered to all the users and they see it but at the same time we wanted it to be unobtrusive. We intentionally placed it just above the bottom navigation. Most of the time when there is no announcement that place has no UI element but as soon as we put an announcement it shows right up there making a change and users could notice it easily.

我们希望确保将通信传递给所有用户,并让他们看到它,但与此同时,我们希望它不会显得干扰。 我们有意将其放置在底部导航上方。 大多数情况下,没有公告的地方没有UI元素,但是一旦我们发布公告,它就会立即显示在此处进行更改,用户可以轻松地注意到它。

Announcement bar was placed just above the bottom navigation, it has different types depending upon the context. 2 most frequently used types were —

公告栏位于底部导航的正上方,根据上下文的不同,其类型也不同。 2种最常用的类型是-

  • Text based announcement

    基于文本的公告
  • Image based announcement

    基于图像的公告
Image for post

Both of the types have support for a CTA redirecting to the web or deep linked to a function within app. Announcement bar served perfectly as highest priority communication channel to deliver important announcement or to promote an action we wanted users to take.

两种类型都支持CTA重定向到Web或深层链接到应用程序中的功能。 公告栏完美地充当了最高优先级的沟通渠道,用于发布重要的公告或促进我们希望用户采取的行动。

We wanted to make sure that the communication is delivered to all the users and they see it but at the same time we wanted it to be unobtrusive. We intentionally placed it just above the bottom navigation. Most of the time when there is no announcement that place has no UI element but as soon as we put an announcement it shows right up there making a change and users could notice it easily.

我们希望确保将通信传递给所有用户,并让他们看到它,但与此同时,我们希望它不会显得干扰。 我们有意将其放置在底部导航上方。 大多数情况下,没有公告的地方没有UI元素,但是一旦我们发布公告,它就会立即显示在此处进行更改,用户可以轻松地注意到它。

This was a modular component having ability to show text or image at the bar, it has extended view when tapping on it which contains a CTA to relevant action. Expanded view was also dynamic and can have a full image with a CTA on top of it or can render simple HTML. We were able to have control on the formatting part even though the text was all dynamic.

这是一个模块化的组件,能够在栏上显示文本或图像,点击该组件时具有扩展视图,其中包含有关操作的CTA。 展开后的视图也是动态的,可以在其顶部具有CTA的完整图像,也可以呈现简单HTML。 即使文本是动态的,我们也可以控制格式部分。

Image for post

Both In-app Banners and Announcement Bar helped us communicate all types of dynamic information. It was highly required given the very dynamic nature of the product. We also used these channels to promote actions which we found was important for users.

应用内横幅广告和公告栏都帮助我们交流了所有类型的动态信息。 鉴于产品非常动态,因此非常需要此功能。 我们还使用这些渠道来促进发现对用户重要的操作。

Let’s now discuss about another important problem —

现在让我们讨论另一个重要的问题-

可用性,视觉设计和UX问题 (Usability, Visual Design and UX issues)

We improved user experience by fixing and improving things one by one, remember the core function user flow I discussed in the beginning we started with fixing that first —

我们通过逐一修复和改善问题来改善了用户体验,请记住我在一开始就讨论的核心功能用户流程,我们首先要解决该问题,

Image for post
Improved flow of playing a game in MGPL public beta
改进了MGPL公共测试版中的游戏流程

We wanted to minimize the steps and reduce friction from playing a game as much as we could. Performing the core action — playing a game, with just a single tap is the ideal flow for us. Playing a game was the most frequent and most used function of the app as well.

我们希望最大程度地减少步骤,并尽可能减少玩游戏带来的摩擦。 执行核心动作-只需单击即可玩游戏是我们的理想选择。 玩游戏也是该应用程序中最频繁和最常用的功能。

We replaced steps like selecting match type and selecting denomination with default preset of match type and denomination relevant for the user. If user has played with a custom match type and denomination, we showed them their last played preset next time, they just need to hit Play and start the fun.

我们用与用户相关的匹配类型和面额的默认预设替换了选择匹配类型和面额等步骤。 如果用户使用自定义的比赛类型和面额进行比赛,我们将在下一次向他们显示他们的上次比赛预设,那么他们只需要点击“播放”即可开始游戏。

Image for post
MGPL App, Play section
MGPL应用程序的“播放”部分

Playing a game has become a breeze, our users used to play same match type multiple times before switching to a different game, match type or denomination. A single Play CTA, your last played match always ready when you launch the app came to be very handy. We put a quick Game Selector to the left of the Play which was intentional serving 2 important functions —

玩游戏变得轻而易举,我们的用户过去习惯多次玩相同的比赛类型,然后再切换到其他游戏,比赛类型或面额。 单一的Play CTA,在您启动该应用程序时总是可以随时准备的上一场比赛变得非常方便。 我们在Play的左侧放置了一个快速的游戏选择器,该选择器有意提供2个重要功能-

  • Indicating which game you’re going to Play when you hit play

    指示您在玩游戏时要玩的游戏
  • Quick switching between your favorite games

    在喜欢的游戏之间快速切换

Match selection and Game playing was effortless and it worked really well.

比赛选择和比赛很轻松,而且效果很好。

Now, another area where we found an opportunity to improve UX was the end experience after playing some games on the platform. You can’t obviously win 100% of your matches because of the skill matching in place. We observed impacts of losses and wins on user’s behavior. When we started researching about it, we found a great study by David Kahneman & Amos Tversky

现在,我们发现可以改善UX的另一个领域是在平台上玩了一些游戏之后的最终体验。 显然,由于已进行的技能匹配,您显然无法赢得100%的比赛。 我们观察到了损失和胜利对用户行为的影响。 当我们开始对此进行研究时,发现David KahnemanAmos Tversky进行了出色的研究-

Loss aversion is an important concept associated with prospect theory and is encapsulated in the expression “losses loom larger than gains” (Kahneman & Tversky, 1979). It is thought that the pain of losing is psychologically about twice as powerful as the pleasure of gaining.

损失规避是与前景理论相关的重要概念,并被封装在“损失大于收益”中(Kahneman&Tversky,1979)。 人们认为,从心理上讲,失败的痛苦是获得乐趣的两倍。

So how might we make users celebrate wins and forget losses?

那么,如何使用户庆祝胜利却忘记损失呢?

We started to remove the word lost or loss from the communication in all instances where a player couldn’t win the match. We also started to communicate more prominently their wins, idea here was to create a strong visual memory of winning to shift user’s focus from losses to winnings.

在玩家无法赢得比赛的所有情况下,我们开始从交流中删除丢失或丢失的词。 我们还开始更加突出地交流他们的胜利,这里的想法是创建一个强大的胜利视觉记忆,以将用户的注意力从损失转移到胜利。

Image for post

We would also not show the match denomination where players came 2nd so as to avoid communicating the amount of loss. Basically we created friction for users to understand losses and made gains highly visible and prominent. Check below example for how we communicated their wins —

我们也不会显示比赛名次在第二名,以免造成损失。 基本上,我们为用户理解损失创造了摩擦,并使收益非常明显和突出。 查看以下示例,了解我们如何传达他们的胜利-

Image for post
Total wins since last app launch in MGPL
自MGPL上一次启动应用以来的总赢额

When users launched their app after sometime and if they win the matches we showed their cumulative wins since last session on the app launch. Creating a wow moment for the players, when we first tested this with users we could easily see the happiness on their faces whenever this popup was displayed as it means victory. It was high contrast and intentionally designed to have a high visual recall so that player remember their wins.

当用户过了一段时间启动应用程序后,如果他们赢得比赛,我们将显示自上一次应用程序启动以来的累积胜利。 为玩家创造一个惊喜时刻,当我们首次与用户进行测试时,只要显示此弹出窗口,就很容易看到他们脸上的幸福,因为这意味着胜利。 它具有很高的对比度,并经过精心设计,具有很高的视觉回想力,以便玩家记住自己的胜利。

This was truly a fulfilling experience. We learned that when you find opportunities to celebrate user’s success, making it grand can create a wow experience for the users.

这确实是一次充实的体验。 我们了解到,当您发现庆祝用户成功的机会时,使其大放异彩可以为用户带来惊喜。

Moving onto the next change which we made —

进入我们所做的下一个更改-

玩家统计 (Player Stats)

Our players had a hard time figuring out their own performance and their opponent’s performance over time. We thought to provide some metric which will allow players to understand how are they performing in different games. We also made it public so any player can see these stats of any other player. This came in handy to compare yourself with your opponent.

随着时间的推移,我们的玩家很难确定自己的表现和对手的表现。 我们认为应该提供一些指标,使玩家能够了解他们在不同游戏中的表现。 我们也将其公开,因此任何玩家都可以看到任何其他玩家的这些统计信息。 这很方便将自己与对手进行比较。

Image for post
Player stats card
球员统计卡

There were 3 main metrics on the stats card — Best Score, Win Ratio, 1 vs 1 Victories for each game. Players can explore stats for all the games, compare it with their opponents and figure out their strengths and weaknesses.

统计卡上有3个主要指标-最佳得分,胜率,每场比赛1比1胜利。 玩家可以浏览所有游戏的统计数据,将其与对手进行比较,并找出自己的优势和劣势。

We also used a consistent visual design language throughout the redesign process, we named it MGPL Design System. You can check all of its components on behance project.

在整个重新设计过程中,我们还使用了一致的视觉设计语言,我们将其命名为MGPL设计系统。 您可以在behance project上检查其所有组件。

视觉设计语言 (Visual Design Language)

We wanted a very consistent design language for the MGPL Brand. It needed to have aesthetics similar to a gaming app, should’ve a distinct visual identity and look premium as it involved real money gaming.

我们希望MGPL品牌使用非常一致的设计语言。 它需要具有类似于游戏应用程序的美感,应该具有独特的视觉标识,并且因为涉及真钱游戏而显得溢价。

We started with designing the most basic components and finalising them and overtime we developed the whole design library and system. I will not go into the details of it here, it probably needs another article. Below you can checkout some components from the MGPL Design System

我们首先设计最基本的组件并最终确定它们,然后加班,我们开发了整个设计库和系统。 我将不在这里详细介绍它,它可能需要另一篇文章。 您可以在下面从MGPL设计系统中检出一些组件-

Image for post
MGPL Design System
MGPL设计系统

When we implemented this design system the result was a very consistent designs throughout the product.

当我们实施该设计系统时,结果是整个产品的设计非常一致。

And I think now we’ve reached to the end of the story. I loved designing MGPL as it was truly a unique product to design, has multiple aspects to its experience and challenges were exciting. Now if I see back and analyze the things that I have worked on, list will never end.

我想现在我们到了故事的结尾。 我喜欢设计MGPL,因为它确实是一种独特的设计产品,其经验涉及多个方面,挑战令人兴奋。 现在,如果我回头查看并分析我所做的工作,列表将永无止境。

Thank you for reading to the end, I hope you enjoyed your time on this story.

感谢您阅读到最后,希望您喜欢这个故事。

MGPL背后的设计团队 (The Design Team behind MGPL)

I would love to thank the founder Anshul Rustaggi, co-founder Paritosh Gupta, my design lead and mentor Utkarsh Khatri and Game Design Artist Dimple Dhanwani for helping me out with so many things in the process, it would not be possible without you guys and I’ve learned so much. It was a tremendous learning experience for me working on the project. We worked together day and night to make MGPL a great experience.

我要感谢创始人Anshul Rustaggi ,联合创始人Paritosh Gupta ,我的设计负责人和导师Utkarsh Khatri和游戏设计艺术家Dimple Dhanwani在此过程中为我提供了很多帮助,如果没有你们和我学到了很多。 对于我从事该项目而言,这是一次很棒的学习经历。 我们日夜合作,使MGPL成为绝佳的体验。

Image for post

让我们连接 (Let’s Connect)

Connect with me on Instagram and we can discuss cool stuff there —

在Instagram上与我联系,我们可以在那里讨论有趣的东西-

Nihal on Instagram

Nihal在Instagram上

Are you on Twitter Design? Hmm I am there too [ sometimes ] —

您在Twitter设计上吗? 嗯,我也在[有时]

Nihal on Twitter

Nihal在Twitter上

Checkout Dribbble for interactions and UI shots —

检出Dribbble以进行交互和UI拍摄—

翻译自: https://uxdesign.cc/a-real-money-casual-gaming-app-mgpl-a-ux-case-study-9c19c8c4c4e0

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值