Online education · Telegram ecosystem

Global China Code

Procurement training from China for Mariia Tyshchenko’s audience. We didn’t just build a website, but a closed system: a landing page with payment, an educational Telegram app, two bots, a custom admin panel with mini-CRM, and Instagram automation. From a comment under a post to an open lesson, the client’s journey is fully automated.

https://marryykuu.com.ua — open the client’s website in a new tab

UI/UX design
Web development
Telegram Mini App
Telegram bots
Automation
CRM and analytics

First screen of the Global China Code landing page

Get a free audit today Discuss

How we achieved the result

Sales without a manager

The landing page accepts payment, receives the bank’s response, and grants access to the course automatically. No more waiting for delayed bank confirmations.

Learning inside Telegram

Instead of a password-protected platform — an app inside the messenger: lessons, progress, grades, and a delivery calculator. Login is verified via Telegram signature.

Management without a developer

The owner edits lessons, pricing, bot texts, and Instagram keywords in the admin panel. No release needed to update content.

Process

Key steps we took:

1
Design
- Prototype in Figma
- Token-based design system
- Desktop and mobile versions
2
Landing page
- Twelve sections
- Custom animations
- Legal pages
3
Payment
- Payment integration
- Installment payments
- Foreign card payments
4
App and bots
- Mini App with lessons
- Access granted by code
- Bot support
5
Automation
- Mini-CRM
- Funnel and analytics
- Instagram keywords
6
Reliability
- Automated tests before release
- Guards in Telegram
- Daily backups

What’s changed in the process

Left — how it worked before us, right — how it works now.

Before Became

BeforeThe bank confirms payment with a delay — the customer has already paid and is waiting

BecamePayment is recorded even before redirecting to the bank, background reconciliation every minute grants access automatically

BeforeA single bank decline would hide the order forever

BecameThe decision is made based on the latest status, not the first

BeforeThe lesson link worked for everyone and had no expiration

BecameThe link is personal, signed, valid for three hours; the player refreshes it automatically

BeforeUnclear who grants access

BecameA viewer ID flashes on screen periodically; alerts the owner if one account is used from four addresses in a day

BeforeAn Instagram request could receive two identical auto-messages

BecameOne sender and seven safeguards against duplication

BeforeIf someone entered their phone and left, the lead disappeared

BecameA draft is saved, and after 30 minutes the manager gets a reminder

BeforePayment went through but no access — only found out from the client

BecameA guard checks every 5 minutes and alerts 20 minutes after payment

BeforeA student made a purchase and disappeared

BecameReminder after three days without opening, no more than twice per person

Colors

#E8610A Action — all CTAs
#1B2B57 Navy — numbers
#951414 Stamp — Chinese accent
#F7F5F0 Cream — base
#14171F Ink
#5B6270 Grey

Typography

Montserrat Montserrat for text, Playfair Display for highlights, Bebas Neue for bold headlines. Orange is for action, blue is for numbers.

Web design

Landing page with animated watermark, customs stamp, and a button with a glowing snake; auto-carousel of audiences, polaroid cards of real purchases with savings calculations, a strip of eight branded packages, and a training program. Next — mobile version and app screens: lesson library, lesson with workbook and assessment, module, China delivery calculator, and the “More” section.