37 New Horizon in Mobile Development Halfway Through Three Years of Transformation From Mobile Development to Mobile Game Development

37 New Horizon in Mobile Development Halfway Through Three Years of Transformation from Mobile Development to Mobile Game Development #

Hello, I’m Zhang Shaowen. I first met Qingwen in 2015 when he was responsible for performance optimization on the Android side of WeChat Reading. One day, he told me he wanted to try his hand at game development. At that time, two thoughts came to my mind: on one hand, there was the rumored 60-month year-end bonus in the game department, making game development seem like a very promising direction; on the other hand, I had concerns about abandoning years of accumulated experience in Android development and transitioning to a completely unfamiliar game field, wondering if he would be able to handle it.

Now, two years have passed, and Qingwen has personally proved two things through his personal experience: - First, game development is not as difficult as imagined. Back in the day, he was the technical core of the Android version of WeChat Reading, and now he is still the technical core in his new role. “Once you understand one, you understand many,” technology is transferable, and our most valuable assets are our ability to learn and our research spirit. - Second, knowledge of client platforms is still very important. Although mobile game development has its own independent development system, it still runs on the Android or iOS system. Many technologies required for app development are also needed for game development. As Android developers, our ability to optimize by delving into the bottom layers is actually a strength that most game developers do not possess.

In my opinion, no matter how mobile development evolves in the future, whether it is dominated by the front-end or shifts towards game development, IoT, AI, audio and video, or other directions, the Android platform knowledge we are familiar with today, as well as the ability and methods we have developed through learning this knowledge, are our most valuable treasures. Now, let’s take a look at the journey of Qingwen’s transition from mobile development to game development.

Hello, I’m Li Qingwen from a mobile game studio under Tencent. By invitation from Shaowen, I’m here to chat with you about game development in the “Android Development Master Course”.

In April 2017, I transitioned from app client development to becoming a game client developer in a “Creating Fun at the Cost of My Life” mobile game studio. Before transitioning to game development, although I was attracted by the exquisite graphics in games, I had no clear understanding of how games presented these detailed visuals. I felt that game development was like a mysterious organization, and I didn’t know what the colleagues in the game development team did every day. If you’re also curious about game development and have had the same confusion as me before, I wonder if you also share my curiosity? Now, as someone who experienced it firsthand, I will talk to you about the journey of transitioning to game development.

Uncovering the Veil of Mobile Game Development #

Generally speaking, a mobile game development team consists of a producer, a design team, an art team, an operations team, a programming team, and an audio team. The core gameplay of the game is entirely developed by the project team themselves, while some of the art and audio elements can be outsourced.

The design team includes gameplay designers and numerical designers, and they are the soul of the entire game. The success or failure of a game depends on whether the core gameplay is fun and whether peripheral systems can better support the core gameplay. In some teams, the operations team is also included in the design team. The main responsibilities of the operations team include external collaborations, designing in-game events, and making corresponding adjustments to gameplay or events based on event data to prolong the game’s lifecycle and increase revenue.

The art team consists of concept artists, visual designers, and 2D/3D visual effects designers. The team members responsible for visual effects have more communication with the programming team because animations need to be coordinated with the programming. For example, when a specific animation reaches a certain keyframe, the programming needs to handle certain logic.

The programming team for app development focuses more on the architecture of the mobile operating system and aims to understand as much as possible about the interfaces or capabilities the system can provide for apps. On the other hand, the programming team for mobile gaming focuses more on the architecture of game engines and how to optimize game performance based on the engine.

Next, I will take the Cocos engine as an example to show you the development process of mobile games and how they run.

1. Game Architecture

Using my game project as an example, the overall game architecture is shown in the diagram below.

The key components are:

  • The resource update module allows continuous bug fixes and feature releases.
  • The configuration system provides tools for the design and operations teams, mainly used to edit XLS files to configure in-game levels, events, etc. The configurations made by the design team will be automatically converted into Lua files during the game compilation process.
  • Services manage all the in-game data.
  • The network module is responsible for establishing and communicating with the backend through sockets.
  • The game uses the MVC model to control the transitions between different in-game modules.
  • Within individual functional modules, logic and animation are separated. The logic layer generates animation events, while the animation layer consumes animation events and allows in-game sprites to execute specific actions accordingly.

2. Game Scene Design

Cocos uses a node-tree structure to manage game objects. A game can be divided into different scenes, and each scene can have multiple layers. Each layer can contain multiple sprites. The switching of game levels and peripheral systems within a game is analogous to switching between stages and locations in a movie. The director is responsible for handling these transitions between different game scenes. The basic structure of a Cocos game is as follows:

Within the same scene, multiple sprites can be animated through actions, such as scaling, moving, and rotating, to achieve the goal of making the game “come alive.”

In the Cocos engine, the coordinate system has the X-axis pointing to the right, the Y-axis pointing upwards, and the Z-axis (Z-Order) pointing vertically outwards from the screen. Since this is a 2D game, the Z-axis is only used to control the order of game elements. If two sprites within the same scene overlap or partially overlap, the sprite with a larger Z-Order will cover the one with a smaller Z-Order. For sprites with the same Z-Order, the one added to the scene later will cover the one added earlier.

With the tree structure and Z-Order, the Cocos engine enables the construction of various 2D game scenes.

3. Running Process of a Mobile Game

The main activity of the game creates a GLSurfaceView, which inherits from View, during onCreate. GLSurfaceView is used by the engine to render the game content. It also accepts player touch events for interaction between the engine and players.

After GLSurfaceView is created, the engine starts executing the main.lua script. The director calls the runWithScene interface, and the game enters the first “scene.” GLSurfaceView maintains a while loop in which events (such as surface creation and changes in width or height) are passed to the outside through the Renderer interface. One of the interfaces in Renderer is onDrawFrame, which notifies the director to execute one frame of the game loop at regular intervals based on the frame rate set by the game.

Referring to the single-frame processing flow diagram from the book “My Understanding of Cocos2d-x,” you can see that within each frame:

  • User inputs are processed first since they may affect the game logic in the current frame.
  • Based on the animations set for each sprite, the positions, scales, and other attribute values of the sprites are calculated.
  • Game logic is executed, such as updating player scores or changing the current game state. Developers can still modify various attributes of sprites in this phase.
  • The UI tree is traversed, and based on the previously set sprite attributes, rendering commands are generated and passed to OpenGL for rendering. Finally, the rendered content is displayed on the screen.

Differences and Similarities in Game and App Development #

1. About Hot Updates

Hot updates are a topic that both app and game development cannot avoid, but there are fundamental differences between hot updates in apps and games. Hot updates in app development involve implementation details at the system level. For example, the hot update framework I implemented during my previous job required a lot of knowledge, including details about the loading process of Dex files, searching process for SO files, and the detailed process of APK compilation. Carelessness in any of these areas could result in hot updates not being effective or even causing serious bugs on the live app.

However, game engines that use scripts inherently support hot updates. Hot updates in mobile games, also known as resource updates, involve updating content such as code, texture images, and user interfaces.

Taking the Cocos engine as an example, the core of Cocos engine is implemented in C++ and provides JS and Lua interfaces. The majority of the code in business development is Lua code, while only a small portion involves system-related interfaces such as payment, audio playback, and WebView, which require writing some system-related code. The Lua code, after compilation, generates binary code in the form of “.luac” files, which are loaded using the luaL_loadbuffer interface. During the initialization process, the Cocos engine sets a “code search path”. When loading Lua code, it traverses each set path one by one until it finds or does not find the corresponding “.luac” file. For hot updates, you only need to download the “.luac” file and place it in the priority search path. After the game restarts, the engine will prioritize loading the new code.

There is also another more aggressive way to achieve hot updates without needing to restart the game.

In Cocos, using LuaEngine as the entry point, the Lua code drives the C++ part of the graphics library, audio library, physics engine, etc. LuaEngine caches the code loaded using the luaL_loadbuffer interface, and by restarting the entire LuaEngine and clearing the cached code, you can reload the code file when needed without restarting the game. This way, you can achieve true “hot” updates without restarting the game.

In fact, Unity engine is similar, and you can use technologies such as xLua to write Lua scripts happily in Unity.

For hot updating images, you just need to clear the engine’s image cache. When the engine tries to render the interface using the image next time, it will not find the image in the cache and will naturally load the new image.

2. Games also Need to Optimize Package Size

In app development, optimizing the size of the installation package is an inevitable topic. Various implementation solutions such as compressing images, code, and dynamically downloading plugins are well-known to many. The size of the installation package for mobile games may not be as strictly required as that for apps. Popular games like “PlayerUnknown’s Battlegrounds” and “Honor of Kings” have installation package sizes close to 2GB. Although players may not be particularly concerned about the size of game installation packages, consciously reducing the size is still necessary, as the size can affect game conversion rates and, consequently, game revenue.

In mobile game installation packages, image resources account for the vast majority of the package size, mainly in PNG format. Usually, directly compressing PNG images results in lossy compression, and when the game engine renders them, the game interface may have a lot of noise. There is a compression solution that separates the Alpha channel, which you can refer to. A 32-bit transparent PNG image contains four channels: RGBA, with each channel occupying 8 bits. Separate the Alpha channel data from the RGBA channels and store it in a PNG8 image, while storing the remaining RGB data in a JPG format image. JPG format images can ensure high compression rates while maintaining image quality, achieving the goal of compressing image size. The compression ratio of this solution is approximately 70%.

During the game runtime, read both the JPG and PNG8 files into memory before using the textures, combine the RGB and Alpha data they contain, and then hand them over to OpenGL for rendering. This compression solution is simple to operate and does not require additional third-party library support at runtime.

3. Game Performance Optimization

Performance is a topic that developers can never avoid. Mobile games, like app development, need to pay attention to various performance indicators such as memory and frame rate.

Memory

  • Texture compression to reduce memory usage. As mentioned earlier in optimizing installation package size, compressing images also helps reduce memory usage. Lowering the depth of images is also a fast way to optimize memory usage, if acceptable by the art team.

  • Use sprite pools to reuse already created sprites, reducing the number of sprites created on the screen and promptly recycling unused memory.

  • Release unnecessary textures from the previous scene as soon as possible when switching scenes.

Frame Rate

  • Reduce Draw Calls. The process of each time the game engine prepares data and sends it to the GPU for rendering is called a Draw Call. In Cocos, sprites with the same texture, blendFunc, and Shader are merged into the same render command and submitted to the GPU. When we mention sprite atlas, it means merging many small images into one large image. This way, if multiple sprites using the same large image are rendered continuously on the screen, the CPU (may) merge them and submit them to the GPU together. Additionally, the order in which Cocos merges render commands is based on the order of sprites in the scene, so the final merge result may not be optimal. We can implement our own optimized merge logic.

  • Reduce the number of sprites that need to be rendered on the screen. If there are “grouped” elements in the screen that need to be drawn, such as the items of each player in the leaderboard, in Cocos, you can use CCRenderTexture to draw each “grouped” element to the texture bound by CCRenderTexture, and then replace the original items with CCRenderTexture. This is similar to implementing the onDraw function for your own View in Android development and is also a way to reduce Draw Calls.

  • Frame Spacing. When you truly encounter CPU-intensive tasks, such as requiring a large number of sprites on the screen, you can split them into different frames, making sure that each frame in the game is completed within the specified time to avoid frame drops.

Thoughts on Transitioning from App Development to Mobile Game Development #

The year 2018 was a rather lackluster year for the gaming industry. The game license approval process was put on hold and only recently has it started to slowly resume. It feels like a countless number of developers are fighting to secure a game license. However, from the current perspective, 2018 may indeed be the best year for the gaming industry in the next few years, as some industry experts have predicted. Games that could not obtain a license in China could only consider going overseas to seek opportunities. But going overseas requires local operation or finding overseas agents. Operating on your own may face challenges with adapting to the local market, as the art style or game content may not meet the demands of local players. On the other hand, finding overseas agents may pose the risk of them selling off the game code.

The era of wild growth in mobile games has long since passed. Six years ago, any game had the potential to become a hit, such as games like “Fishing Joy” and “Defend Radish.” They emerged during the years of the Android and iOS mobile phone boom. Nowadays, game players seek innovative gameplay and more refined gaming experiences. Games like MOBA (Multiplayer Online Battle Arena) such as “King of Glory,” SLG (Strategy and Simulation Game) like “The King of Nations,” and even niche games like “Mr. Love: Queen’s Choice” have continuously polished their gameplay to make players willing to spend money on in-app purchases. If you want to enter this competitive industry, you need to be cautious and carefully consider whether the target team aligns with your career development and whether it has profitability potential to avoid falling into traps.

1. Is it feasible to transition from app development to mobile game development?

In 2018 and 2019, the demand for app development positions in the job market is not as high as it was a few years ago. I have been asked by some students if transitioning from app development to mobile game development is appropriate. My answer to this question is: it’s possible to transition to a mobile game development position, and the difficulty is not as great as one might imagine.

Compared to app development, mobile game development is simply a different type of work that focuses on different areas, but the basic principles are the same. Many of the technical skills required in app development are also necessary in game development, such as performance optimization, networking, and I/O optimization. Furthermore, most of the core logic in games is platform-independent, so there is no need to worry about not being able to adapt to the new work content. Let me summarize the advantages and disadvantages of transitioning to mobile game development.

  • Advantages

Having a deep understanding of the mobile system allows you to quickly integrate into a game development team and contribute. For example, when I first joined a mobile game team, the top three crashes in every version were due to the game’s inability to find functions in the Android system through JNI (Java Native Interface). The crash rate due to this issue was always around 1%. At the time, because the team didn’t have a deep understanding of the system, there was no effective solution. However, by simply reading through the code that Android uses to find native functions, I was able to find a solution.

  • Disadvantages

After all, app development and game development are two different career paths, so transitioning brings its own pressures. Compared to students who directly entered the game industry after graduation, those who change careers relatively lack the foundation of technical accumulation and need to start with basic concepts, such as Draw Call, sprite sheet, OpenGL, and shaders. It requires a lot of effort to learn these new skills. Therefore, students who want to transition should be self-disciplined and actively work to fill these technical gaps.

2. Technical career roadmap after transitioning

Some students mention that the technical career roadmap for app developers is broad, and they are concerned that the road ahead for mobile game developers will become increasingly narrow, making it difficult to find other job opportunities in the future. It is normal to have this concern, as the market demand for mobile game development positions is significantly smaller compared to app development positions. However, this should not be a reason to be afraid of transitioning to mobile game development. I believe it is important to look at these two different career paths from a broader perspective and not get trapped in an endless pursuit of technical expertise. The risk lies more in the policies surrounding the gaming industry than in the technology itself.

Mini-games became popular in 2017 and 2018. Since entry into mini-game development is simple and quick, students who want to transition can start by trying their hand at mini-games. “Great things come in small packages.” After understanding the execution flow of a mini-game, you will gain a more intuitive understanding of game development.

Finally, I wish all developers a pleasant gaming experience!

Feel free to click “Share with a Friend” to share today’s content with your friends and invite them to learn together. I have also prepared a generous “Study Boosting Gift” for students who think deeply and actively share. I look forward to learning and progressing with you.