Назад к портфолио
2023UI/UX Designer, Product Designer, Frontend Developer

YeaWorksBot — Интернет‑визитка в Telegram 24/7

Интернет‑визитка в Telegram с круглосуточной доступностью: быстрые ссылки на соцсети, поддержка донатами и переход на сайт с мерчем.

Telegram
Bot
Landing
Design System
Donations
Merch

Контекст

Идея — создать лаконичную и доступную 24/7 интернет‑визитку в экосистеме Telegram. Решение должно работать как точка входа для аудитории исполнителя: предоставить быстрый доступ к соцсетям, возможность поддержать деньгами и отправить пользователя на сайт с мерчем.

Задача

  • Спроектировать простую и понятную навигацию в рамках Telegram UI
  • Обеспечить мгновенный доступ к соцсетям и внешним ресурсам
  • Реализовать механики поддержки исполнителя (донаты/пожертвования)
  • Добавить ссылку на сайт с мерчем
  • Обеспечить стабильную работу 24/7 и быстрый отклик

Процесс

Дизайн

  • Спроектирована минималистичная визуальная система, гармонирующая с тёмной/светлой темой Telegram
  • Подготовлены иконки и иллюстрации, единая типографика, отступы и сетка
  • Прототипирование пользовательских сценариев: «Поддержать», «Соцсети», «Мерч», «Контакты»

Реализация

  • Настроены быстрые кнопки (inline‑кнопки) с доступом к соцсетям
  • Раздел «Поддержать» со ссылками на платёжные шлюзы/донаты
  • Переход на внешний сайт с мерчем
  • Логи событий и обработка ошибок

Возможности

  • Быстрый доступ: Telegram‑кнопки к основным соцсетям
  • Поддержка: донаты/чаевые через платёжные сервисы
  • Мерч: ссылка на сайт магазина
  • Простая админ‑логика: изменение ссылок/текста без редеплоя

Результаты

  • ⚡ Время до целевого действия < 2 кликов
  • 🕐 Круглосуточная доступность без простоя
  • 🎯 Чёткая структура: пользователи сразу находят нужные действия
  • 🧭 Единый хаб ссылок вместо разрозненных профилей

Технологии

  • Telegram Bot (Bot API)
  • Node.js, TypeScript
  • Хостинг на VPS с процесс‑менеджером (PM2)

Роль

Полный цикл: дизайн всех экранов и элементов, настройка сценариев, наполнение контентом и базовая реализация логики бота.

Уроки

  • Лаконичность интерфейса повышает конверсию в нужные действия
  • Наличие «центра ссылок» в Telegram упрощает коммуникацию с аудиторией