Сервис Конфигуратор
В экосистеме ТАСС существовал старый «Конфигуратор» — инструмент для управления контентом с ограниченным набором функций, работавший только с основным сайтом. У каждого домена третьего уровня при этом были свои несвязанные между собой админки. Цель проекта — создать единую админку для всех цифровых проектов экосистемы ТАСС: с управлением контентом, созданием страниц, рубрикацией и конструированием новых доменов, полностью без участия разработчиков.
До запуска нового Конфигуратора управление контентом в ТАСС было фрагментированным:
- Старый Конфигуратор работал только с основным сайтом и не позволял создавать новые страницы (нужны были разработчики), заводить рубрики с подтягиванием из БД (структура была зашита в коде) или гибко редактировать блоки за пределами заранее заложенных.
- У доменов третьего уровня — отдельные несвязанные админки: доработка требовала ресурсов, а обучение сотрудников каждой новой системе — времени.
- ТАСС работает 24/7, страницы должны обновляться мгновенно, но единого инструмента для этого не было — редакторы переключались между системами, а для серьёзных правок звали разработчиков.
Полный список задач, которые должен закрыть новый Конфигуратор, — в разделе «Ожидаемый результат» ниже.
- Переключение между разделами, поиск блока, загрузка медиа — секунды, а не минуты.
- Визуальный стиль блоков меняется со временем и по проектам — административный интерфейс должен оставаться неизменным.
- Система должна одинаково хорошо работать и для лендинга из 3 блоков, и для проекта с сотнями страниц.
- Редакция и маркетинг — профессионалы в контенте, не технические специалисты; нужна прозрачная навигация и понятные подсказки.
- Неточности в легаси-коде всплывали по ходу разработки, ранее дизайн приходилось адаптировать «на лету».
Спроектировала интерфейс, сфокусированный на единстве, скорости и безопасности:
- Интервью с редакцией. Поговорила с главным редактором сайта, редактором выпуска и бильд-редактором. Выяснила: к текущим инструментам все уже привыкли, но очень хотели бы сами создавать новые рубрики и страницы без разработчиков. Отдельная боль — медиабиблиотека для загрузки: свалка неразобранного контента без единообразных тегов, из-за чего ничего не находилось по ключевым словам. Из-за этого бильд-редактор хранила фото и видео у себя на компьютере и кадрировала, подписывала и оформляла копирайт заново перед каждой загрузкой, вместо того чтобы искать уже готовое в библиотеке.
- Создание страниц и рубрик. Добавила возможность создавать страницы и рубрики с подтягиванием из БД — этого функционала не было в старом Конфигураторе.
- Отказалась от WYSIWYG в пользу таблиц и полей ввода. Визуальный стиль блоков ТАСС меняется почти с каждой сменой руководства — по статистике каждое новое руководство пересобирает визуал агентства заново. Сделай Конфигуратор визуально повторяющим текущий сайт — при следующем редизайне пришлось бы переделывать и админку. Табличный вид не завязан на актуальный визуал, а заодно избавляет от лишних кликов: весь контент блока — редактирование, удаление, перемещение — происходит внутри одной таблицы, без перехода между экранами. Мгновенную обратную связь компенсирует «Предпросмотр»: перед публикацией результат можно посмотреть сразу на трёх типах устройств — десктоп, планшет, мобильный.
Пример экрана редактирования блока в старой версии Конфигуратора
Пример табличного отображения редактирования блока с материалами в новой версии Конфигуратора
- Отказалась от модальных окон. Создание страницы, добавление блока, архивация — всё инлайн на странице редактирования, без потери контекста. Модалки — только для критических подтверждений (удаление) и обращений к бэкенду.
Компонент редактирования данных в ячейке таблицы
Пример экрана редактирования элемента в ячейке таблицы
- Прозрачный интерфейс — подсказки, превью-мокапы и описания для каждого компонента.
Компонент карточки-превью для добавления блока в конструктор страниц
- Одинаковая структура для всех доменов через сайдбар проектов.
- Медиавиджеты для фото, видео и SVG с учётом ограничений легаси-кода.
Часть user story для добавления и редактирования галереи
Компонент карточки медиавиджета и описание его сценариев работы
- User Stories для всех ролей — закрыли логические разрывы ещё до разработки.
| Действие |
Админ |
Суперадмин |
| Материалы в блоках: добавить / переместить / удалить / редактировать | ✓ | ✓ |
| Видео в видеоплеере: добавить / удалить / переместить / редактировать | ✓ | ✓ |
| Те же действия в галереях | ✓ | ✓ |
| Блоки: добавлять / наполнять / перемещать | ✓ | ✓ |
| Создавать новые статические страницы | ✓ | ✓ |
| Публиковать изменения и блоки | ✓ | ✓ |
| Создавать / удалять трансляции в пресс-центре | ✓ | ✓ |
| Редактировать meta-данные страниц | — | ✓ |
| Добавлять свои иконки и логотипы в медиабиблиотеку | — | ✓ |
| Создавать / удалять домены третьего уровня | — | ✓ |
| Редактировать админов (добавлять / удалять) | — | ✓ |
| Создавать новые рубрики | — | ✓ |
админ видит и редактирует только те домены, к которым доступ открыл суперадмин; у суперадмина доступ есть ко всем доменам
User Stories для сценариев работы со страницей и черновиком страницы
(проект в разработке, часть решений ещё предстоит подтвердить после релиза)
- Редакторы впервые смогут самостоятельно создавать страницы и рубрики с подтягиванием из БД для любого проекта.
- Правки главных страниц будут публиковаться за секунды, а не часы — за счёт приоритизации и быстрой навигации.
- Разрозненные админки заменит один интерфейс — без переобучения под каждую систему.
- Маркетинг сможет запускать новые домены третьего уровня без разработчиков.
- Единая точка входа для администрирования всех цифровых проектов ТАСС.
Ключевая цель: сократить время от потребности до публикации с часов до секунд, сохранив интерфейс интуитивным для нетехнических пользователей.
А теперь расскажу подробнее об одном кейсе: модуль «Конструктор страниц»
Сотрудники без технических навыков должны были получить возможность самостоятельно: создавать страницы внутри любого проекта, добавлять и переставлять блоки из библиотеки ~30 типовых компонентов, редактировать метаданные (тайтл, описание, ключевые слова) и переносить устаревшие страницы в архив с возможностью восстановления — раньше всё это требовало участия разработчиков.
Спроектировала модуль «Конструктор страниц» как часть единого Конфигуратора:
- Создание страницы. Кнопка «Добавить» открывает мастер с минимальным набором полей — название и URL. После создания страница сразу доступна для наполнения.
- Добавление блоков. Библиотека блоков (~30 типов) с превью-мокапом, названием и описанием у каждого. Редактор перетаскивает нужный блок на страницу, настраивает через таблицы и поля ввода, проверяет через «Предпросмотр».
Экран выбора блока для добавления на страницу
Экран с добавленными на страницу новыми блоками
- Архивация. Кнопка «В архив» в списке страниц — архивные страницы скрыты с сайта, но доступны для восстановления в отдельной вкладке «Архив страниц».
Блок редактирования мета данных страницы, домена
Вкладка «Архив страниц» домена tass.ru
- Единая логика для всех проектов — один интерфейс и сценарии и для основного сайта, и для доменов третьего уровня.
