arrow_backНазад до портфоліо

CryptoIkra

Система, де промо-лендінг, Telegram-магазин і гейміфікація працюють разом. Користувач переходить із лендінгу в Telegram-бот, оформлює замовлення (каталог → кошик → чек-аут), а бонуси та "Колесо фортуни" працюють як WebApp із фіксацією результатів у PostgreSQL.

Клієнт

CryptoIkra

Рік

2025

Послуги

UI/UX дизайнРозробкаTelegram-бот
web

Лендінг

Односторінковий промо-лендінг у темній "преміальній" стилістиці: чітка типографіка, чиста UI-композиція, акценти.

  • Hero з фоновим відео + адаптація під пристрій і орієнтацію.
  • CTA на Telegram та Instagram + перемикач мов.
  • Акуратні анімації, що підсилюють "дорогий" інтерфейс.
  • Оптимізація відео: стиснення, faststart, контроль завантаження.
  • Логіка перекладу через кастомний хук (підготовлено під масштабування мов).
ReactTailwind CSSFramer Motion
Дизайн лендінгу
shopping_bag

Магазин у Telegram

Бот-магазин у Telegram: каталог, кошик і оформлення замовлення за кілька кроків.

  • Каталог: категорії та картки товарів.
  • Кошик: додати/видалити, кількість, захист від помилкових станів.
  • Чек-аут: дані клієнта, збереження замовлення, склад у БД.
  • Бонуси: нарахування/списання, баланс.
  • Повідомлення: фото + текст + inline-кнопки в єдиному стилі.
  • Адмінка: розсилки та керування товарами/замовленнями.
Telegram APINode.jsPayment Gateway
Інтерфейс Telegram-магазину
casino

Колесо Фортуни

Промо-механіка як Telegram WebApp з серверною фіксацією результатів та бонусів у PostgreSQL — це важливо, бо виключає "рандом лише на фронті".

  • Колесо призів, UI результатів, модальні вікна.
  • Збереження результатів спіну в БД + нарахування призів/бонусів.
  • Логіка під імовірності випадіння призів (ваги).
  • API-інтеграція: WebApp → сервер → PostgreSQL.
Canvas APIPhysics EngineWebSockets
Telegram Mini App — колесо фортуни
cloud_done

Інфраструктура та деплой

Архітектура під ключ: один домен, HTTPS, кілька застосунків без конфліктів.

  • API: FastAPI + Uvicorn, проксі через Nginx /api/.
  • Роутинг домену: / — лендінг • /wheel/ — WebApp • /api/ — бекенд.
  • VPS / Ubuntu: systemd автозапуск, Nginx reverse-proxy.
  • HTTPS: Certbot (Let's Encrypt) + автооновлення.
  • Кешування: HTML без кешу, статика з довгим кешем і версіонуванням.
Stack: Python (Aiogram), FastAPI, PostgreSQL, React, TypeScript, Vite, Nginx, Ubuntu VPS, systemd, Certbot.
check_circleБезпека

HTTPS, захист від CSRF/XSS, валідація введення

speedПродуктивність

Кешування статики, оптимізація медіа, CDN-ready

syncАвтооновлення

Systemd + скрипти деплою, zero-downtime

analyticsМоніторинг

Логи, метрики, алерти при збоях

CryptoIkra — кейс | Aura Web Agency