One Click: справочный портал ES/EN с редактором для заказчика

Ко мне пришла команда платформы One Click (one-click.app) — это конструктор QR/NFC-страниц с испаноязычной аудиторией в Перу. Продукт международный, растёт, и у него не было нормального руководства пользователя. Нужна была справка сразу на двух языках — испанском как основном и английском как втором. И главное требование: чтобы сотрудники заказчика могли править её сами, «как в Тильде», не дёргая каждый раз разработчика из-за одной опечатки или нового раздела. Ниже рассказываю, как я это собрал.

С чем пришёл клиент

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

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

Что я сделал

Я разбил работу на два шага, чтобы не смешивать «сделать красиво» и «сделать управляемо».

Сначала — аккуратная статическая справка. Адаптивная вёрстка под телефон и десктоп, светлая и тёмная тема, переключатель языков ES/EN прямо в шапке. Внутри — скриншоты интерфейса платформы, понятные иконки у разделов, разбивка на шаги. Отдельно проработал мета-теги и карточки для мессенджеров: когда ссылку на справку пересылают, она разворачивается в нормальный превью с заголовком и картинкой, а не в голый URL. На этом этапе я получил эталон дизайна — то, как справка должна выглядеть всегда, при любом наполнении.

Второй шаг — собственная CMS на моём сервере, чтобы заказчик редактировал контент сам. Ключевая идея: сотрудник работает не с кодом и не с «сырым» текстом, а с готовыми блоками, из которых собран тот самый эталонный дизайн. Что бы он ни добавил, страница остаётся в едином стиле — сломать вёрстку неудачной правкой практически нельзя. Подробнее про подход к таким базам знаний я писал в кейсе о справочном портале.

Редактор и ИИ-перевод для заказчика

Контент в CMS устроен блоками. Есть заголовки, шаги инструкций, подсказки, предупреждения, списки, картинки и встроенные видео с YouTube и Vimeo. Сотрудник добавляет нужный блок, двигает его вверх-вниз, редактирует текст с форматированием, загружает изображения — и всё это без единой строчки кода. Каждый тип блока заранее оформлен под общий дизайн, поэтому справка не рассыпается, сколько бы разделов в неё ни добавили.

Отдельно я встроил ИИ-перевод, и это решило главную боль двуязычности. Сотрудник пишет раздел на испанском, нажимает кнопку — и пустые английские поля заполняются переводом. Дальше человек проверяет текст и сохраняет. Важная деталь: перевод затрагивает только пустые поля. Если английскую версию уже вычитали и поправили руками, ИИ её не перезатирает — ручная работа остаётся в неприкосновенности. Получается связка «машина делает черновик, человек утверждает», а не слепая автозамена.

Ещё в CMS есть админка с ролями. Суперадмин раздаёт доступы сотрудникам, каждый работает в своей зоне ответственности. Заказчик реально наполняет систему — там уже десятки блоков, несколько разделов, встроенные видео и загруженные картинки. Это не демо ради галочки, а живая, работающая справка.

Что получил клиент

Главный результат — заказчик сам ведёт справку на двух языках и больше не зависит от программиста в ежедневной работе. Добавить раздел, поправить шаг, вставить новый скриншот или видео, перевести материал на английский — всё это делают его сотрудники внутри админки.

При этом для конечного пользователя справка выглядит частью продукта, а не сторонним сервисом. Она отдаётся под адресом самого клиента — one-click.app/help — через реверс-прокси на их стороне, тогда как сам сервис живёт на моём сервере. Снаружи это единый бесшовный продукт: пользователь остаётся в домене One Click и даже не догадывается, что справкой управляет отдельная система. Никаких выдуманных метрик приводить не буду — ценность здесь не в цифрах, а в том, что документация перестала быть узким горлышком и стала живым инструментом команды.

Кому подойдёт такое же

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

Особенно хорошо ложится там, где важно править контент своими силами: маркетинг и поддержка хотят вносить изменения сразу, без очереди к разработчикам, но при этом без риска сломать дизайн. И, конечно, для международных команд, которым нужен управляемый перевод — с ИИ-черновиком и обязательной проверкой человеком. Похожую логику «быстро и самим» я разбирал в кейсе про сайт сети кофеен.

Частые вопросы

Смогут ли сотрудники править справку без программиста? Да, для этого всё и делалось. Работа идёт через блочный редактор в админке: добавить блок, передвинуть, отредактировать текст, загрузить картинку или вставить видео. Код при этом трогать не нужно, а дизайн остаётся единым.

Как работает ИИ-перевод? Сотрудник пишет материал на испанском и нажимает кнопку — пустые английские поля заполняются машинным переводом. Человек его проверяет и сохраняет. Уже вычитанные вручную переводы ИИ не перезаписывает, так что ручная правка не теряется.

Можно ли добавить ещё языки? Архитектура на блоках и полях это допускает: языковых версий может быть больше двух. Логика та же — черновик от ИИ, проверка человеком, аккуратное сохранение без затирания готового.

Где физически живёт справка? Сервис работает на моём сервере, но пользователям отдаётся под адресом one-click.app/help через реверс-прокси заказчика. Снаружи это единый продукт под их доменом.

Коротко о главном

Для международной платформы One Click я собрал двуязычную справку (ES/EN) и собственную CMS под неё: блочный редактор, загрузка картинок, встроенные видео и ИИ-перевод с обязательной проверкой человеком. Заказчик ведёт документацию сам, без программиста, а страница отдаётся под его же доменом. Если у вас есть продукт с документацией или многоязычная база знаний, которую хочется править своими силами и держать в едином стиле — напишите мне, обсудим, как сделать похожее под вашу задачу.