Перейти до контенту
Telegram

ПослугиTelegram Mini App для бізнесуДизайн Mini App

Дизайн Mini App для Telegram

Дизайн Mini App для Telegram

Дизайн Telegram Mini App, з яким клієнт не думає, куди натиснути: застосунок бере тему самого Telegram, головна кнопка під пальцем, а замовлення займає кілька дотиків.

  • Усе індивідуально
  • Темна й світла тема
  • Кнопки під палець

Просто напишіть, а далі я сам. Порахую задачу безкоштовно.

5,0 · 37 відгуків або напишіть у Telegram

Кава Зернобот
Вчора
Ваш капучино готовий! Заберіть на касі.
Дякую!
Сьогодні
Кава напередбез черги · з 08:00Доброго ранку! Замовте каву наперед і заберете без черги.
Кава Зерноmini app

Зерно на Подолісьогодні о 09:12

Що приготувати?

Олена · +380 67 ··· ·· 12з Telegram

ОплаченоЗерно на Подолі · о 09:12

однією рукою на ходу

Гарний екран не продає, якщо кнопку не знайти

Людина відкриває застосунок посеред розмови, однією рукою, часто на ходу. Якщо їй доводиться шукати, куди натиснути, замовлення не буде, хоч які гарні кольори. Тому дизайн я починаю зі шляху, картинки потім: що клієнт хоче зробити і скільки дотиків на це піде.

Такий застосунок потрібен тим, кому вже пишуть у Telegram і в кого клієнт має щось вибрати: напій у кавʼярні, товар у магазині, час у салоні. Якщо питань небагато, може вистачити й бота з кнопками, і це видно вже з першої розмови.

Гордій Фісун · оновлено

дрібниці, які вирішують

Telegram Mini App дизайн: що я перевіряю

Дрібниці, через які застосунком користуються, а не закривають після першого екрана.

Обидві теми

Перемикаю тему в Telegram і проходжу кожен екран: текст читається, фото не губляться, нічого не сліпить уночі.

Однією рукою

Великі зони дотику, жодних дрібних посилань, які важко влучити пальцем.

Без зайвих полів

Ні реєстрації, ні пароля. Лишаю тільки ті питання, без яких замовлення не виконати.

Ясний фінал

Після оплати клієнт одразу бачить, що все пройшло, і отримує підтвердження в чаті. Вам приходить нове замовлення в Telegram.

Ваші слова на кнопках

Назви товарів, послуг і кнопок пишемо так, як говорять ваші клієнти, а не як звикли розробники.

Можна спробувати

На сайті є живе демо крамниці: складіть кошик і оформіть замовлення. Це робочий код, а не картинка.

у вашому застосунку

Що входить у дизайн Telegram Web App

Кольори з Telegram клієнта

Застосунок підхоплює тему месенджера: у темній темі екран темний, у світлій світлий. Тому він виглядає частиною Telegram, і нічого чужого раптом не відкривається.

Головна дія внизу

Кнопка «Замовити» чи «Оплатити» стоїть там, куди дістає великий палець. Спершу збираю і пробую все на телефоні, а компʼютер потім.

Мало кроків до оплати

Вибрав, додав, оплатив. Імʼя вводити не треба: хто замовляє, застосунок дізнається від Telegram.

Однаково на всіх пристроях

На iPhone, Android і компʼютері той самий застосунок і той самий вигляд. Клієнт нічого не встановлює.

Живе демо

Оформіть замовлення в кілька дотиків

У демо справжній робочий код. Складіть кошик, замовте і подивіться, що в ту ж секунду прийде вам.

Відкрити демо

від списку екранів

Від списку екранів до вашого телефона

Ви бачите застосунок на кожному кроці у своєму Telegram, без картинок.

  1. Шлях клієнта

    Розповідаєте, що клієнт має зробити: вибрати, записатися чи оплатити. Можна своїми словами, хоч голосовим.

  2. Список екранів

    Записую, які будуть екрани і що на кожному. Ви погоджуєте список, і лише тоді я сідаю за код.

  3. Пробуєте пальцем

    Відкриваєте живу версію у своєму телефоні, у темній і світлій темі. Що незручно, правимо тут же.

  4. Запуск

    Застосунок працює у вашому акаунті. Показую, як самим міняти тексти й товари, щоб не чекати на мене через кожну дрібницю.

5,0 · 37 відгуків

Усі гарантії й відгуки

Питання

Питання про дизайн

Що входить у дизайн Telegram Mini App?

Дизайн міні-застосунку в Telegram складається зі списку екранів, шляху клієнта від кнопки в чаті до оплати, вигляду в темній і світлій темі Telegram і кнопок, зручних під палець. Замість картинок я показую робочу версію у вашому телефоні.

Mini App підлаштовується під тему Telegram?

Так, Mini App бере кольори Telegram клієнта: у темній темі він темний, у світлій світлий. Тому застосунок виглядає частиною месенджера.

Чи можна погодити дизайн до того, як почнеться код?

Так, дизайн Mini App погоджуємо до коду: спершу список екранів, що на кожному і в якому порядку. Код пишу тільки після цього, а далі показую застосунок частинами у вашому Telegram.

Чим дизайн Telegram Web App відрізняється від дизайну сайту?

Telegram Web App відкривається всередині месенджера, найчастіше на телефоні, у вікні поверх чату. Тому в ньому менше екранів, головна дія внизу під пальцем і немає реєстрації, бо Telegram сам передає, хто клієнт.

Що підготувати до розмови про дизайн?

Для розмови про дизайн міні-застосунку досить одного реального прикладу замовлення: що клієнт вибирає, що вказує і як платить. Логотип і фото товарів, якщо вони є, теж знадобляться.

Чи зможу я сам міняти тексти й товари в Mini App?

Так, після запуску я показую, як це робити, і далі ви міняєте тексти й товари самі. Код і доступи на ваших акаунтах, тож навіть якщо підете, усе лишиться у вас.

Напишіть. Далі я сам.

Відповім найближчим часом.

5,0 · 37 відгуків

Ще на цю тему