re-block чат · наша модель, вход по паролю

Как работает чат

Секции пишутся прямо в панели, разговором. Ничего не носить буфером, ничего не ставить у себя: модель наша, правила Вайб-блока зашиты, файлы ложатся в вашу папку по одному, по мере готовности. Сборка, правка и заливка живут в одном окне.

Подписки нет — платите только за генерацию. Баланс пополняется в панели и списывается по расходу — сколько модель написала, столько и стоило. Порядок цифр: секция обычно 11–15 ₽ (первая в проекте — до 60 ₽), лендинг целиком 150–300 ₽, смотря сколько раз переделаете. Ссылку на расширение и пароль пока выдаём вручную — напишите в телеграм @vitas_gref. Подробнее — в «Что стоит знать» ниже.

Что понадобится

1Chrome — с расширением «re-block чат»: чат живёт в его панели, отдельной страницы у него нет.
2Пароль — вход в панель. Он же ключ к чату и подставляется сам — второго секрета нет. Один пароль работает на десяти машинах.
3Тильда — проект с Вайб-блоком и права на редактирование страниц.
4Папка — та же, что и для заливки. Пустая под новый проект или уже с секциями.

Порядок работы

Открыть панель и войти

Значок расширения открывает панель — боковой рядом с редактором Тильды, отдельным окном или обычной вкладкой. Вкладка выручает на маленьком экране: боковая панель отжимает у редактора треть ширины. Пароль вводится один раз, браузер запомнит вход сам.

Выбрать папку

Ту же, что и для заливки. Секции, README.txt, styles.json и картинки лежат в ней — у вас на компьютере. Наружу уходит текст разговора: бриф, ответы на вопросы, опись папки (имена файлов, размеры, размеры картинок в пикселях). Сами картинки из папки не уходят никуда.

Приложить, что уже есть

Всё по желанию — можно начать и с одной фразы:

  • Макет из Figma. Перетащите вкладку с макетом прямо на панель или вставьте ссылку из буфера — она узнаётся сама. В ссылке должен быть ?node-id=, иначе непонятно, какой фрейм разбирать. Панель сходит в Figma из вашего браузера и покажет разбор числами: поля и колонки сетки, границы полос, шаг рядов, палитра по частоте, начертания, кадры картинок. Наружу уходит только этот текст — ни токен, ни дерево макета к нам не попадают.
  • Референсы и PDF. До восьми файлов к брифу: картинки «хочу похоже на это» — общие или к отдельной секции — и PDF до 10 МБ с коммерческим предложением, прайсом, презентацией. Картинки ужимаются у вас же в браузере и уходят один раз, вместе с брифом: план снимает палитру, типографику и приёмы и пишет разбор словами. Что именно сняли — видно карточкой «Снято с референса».
  • Юридические тексты. Готовые политика, согласие, оферта ложатся на сайт слово в слово: панель верстает их кодом в цветах проекта, модели текст не отдаётся и пересказан не будет.
  • Дизайн-система. Поиск по 150 системам с образцами и палитрой. Выбрали — секции пишутся в её цветах и шрифтах. Выбор запоминается вместе с планом, чтобы вторая секция не приехала в чужих цветах.
  • Шрифты. Пара гарнитур с образцами, подобранная под бриф, свой купленный шрифт или те, что уже подключены к сайту в Тильде, — панель прочитает их сама.

Написать бриф и ответить на вопросы

Одна фраза о том, что за сайт. Первым делом панель спросит, лендинг это или сайт из нескольких страниц, — от этого зависят и меню, и число страниц. Дальше приходит план: страницы, секции на каждой, что в секции, плюс вопросы — технические страницы, шапка и подвал отдельными страницами или блоками, чего не хватает (id Метрики, телефон).

Телефоны, почта, адреса и ФИО уходят на сервер болванками той же длины, а в готовой секции возвращаются настоящими. Что именно подменится, панель показывает до отправки; таблица подмены хранится только в вашем браузере.

Разобрали макет — бриф можно не писать вовсе: жмите стрелку с пустым полем. В макете есть полосы, сетка, ритм, палитра и настоящие тексты — больше, чем в фразе, которую пришлось бы сочинить специально.

Выбрать, чем писать

Полоса над лентой со списком моделей. Отмечена та, которой панель пишет по умолчанию; остальные дешевле и короче. Не трогали — пишет отмеченная.

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

Собрать

Секции пишутся по одной и ложатся в папку сразу, а не в конце. Закрыли панель на середине — написанное осталось, разговор поднимется с того же места.

Править и заливать

Наведитесь на строку секции в списке — и правьте словами: переписывается одна секция, соседи не трогаются. К правке можно приложить до двух картинок — вставить из буфера, перетащить файлом или скрепкой. Скриншот модель посмотрит и поправит показанное; фото для сайта переключите под превью на «в папку» — оно ляжет в images/, секция сошлётся на него, а заливщик отправит его в Тильду.

Дальше заливка: страница из списка, Залить. До неё всё видно в превью — страница целиком, в песочнице, без Тильды. Картинки уезжают в файлы Тильды, код — в HEAD, заголовок и описание — в настройки страницы. Повторная заливка обновит только те блоки, чей текст изменился.

Что стоит знать

Сколько это стоит на самом деле Цифры не с потолка, а с живого проекта — портфолио актёра, девять секций. План к нему обошёлся в 14 ₽, секции — по 11 ₽ каждая, сборка финального файла — полтора рубля: 113 ₽ за всё задание. Обычно секция стоит 11–15 ₽, смотря сколько в ней всего, а первая в проекте — до 60 ₽. Но настоящая цена лендинга выше, и врать тут незачем: в тот же день план и десять секций были собраны и переделаны заново, и день целиком встал в 279 ₽. Переделка — обычный ход работы, а не сбой, и оплачивается она так же. Считайте 150–300 ₽ за лендинг, смотря сколько раз перебирать.
Первая секция в задании дороже остальных Вместе с ней модель первый раз читает весь свод правил Вайб-блока — это разовые 22 ₽ вместо 11. Дальше свод лежит у неё в кэше и стоит копейки, поэтому вторая и все следующие секции идут по 11 ₽. Пугаться первой цифры не надо: на девяти секциях разница теряется, а вот если сделать одну секцию и посмотреть на счёт, она бросается в глаза.
Бриф уходит не только в план, но и в каждую секцию Секции пишутся по одной, отдельными запросами. Та, что знает про себя только «блок с командой», сочинит и название конторы, и её тон. Поэтому лишние две-три фразы — чем занимаетесь, для кого, каким голосом говорите — окупаются на всех секциях сразу, а не только в плане.
Факты бриф не заменяет Телефоны, цифры, адреса и цены секции берут только из ответов на вопросы. Брошенное в брифе «работаем двенадцать лет» на сайте не появится, пока не пройдёт через опросник, — иначе цифра, сказанная вскользь, разошлась бы по лендингу как факт.
Разговор ничего не переписывает сам Спросите словами — «а почему нет блока с ценами», «тут что-то не то» — и получите ответ. Если из слов понятно, какую секцию править, панель назовёт её сама, наведёт прицел и подставит готовую формулировку. Секций в прицеле может быть несколько: стили Вайб-блоков изолированы, и «поменяй цвет кнопок во всех секциях» — это одна правка и шесть файлов, которые панель перепишет по очереди. Но перепишет только отправленная правка, а не сам разговор.
Дешевле — не то же, что выгоднее Разница между моделями видна не в отказах, а в тексте: секции короче, копирайт бледнее, изредка одна из дюжины обрывается на пределе длины. Поэтому список моделей стоит на виду, а не в настройках: это решение дизайнера, а не наша экономия.
Блок и страницу в собранный проект можно добавить «Добавь блок с отзывами после туров» — и в ленте появится карточка: имя файла, что в нём будет, после какой секции встанет. Пока не нажата кнопка, ничего не написано. Задание уже открыто, поэтому добавка его не стоит. Страницу в Тильде при этом надо создать руками: заливщик заливает в открытую, страниц он не заводит.
Эффект с CodePen — ссылкой Понравился пен — дайте ссылку, панель сама разложит его окна и скачает библиотеки. Пен ляжет отдельной секцией, стили запрутся под её класс и не тронут соседей. Или станет эффектом: движок — отдельным блоком, а нужным элементам готовых секций вы ставите его кликом в превью.
Витрина — из вашего каталога в Тильде Скажите в брифе, что нужна витрина, и выберите раздел каталога. Товары и цены подгружаются на опубликованной странице сами, поэтому после смены цены в Тильде перезаливать секцию не нужно. Кнопка кладёт товар в родную корзину Тильды. С localhost магазин Тильды не отвечает — живой витрину видно только на сайте.
Правки в панели СТИЛЬ переживают заливку Тексты, ссылки, фото и стили, поправленные в панели, заливка переносит в новый код, если файл на том же месте не менялся. Кнопка «Забрать правки из Тильды» впишет их в файлы — тогда их увидит и чат. Перестраивать секцию лучше через чат: перестройку из панели заливка не переносит.

Если что-то пошло не так

Секция приехала обрезанной

Предел длины ответа. Чаще всего это дешёвая модель на длинной секции: переключите полосу моделей на основную и попросите переделать именно эту секцию — соседи не тронутся.

Панель не видит ссылку на макет

В ссылке нет ?node-id=. Возьмите её из адресной строки Figma, выделив нужный фрейм, — тогда номер появится сам. Ссылка на файл целиком не годится: непонятно, какой из кадров разбирать.

Figma отвечает отказом

Нужен личный токен: Figma → Settings → Security → Personal access tokens, права File content: read. Вставляется один раз в саму карточку и лежит в хранилище расширения у вас в браузере; ходит только на api.figma.com. Разрешение на этот адрес Хром спросит при первом нажатии — это нормально.

Закончили с макетом — отзовите токен у себя в Figma. Панель на этом ничего не потеряет.

Секции разъехались по цветам

Значит палитру не закрепили: без дизайн-системы и без макета она собирается по брифу, и на длинном проекте может дрейфовать. Выберите дизайн-систему или приложите макет — выбор запоминается вместе с планом и держит все секции в одних цветах.

Блок не сохранился в Тильде

Почти всегда — слишком большой код секции: около 120 000 знаков у Тильды потолок. Попросите разбить секцию на две — это родной для Тильды способ, а не костыль.

Что-то сломалось, и непонятно что

Под последней ошибкой в чате есть кнопка Сообщить о проблеме. Она отправит нам ошибку и шаг, на котором она случилась, — разбираться будем по ней, пересказывать не нужно.