The popularity of TON ecosystem in the gaming field has attracted a large number of developers, but from a technical perspective, there are still high barriers for many developers to build game applications based on TON due to issues such as EVM compatibility and development language. Zypher Network, as the most advanced blockchain game development engine, supports the expansion of Web2 games into dApps, has developed a large number of plug-ins, and supports developers to quickly deploy games developed based on CocosCreator in the Telegram ecosystem, greatly reducing the threshold for developers to develop games based on the TON network.

Developer documentation: docs.zypher.network/blog/cocos-tg/

The new hot spot in the field of on-chain games: TON ecosystem

TON (The Open Network) is becoming one of the most popular public chains in recent times. It has attracted a lot of attention in a short period of time through its deep integration with Telegram, a social platform with 900 million users. Applications developed based on TON can be seamlessly integrated into Telegram in the form of "applets". Users can directly use Telegram as an entry point to access and use various dAPPs in the TON ecosystem, which greatly reduces the threshold for users to reach.

At this stage, the TON ecosystem is becoming a new hotspot for small games on the chain. In addition to the low development cost and the low overall transaction cost of the TON chain, games on the chain can make full use of Telegram's huge traffic pool to convert and fission users, and the Telegram "applets" in it can naturally be combined with game products to enrich the extended functions and seamlessly support data storage, interactive games, and transaction payments. Based on this, game projects on the chain can use these functions to provide a variety of gameplay and economic models.

In fact, the popularity of some small games also confirms the above view. For example, the popularity of click games based on Telegram. The popular representative Notcoin has attracted more than 35 million users by rewarding users for clicking the screen. Hamster Kombat has disclosed user data and said that its cumulative users have reached 200 million. Catizen, a small task game with cats as the theme, has more than 20 million users and more than 500,000 paying users. Even Notcoin's imitation Yescoin has already exceeded 6 million subscribers.

The on-chain mini-games and the TON ecosystem also complement each other. Judging from user data, since the beginning of 2024, the TON ecosystem has emerged as a dark horse driven by a series of popular mini-games. As of mid-August, more than 12 million on-chain wallets have been activated (about 1 million in January), and the number of active wallets per month is 4.2 million (about 300,000 in January).

At present, the TON ecosystem has also attracted a large number of Web2 and Web3 game developers to join in, hoping to capture early dividends from the huge attention system.

Technical barriers of the TON network

In fact, TON uses a virtual machine called TVM (TON Virtual Machine), which supports smart contract programming languages mainly FunC and TVM instruction set (although FunC looks a lot like C language, it is generally not known or respected). These languages and virtual machine architectures are quite different from Ethereum's EVM and Solidity programming languages. At the same time, TON's design includes a multi-threaded blockchain architecture that allows different shard chains to run in parallel. This architectural design can improve network performance, but it also increases the complexity of development. Developers need to understand how to effectively coordinate data and logic between multiple shards, which is more challenging than the traditional single-chain architecture.

Therefore, whether it is Web2 developers or Web3 developers, they will more or less face certain development thresholds when facing the underlying layer of TON.

Zypher Network

Zypher Network is a new generation game engine solution with zero-knowledge proof technology as its core. It can help developers enter the blockchain field more easily and expand the on-chain functions in a modular and pluggable way, so as to greatly reduce the threshold for developers to build blockchain games. At the same time, Zypher Network further builds a set of underlying game facilities that can serve blockchain games based on the existing on-chain facilities, and provides perfect support for the decentralized operation of games.

At this stage, Zypher Network has launched a Services SDK toolkit for developers, where developers can directly use "inherent" zero-knowledge functions such as Shuffle, Rollup, etc. in a plug-and-play manner for development without having to understand the complexity of zero-knowledge circuits. This user-friendly approach can be implemented immediately, greatly simplifying the development process. At the same time, the toolkit provides a variety of gadgets and circuits that developers can "assemble" with minimal coding effort, similar to building with Lego bricks. The modular approach makes it possible to create customized circuit logic to meet specific requirements. Developers can start with basic operations and gradually build more complex logic to meet their needs.

In addition, in order to adapt to the vast majority of chain standards, the framework further supports third-party domain-specific languages (DSLs) and zero-knowledge virtual machines (ZKVMs) for game logic writing, and provides on-chain verification SDKs customized for these systems to provide more flexibility and customization options.

Based on the above development toolkit, developers can deploy applications on different chains with low barriers based on their familiar languages, and ensure efficient and low-cost operation of games based on Zypher Network's zk technology solution. Some Web2 games can even be directly expanded into dApps based on the engine and deployed on the chain.

At the same time, in order to provide users with a product-level zk experience, Zypher launched an economic model centered on token "staking", that is, players and on-chain verifiers (network miners) can capture resources from the network by staking Zypher tokens.

• From the perspective of miners, the Zypher Network will delegate zkp tasks to them (helping games in the network to perform zero-knowledge verification and upload them to the corresponding chain), and they will be rewarded for completing zero-knowledge verification work. The more Zypher tokens miners stake, the stronger their ability to process zero-knowledge tasks in parallel, and the higher the reward for a single task.
• From the perspective of players, by staking Zypher tokens, players can participate in high-quality on-chain games for free. The more tokens they stake, the faster the game's proofs are generated, the better the gaming experience, and the more rewards they may receive.

Based on the incentivized staking economic model, more validators are mobilized to participate in the operation of the network, further improving the efficiency of network operation. Players can also actively participate in different games due to the incentive bonus provided by staking, thus capturing active users on a large scale for high-quality games.

Currently, Zypher Network can support developers to develop games using CocosCreator and quickly deploy them to the TON chain. The following is the first part of the deployment tutorial, which is how to quickly deploy games developed based on Cocos Creator to Telegram.

Beginner's Guide: Quickly deploy TON games with Cocos Creator in five minutes (Part 1)

1. Understand Cocoscreator

Official Website

• Cocos official website: cocos.com/

Document address

• Cocos Creator documentation: docs.cocos.com/creator/manual/en/
• Cocos Creator API reference: docs.cocos.com/creator/api/en/

Forum Address

• Cocos official forum: forum.cocos.org/

2. Introduction to Cocoscreator versions (1.x is basically unusable, most of them are 2.x, 3.x 3D games are more common)

Cocos Creator is a complete game development solution that provides an integrated development environment and supports 2D and 3D game development. Cocos Creator uses component-based and data-driven workflows to simplify the complexity of game development. It is based on the Cocos2d-x engine and has strong scalability and flexibility.

Key features include:

• Component-based design: Developers can quickly build game logic by dragging and dropping components.
• Cross-platform support: Supports exporting to multiple platforms, including Web, iOS, Android, Windows, Mac, etc.
• Rich editing tools: Provides scene editor, animation editor, particle editor, code editor, etc.
• Script support: Game logic is mainly written in JavaScript and TypeScript.

Cocos Creator main versions and their differences

Cocos Creator 1.x series

Cocos Creator 1.x is the earliest version of Cocos Creator, and its main features include:

• Basic functions: basic scene editing, component system, animation editor.
• JavaScript support: JavaScript is mainly used as the scripting language.
• Basic plugin system: allows developers to extend editor functionality.
• Web and Native Platform Support: You can export to web and native platforms (iOS and Android).

Cocos Creator 2.x Series

Cocos Creator 2.x series introduces many improvements and new features:

• Performance Optimization: Improved engine performance, especially on mobile devices.
• TypeScript support: TypeScript support is introduced to enhance the maintainability and type safety of the code.
• Physics engine integration: Built-in Box2D and Chipmunk physics engines, supporting 2D physics effects.
• Resource Management Optimization: The resource management system has been improved to make resource loading and management more efficient.
• UI system enhancement: The UI components and layout system have been enhanced to provide more powerful UI editing capabilities.

Cocos Creator 3.x Series

Cocos Creator 3.x series is a major version update, with the following main features:

• 3D support: Fully supports 3D game development and provides rich 3D functions and editor tools.
• Unified engine architecture: Integrates 2D and 3D engines, providing consistent APIs and workflows.
• Rendering engine update: A new rendering engine has been introduced, which supports advanced effects such as PBR (physically based rendering), global illumination, and shadows.
• Enhanced animation system: provides more powerful animation editing and playback functions, and supports complex animation effects.
• Improved cross-platform support: The export and publishing process has been further optimized to support more platforms and devices.
• Editor enhancement: Provides richer editor plug-ins and extension mechanisms to enhance developer productivity.

3. Start the source code project (if you bought a copy of the source code) See the document for details

1. Install Cocos Creator

If you haven't installed Cocos Creator yet, please install the latest version.

2. Open Cocos Creator

After the installation is complete, launch the Cocos Creator editor.

3. Open the project

1. Import the project :
2. In the Cocos Creator startup interface, click the Open Project button.
3. Browse to the source code folder of the Cocos Creator project you obtained, select the folder, and then click Select Folder.
4. Check the project configuration :
5. After the project is successfully opened, check the assets folder in the project to make sure all resource files are in the correct location.
6. Check Project -> Project Settings to make sure the resolution and other settings of your project are what you want.

4. Run the project

1. Select a scene :
2. In the assets folder, find your main scene file (usually the one ending in .fire or .scene).
3. Double-click the main scene file to open it in the editor.
4. Run the project :
5. Click the Play button (the green triangle button) at the top of the editor to preview and run the project in the editor.
6. If the project runs correctly, you will see the game screen in the editor's game window.

5. Build and publish the project to Web Mobile

1. Open the Build panel :
2. In the menu bar at the top of the editor, select Project -> Build.
3. Select Platform :
4. In the Build panel, select Web Mobile as the target platform.
5. Set build options :
6. Build Path : Set the folder path for the build output.
7. Start Scene : Select the scene to load when the game starts.
8. Main Bundle Compression Type : Select the compression type (such as None, Zip, JPG, etc.).
9. Zip Compression Level : If you select the Zip compression type, you can set the compression level.
10. MD5 Cache : Enable MD5 cache and add MD5 hash values to all resource files for version control and cache management.
11. Source Maps : Generate Source Maps files for easy debugging.
12. Debug Mode : Enable debug mode to preserve debug information and log output in published code.
13. Inline all Sprite Frames : Inline all sprite frames into one file.
14. Merge all JSON Files : Merge all JSON files into one file.
15. Build the project :
16. Click the Build button to start building the project.
17. After the build is complete, the build output files are generated in the set build path.
18. Release Project :
19. Upload the generated build output files to a server that supports HTTPS. You can use GitHub Pages, Netlify, Vercel, or other static website hosting services.

6. Debugging and Optimization

1. Enable Source Maps :
2. Enable the Source Maps option in the build panel to generate Source Maps files, which makes it easier to debug the released code.
3. After publishing, you can use Source Maps to debug your code in your browser's developer tools.
4. Enable MD5 caching :
5. Enable the MD5 Cache option in the Build panel to add MD5 hashes to all asset files.
6. This ensures that when users update the game they will not be loading old assets due to caching issues.
7. Debug mode :
8. Enable the Debug Mode option in the Build panel to preserve debug information and log output.
9. During release, if debugging is required, you can enable this option in the build panel.

7. Test items

1. Local testing :
2. Test the build output files on a local server to ensure the performance and compatibility of the game on different browsers.
3. You can use the Live Server plugin for VS Code or other local server tools for testing.
4. Online test :
5. After uploading the build output files to the server, test the online version to ensure that all functions are running normally.

Through these steps, you can successfully start and publish a Cocos Creator project source code to the Web platform, and understand the configuration and use of publishing properties such as debug mode and MD5 cache.

4. Take Protect Trump as an example, backend go code deployment instructions 3. Test environment configuration

core.telegram.org/bots/webapps#using-bots-in-the-test-environment

(To be continued)

Summarize

As the current mainstream game editor, Cocos Creator is being adopted by more and more developers. Its powerful functions, familiar programming process, flexible development environment and wide cross-platform support make it popular in the field of game development. Zypher Network is significantly reducing the threshold for game developers to deploy and migrate applications to the TON network through compatibility with Cocos Creator and integration with the TON network, further simplifying complex issues. After the game is successfully deployed, it provides support for smoother and lower-cost operation of the game based on the zero-knowledge proof solution.

As Zypher Network expands to more on-chain ecosystems, it will become the most important gaming infrastructure in the Web3 era.