Как мы делали Getscript.ru

Getscript.ru — интернет-магазин по продаже скриптов для личного кабинета геткурса, готовых блоков для лендингов на геткурсе, скриптов для лендингов на геткурсе. В общем обгеткурсенный в хлам 🙂

Меня зовут Даниил Постнов, я дизайнер интерфейсов и соавтор проекта. В этой статье расскажу о создании этого продукта с нуля.

Мой партнёр Дмитрий Space. Матерый разработчик по Геткурсу. Автор скриптов и курсов по геткурсу.

Наша коллаборация с Димой произошла в одном из клиентских проектов. Всё началось с идеи и реализации готового решения для геткурса под названием Remake. Но это уже другая история, расскажу его позже.

Идея магазина

Идея пришла несколько месяцев назад. Дима уже продавал свои скрипты на сайте Гетхелперс. Ему не нравился застой на этом сайте, отсутствие улучшаемости продаж и продвижения. Он хотел создать свой магазин.

Изначально мы планировали сделать так, чтобы я на заказ сделал интернет-магазин на Тильде. Но в дальнейшем мне захотелось самому участвовать в проекте как дизайнеру, разработчику и администратору сайта.

Флексим

Флексить — упрощать по-русски. Этот термин ко мне пришёл из Бюро Горбунова. Если Бюрошники не успевают сделать проект в срок — они упрощают функционал. Я взял на вооружение эту идею.

Запускать такой проект 2−3 месяца — не вариант. Можно пропасть в правках пикселей, поисках лучшего цвета или градиента, расстановкой запятых в описании товаров. Короче, утонуть в попытках сделать идеально.

Я поставил себе дедлайн 7 дней. Через 7 дней магазин должен уметь продавать товары и принимать деньги.

Решили делать на Тильде, это быстрее. Супер функционала нам не нужно было: простые страницы, каталог товаров, корзина, возможность оплаты. Все это там есть.

Дизайн на старте не стал разрабатывать с нуля. У меня есть курс по Notion и там уже был дизайн лендинга.

Как мы делали Getscript.ru 1

Я решил не изобратеть велосипед: взял цвета, композицию и создал новый дизайн.

Как мы делали Getscript.ru 2

Для первой версии получилось обалденно. В процессе вёрстки дорабатывал дизайн и избавлялся от ненужных элементов.

В итоге получилась вот такая страница.

Как мы делали Getscript.ru 3

На дизайн и вёрстку ушло 3 дня.

Платёжная система

Платёжку сначала хотели подключать к Диминому юр.лицу. Но там всё было люто сложно и я за день подключил своей Юкассе как самозанятый. Классная штука, когда надо быстро подключить платежку.

Партнёрская программа

Такой проект будет развиваться быстрее с партнёрской программой.

Начали думать как такое сделать. В Тильде такого функционала нет. Приходит время костылей 🙂

Идём гуглить и нагугливаем статью про партнёрскую программу на Тильде через Google Docs. Павел Молянов золотой ты человек, спасибо!

По инструкции было всё просто:

  • Скопировать таблицы Павла
  • Подключить интеграцию с Google Docs через настройки Тильды
  • Протестировать

У нас получилась полная таблица заказов, а также страница под каждого партнёра, в которой партнёр может видеть покупателей, который привёл, сколько он заработал и сколько мы ему должны.

Все завелось с первого раза и я был счастлив, что получилось так быстро её запустить.

Как мы делали Getscript.ru 4
Таблица покупок
Как мы делали Getscript.ru 5
Таблица партнёра

Это работало через промокоды. Мы регистрируем партнёру промокод. Когда пользователь покупает с помощью промокода, покупателю даётся скидка 10% и заказ попадает в таблицу.

Страница партнёра в этой таблице вылавливает уникальный промокод и дублирует эту продажу себе.

Таким образом все заказы автоматически раскидываются по партнёрам с помощью их уникальных промокодов.

Доработка с utm_term

Нам хотелось, чтобы партнёры могли делать свои партнёрские ссылки. Чтобы пользователь на их сайте кликнул и любые продажи на нашем сайте засчитались им в таблицу.

Мы придумали делать такую ссылку: getscript.ru/?utm_term=ПРОМОКОД

Теперь при переходе на сайт он запоминал этот промокод и при покупке передавал нам его в таблицу.

Дима шарит в Google Docs и дописал таблицу, чтобы при появлении этого промокода из ссылки страница партнёра тоже его подхватывала.

Теперь мы даём партнёру промокод SASHA13 например.

Он его может передавать знакомым и они при его применении в корзине будут получать скидку 10%. Такие заказы попадут в таблицу по соответствию промокода.

С этим же промокодом он может делать ссылку getscript.ru/?utm_term=SASHA13. Здесь уже скидки для клиентов не будет. Но зато информация о заказе попадёт в таблицу по соответствию кода в ссылке.

Отправка товаров пользователям

Тильда придумана больше для физических товаров. Чтобы не надо было ничего отправлять по электронной почте.

У нас другая ситуация. После покупки скриптов мы должны высылать клиенту скрипты и инструкцю. Я слышал, что можно сделать через личный кабинет Тильды. Но подумал, что пользователям ещё нужно регистрироваться — решил поискать что-то попроще для пользователей.

Поспрашивал в чате клуба Тильды, нашёл сервис Sendpulse и нащупал идею. Купил тариф и пошёл пробовать.

Как это работает:

  1. Пользователь покупает товар
  2. Сендульс добавляет его в подписчики
  3. Смотрит переменную products
  4. Если там есть точное совпадение по названию товара — отправляет письмо.
  5. В письме мы ставим ссылку на страницу Notion с скриптами, которые мы создали заранее.

Как мы делали Getscript.ru 6
Так выглядело письмо
Как мы делали Getscript.ru 7
Так выглядела конечная страница товара, ссылку на которую получали пользователи

Как это выглядело в сендпульсе:

Как мы делали Getscript.ru 8

Под каждый товар надо было создать 2 блока: проверку на название товара и email.

Начнём с проверки на название. Ниже скрин настройки. Мы должны были выбрать переменную products и ввести название товара в поле «Значение переменной».

Как мы делали Getscript.ru 9

После этого надо было создать блок Email и подцепить его к успешному завершению проверки.

Как мы делали Getscript.ru 10

В настройках почты надо было ввести тему письма, выбрать шаблон.

Как мы делали Getscript.ru 11

А в шаблоне заменить название и ссылку на Notion страницу.

Как мы делали Getscript.ru 12

Почему этот монстр стал разваливаться

Первая проблема — не хватит места. Все эти блочки фильтров и email занимают место на холсте.

Этот холст имеет свой размер и его нельзя расширить. На скрине он показан на 95%.

Как мы делали Getscript.ru 13

В итоге визуально оценивая размер наших 22 товаров, мы понимаем, что холста-то хватит товаров на 60 максимум. А мы не планируем настолько себя ограничивать.

Вторая проблема — сложно управлять. После первых покупок мне посыпались сообщения от Димы: «Дань, этому скрипт не дошел, этой тоже, этому тоже продублируй».

И проблема даже была не в том, что были ошибки. А в том, что не знаешь каких править. Адекватного отлова ошибок нет при таком количестве плашек.

Сегодня 15 ноября и утром я тестировал новую систему доступа клиентов к скриптам — личный кабинет Тильды.

Я не выдохнул с облегчением, потому что это меньшее из зол. Здесь больше рутинных действий, но надёжнее структура, возможность отловить ошибку, легко её исправить и запас товаров уже 230.

Личный кабинет на Тильде

Я понимаю, что нифига не понимаю и нужна помощь. Снова иду в чат Клуба выпускников Тильды. Там Максим Васильев вызывается записать для меня видео-инструкцю. Спасибо ему 🙂

Я его задалбываю вопросами чуть-чуть и уже иду реализовывать.

В чем суть тут:

  1. Клиент покупает товары
  2. Тильда его автоматом регает у себя
  3. Ему приходит письмо на почту с логином и паролем
  4. Он авторизуется и видит список доступных ему страниц с скриптами

Вот так выглядит список доступных товаров после покупки и авторизации. На оформление скудно.

Как мы делали Getscript.ru 14
Список доступных страниц после покупки и авторизации

Что под капотом

Под капотом всё сложно 🙂 Вот инструкция по созданию нового товара. Я думаю будет уходить минут 30 на каждый товар.

Как мы делали Getscript.ru 15
  • Создаём товар в «Товарах».
  • Делаем публичную и скрытую страницу для каждого товара
  • Делаем группу в личном кабинете и назначаем ей скрытую страницу
  • Создаём сервис формы, привязанный к группе в личном кабинете
  • У каждой публичной страницы в корзине ставим этот сервис

Пока трудно, но надежда есть, потому что в кабинете Тильды больше контроля и он сам проще. Проверить у кого какие скрипты, кого-то подключить, кого-то отключить. Всё проще.

Как мы делали Getscript.ru 16

Распределение денег

Мы с Димой решили делить деньги по каждому скрипту. У части скриптов мы и авторы и соавторы. От Димы идут клиенты, я смотрю за сайтом и этими всеми штуками.

Но как-то деньги надо распределять по каждому товару. А ещё из суммы надо вычетать партнёрам, налоги, расходы, на развитие.

Я начал мутить это в ноушн. Создал список товаров с ценами и категорией распределения в одной таблице.

Как мы делали Getscript.ru 17

А вторую таблицу создал с самими продажами. В колонке «Товар» надо было просто выбрать товар из верхней таблицы. Всё остальное подтянется само.

Как мы делали Getscript.ru 18

Главная проблема — надо было всё это делать вручную. А это уже на старте плохая идея.

Дима предложил через ту же таблицу товаров, которую формирует сама Тильда при покупках. Я скептически отнесся, потому что так не верю в эксель.

Нарисовалась проблема. У нас в строке заказа, в колонке product все товары заказа записывюатся в одну строку. По одним товарам могу быть я автором и мне бОльшая часть денег, по другим Дима автор и бОльшая часть денег ему. А по третьим делится пополам.

Как мы делали Getscript.ru 19

Дима создал таблицу, которая раскладывает каждый заказ на товары.

Как мы делали Getscript.ru 20

Потом сделали сводную таблицу. Где уже калькулировались заказанные товары. Создали столбец Автор, где могли указывать авторство. Колонки с суммами распределяли деньги.

Нам надо было лишь добавить сюда все уникальные названия товаров и проставить авторство. Остальное эксель делает сам.

Как мы делали Getscript.ru 21

Вторая часть этой страницы собирала все цифры воедино. При перечислении денег надо было записывать, сколько отправил в ячейку колонки «Перечислено».

Как мы делали Getscript.ru 22

Я потренировался в эксельке и добавил вычет оттуда процент расходов.

Подарочные сертификаты

Клиент спросил нас о подарочных сертификатах 29 декабря. У нас их нет, но нет и функционала для в Тильде.

Пару часов фонового размышления и я придумываю решение.

Мы создаем подарочный сертификат как товар. На 500, 1000, 1500, 2000 рублей.

Как мы делали Getscript.ru 23

Пользователь кладёт сертификаты в корзину и оплачивает. После оплаты и=мне в телеграм падает заявка с суммой, товарами и почтой, куда нужно выслать промокоды.

Как мы делали Getscript.ru 24

Я сделал так, чтобы пользователь отмечал чей email он указывает: свой или получателя подарка. Потому что самому покупателю я просто вышлю промокоды, а вот получателю подарка я уже напишу красивое письмо с указанием имени покупателя.

Рутина. Есть в этой реализации доля рутины. Промокоды в тильде нельзя создавать автоматически, только руками. Каждую покупку промокода я буду создавать промокод в личном кабинете, а потом лично отправлять их нНа первое время я буду отправлять промокоды вручную со своего почтового ящика.

Конечно это не круто и надо что-то придумывать.

Продолжение следует …

Как удалить английскую раскладку на macOS Monterey

Я использую раскладку Бирмана. Но после добавления его расладок система не дает удалить английскую раскладку.

А жить с тремя раскладками это боль — всегда будешь перескакивать на стандартную.

Как удалить английскую раскладку на macOS Monterey 25

Решение

Как удалить английскую раскладку на macOS Monterey 26

Добавляете новый язык «Японский → Японский кана».

Как удалить английскую раскладку на macOS Monterey 27

Выбираете его слева и проставляете галочки в блоке «Режим ввода».

Как удалить английскую раскладку на macOS Monterey 28

После этого кнопка удаления будет доступна.

Все вместе в гифке

Как удалить английскую раскладку на macOS Monterey 29