作者：Jeremie Dupuis

用户界面在电子游戏中扮演重要角色，因为它的主要任务就是支持游戏体验。这在Facebook平台体现得更是淋漓尽致，它给作品的病毒式传播、用户留存率及创收水平带来很大影响，所以不妨认真阅读如下内容。

本文，我将以Lolapps的《Ravenskye City》为例，论述什么是Facebook游戏UI中最重要的元素。

典型Facebook游戏外观

《Ravenskye City》UI堪称Facebook游戏的典型代表，其包含如下元素：

1. 顶部菜单（Top Menu）

2. 游戏数据菜单（Game Data Menu）

3. 任务栏（Missions）

4. 好友列表（Friends List）

5. 商店/仓库（Shop/Storage）

6. 参数设置（Parameters）

1. 顶部菜单

我喜欢它们的顶部菜单，因为它突出需要进行1次点击的主要功能。

—Like按键：你的Facebook Fan页面是激活用户基础的免费渠道，所以你最好将Like按键设置在显眼的位置。

—标签（Tabs）：

* 体验（Play）：这是列表的第一个按键，且带有彩色标记，所以你完全无需搜索它的位置

* 添加积分（Add Credits）：这一金色按键旨在吸引用户的眼球，方便用户立即找到此按键。将此按键置于显眼的位置能够提高你的收益水平。

* 免费礼物（Free Gifts）：礼物馈赠是菜单中的主要功能，因为它对病毒式传播和用户留存率有一定的影响

* 我的邻居（My Neighbors）：事实证明，玩家拥有的邻居越多，他们返回游戏的可能性越大。

* 邀请好友（Invite Friends）：有些玩家会立即被“Invite friends”的按键设置所吸引，所以你最好不要忽略这一按键

* 帮助（Help）：你是否希望避免反复向支持团队问问题？那么你最好创建知识数据库，在顶部菜单中添加链接。

* 信息（Messages）：这是提高请求循环机制效率的主要功能设置。若你没有在应用中设置请求中心，那么请求就会被淹没在游戏请求标签中，导致出现如下结果：

a. 你的接受率将受到很大影响

b. 这会降低用户发出的请求数量，因为若请求未被接受，他们就会停止发送请求。同样，接受的请求数量越多，就会有越多玩家回送请求，以实现互惠互利。

注意：若我没有接受玩家的请求很多次后，我希望他们能够停止向我发送请求。

2. 游戏数据

玩家必须能够看到重要的游戏数据，因为这会影响他们的决策：

* 硬币数量，要设有供玩家购买更多硬币的按键。设置多重同一接入点并不总是坏事。

* 游戏具体数据：例如，这里你可以看到我拥有的木材数量。玩家可以自由添加自己的游戏数据。

* 能量：能够查看能量数量非常重要，因为有时候玩家需要考虑在能量耗尽前采取什么举措。

* 经验指示栏：玩家希望获悉自己距离下个关卡还有多远，因为这能够让他们获得新道具，重新填充能量。

3. 任务菜单

这里的任务菜单非常标准，因为它们通常会出现在多数管理游戏中。菜单位于屏幕中间，非常显眼，总是能够被玩家看见，这样他们就不会忘记自己的当前任务是什么（游戏邦注：即使他们已段时间没玩游戏）。

这一菜单通常堆叠在屏幕左侧，方便同时呈现多个菜单。

这些图标附有工具提示和通知机制，以便在出现更新内容时提示玩家。

4. 好友列表

好友列表通常位于游戏底部，主要包括3个主要功能：

* 拜访好友：拜访好友是非常重要的玩家活动，因为这能够促使他们定制自己的城市。的确，若没有人拜访我们的城市，那么创建它们还有什么意义？

* “默认好友”：如今多数游戏都会默认设置1个包含2大主要好处的虚拟好友：它向玩家呈现拥有更多好友的益处，以及当玩家变成高级用户后，城市的变化，再来就是玩家能够进行什么类型的互动。

* 添加邻居：在Facebook平台，没有人希望自己单独体验游戏。将邻居列表设置在突出位置对于病毒式传播和用户留存率来说至关重要。

5. 商店/仓库

这类菜单已变成标准模式，包括如下内容：

* 修改城市内部元素的版本选择

* 商店：这是玩家购买必要道具，以完成相应任务的场所

* 仓库：这是玩家存储已收集或购买道具的地点

6. 参数设置

如今多数游戏都有在右下角设置参数选项。这一设计也属于标准模式，所以你无需疑虑。

点击后，下列选项将提高玩家的视觉舒适度：

* 放大/缩小：若你的城市规模越来越大，不妨设置此按键。

* 全屏模式：如今我们越来越常在Facebook游戏中看到全屏模式。它们带来更富沉浸性的游戏体验，所以不妨设置这一选项。

* 静音/解除静音：这一选项完全无需解释。要记得将音效同配乐区分开。

7. 奖励：交叉推广条框

我差点忘记这一重要元素。

* 若你有推出其他游戏，你定希望玩家能够在你的游戏中轻松进行导航。植入集中沟通机制和请求内容能够帮你提示玩家在工作室的其他作品中进行操作，进而提高游戏的留存率。

* 若你没有推出其他作品，可以选择采用Applifier之类的条框，这将变成你引进新手的新渠道（游戏邦注：但要确保游戏拥有较高的留存率）。

总结

也许你会发现，“标准”一词在文中出现多次，这有其原因。如今我们看到的多数设计都源自Playfish/EA早期在这一平台所推出的作品。多年来，这些UI类型已被众多社交玩家所掌握。因此你可以通过运用本文陈述的UI设计标准让玩家在短短几分钟内熟悉游戏的UI。

当然，你可以采用非标准UI元素，如果这适合你的游戏，或者你觉得自己有更好的游戏构思，而这一构思能够转变成下个设计模式。此外，如果说UI是个重要元素，那么流程就更是不可或缺。例如，点击邀请按键后游戏将出现10种执行邀请好友流程的方式，所以这只是游戏界面设计的开始。（本文为游戏邦/gamerboom.com编译，拒绝任何不保留版权的转载，如需转载请联系：游戏邦）

The 7 User Interface Parts your Facebook Game needs

by Jeremie Dupuis

The User Interface plays a very important role in a video game as its main mission is to support the Game Experience. This is more than true in a Facebook and it can have a big impact on your virality, your retention and your monetization so you’d better read what comes next to make sure you didn’t forget anything.

In this article, I’ll explain you through the example of Ravenskye City by Lolapps, what are the most important elements of a Facebook Game UI.

General Overview of a typical Facebook Game

Ravenskye City UI is very typical of Facebook Games today, where we find the following sections:

1. Top Menu

2. Game Data Menu

3. Missions

4. Friends List

5. Shop / Storage

6. Parameters

1. The Top Menu

I like their top Menu because it clearly highlights the very important features that require a 1 click Access:

- The Like Button: Your Facebook Fan page is a free channel to reactivate your user base, so you’d better ensure you add the Like Button at a very prominent position.

- Tabs:

* Play: 1st button in the list and colored, you don’t want to have to search for it

* Add Credits: The Golden button is here to catch the eye and make sure the minute you search for it you find it. Make this button prominent to improve your monetization.

* Free Gifts: Gifting is an important feature to include in the menu as it will have an impact on Virality and Retention.

* My Neighbors: It has been proven, the more neighbors players have, the more they come back to the game.

* Invite Friends: Some players are immediately attracted by a clear “Invite friends” button so you’d better not forget it

* Help: Do you want to avoid repetitive questions to your support team? You’d better create a Knowledge database and add a link in the Top Menu

* Messages: That one is a mega important one for the efficiency of your requests loop. If you don’t include a Request Center in your application, requests will be lost in the Games Requests Tab and as a result:

1. Your acceptance rate will be hugely impacted

2. This will decrease the number of requests sent as some players will stop sending requests if they are never accepted. Also, the more you accept requests, the more players will send requests back as reciprocity.

Note: I wish all players would stop sending me requests when I didn’t accept their hundred previous requests

2. Game Data

At any time, the player must see the most important game data as it will impact the decisions they will take:

* Number of Coins including a button to buy more. Multiple identical access points is not always bad

* Game Specific Data: Here you can see for example the Wood I have. Feel free to add yours.

* Energy: Important to see energy as sometimes players will plan what is the last move they will do before their energy is empty

* Experience Bar: Players want to see how far they are from the next level as it usually unlocks new items and refills the energy

3. Missions Menu

The Missions Menu here is pretty standard as it can be seen in most of the Management Games. Located at the middle of the screen (on the left side), it is very prominent, and is always visible so that players never forget what is they current mission, even if they haven’t played in a while.

The way it is stacked on the left allows for several missions to be displayed at the same time.

These icons can be accompanied by tooltips and a notification system to warn the player whenever there is an update.

4. The Friends List

The friends list is usually located at the bottom of the game, and highlights 3 main features:

* Visit a friend: Visiting a friend is an important behavior to create amongst your players as it gives a reason to customize your city. Indeeed what would be the point if nobody was seeing it?

* The “default friend”: By default, in most games now, there is a fake friend that has 2 main interests: it shows the player the benefit of having more friends AND it shows you how your city (or whatever you game is) will look like when you’re a more advanced player and what kind of interactions you’ll be able to do.

* Add a neighbor: on Facebook nobody wants to play alone. Giving a prominent spot for the neighbors list is important for virality and retention

5. Shop / Storage

This type of menu has became a standard and gives access to:

* The Edition Options to modify (Rotate, Move…) elements in your city

* The shop: This is where players will come to buy the necessary items to finish missions

* The storage: This is where items collected or bought will be kept

6. Parameters Menu

Now most games have positioned the parameters at the bottom right. The design is pretty standard so you shouldn’t ask yourself too many questions.

Once clicked, the options listed below will improve the player’s visual comfort:

* Zoom In / Zoom Out: Include it if you city can become too big

* Fullscreen Mode: it’s becoming more and more usual to see a Fullscreen mode in Facebook Games. They create an even more immersive game experience so you really should think about adding it

* Sound Off /Sound On: No need to explain why you need them. Don’t forget to separate sound effects from the music

7. Bonus: the Cross Promotion Bar

I almost forgot an important part of Facebook Games UI: the cross Promotion Bar.

* If you already have other games, you will want to ensure players can navigate easily amongst your games. Integrating a Centralized System of Communication and requests will allow you to notify users of actions to take in other games of your company, and can create a great retention for your games

* If you don’t have other games, you can use bars like Applifier that can become a new channel of recruitment. Make sure your retention is good though!

Conclusion

As you may have noticed in the article, the word “standard” came back several times and there’s a reason for what. Most of the designs we see today are inherited from Zynga and Playfish/EA first games on the platform. These types of UI have been learned by millions of social gamers over the last few years. Thanks to that, you can make players familiar with your UI in a few minutes by using the UI standards described in this article.

Of course, you can use non-standard UI elements if it  makes sense for your game or if you think you have a better idea that will become the next Design Pattern. Moreover, UI is a thing, but flows are even more important. For example, there are 10 ways of implementing an Invite Friends Flow after a click on an Invite Button so this is only the beginning of the work. Stay tuned for more tips!（Source：fbsocialapps）