Как устроена система управления контентом в издании «Медуза»

Редакция «Медузы» при помощи платформы Medium рассказала об организации «внутренней кухни» издания — его системы управления контентом. С разрешения авторов ЦП публикует статью полностью.

Монитор. Внутренний редактор «Медузы»

Центром жизни любого издания является его админка (она же CMS, она же внутренний редактор, она же бекэнд, как хотите, так и называйте, но мы для простоты будем называть ее ужасным словом админка, или Монитором). Здесь пишутся и публикуются тексты, в ней работает вся редакция. Качество админки определяет не только скорость работы, но и атмосферу в редакции: если админка медленная и неудобная, это вызывает постоянное раздражение тех, кто ею пользуется. Идеальная админка  —  та, которую не замечаешь. Кроме того, если админка плохая, редакция ненавидит отдел разработки. Если редакция ненавидит отдел разработки, они никогда не будут работать вместе. Если они никогда не будут работать вместе, можно забыть о новых медиа: никуда дальше публикации простого текста с картинкой вы не уйдете.

Возможно, админка  —  это вообще главная разработка для интернет-издания.

В общем, при разработке админки важно исходить из нескольких постулатов:

1. Ни в коем случае не отдавайте проектирование админки на откуп разработке. Единственный человек, который знает, что нужно, это редактор. Главное задавать правильные вопросы. Если к созданию админки не подключать редакцию, вы сделаете мертвую вещь: в ней будет много ненужного и мало нужного.

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

3. Не забывайте об админке после запуска. Внутренний редактор требует постоянного развития  —  если не будет развиваться админка, вы будете тормозить развитие редакции. Редакция же  —  основная ценность любого издания.

4. Делайте только то, что действительно нужно. Лучше сделать пять необходимых функций, чем потратить массу времени на инновационное, но неочевидное решение, которым потом никто не будет пользоваться.

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

Вот она.

24 часа, главный экран Монитора

Это главный экран Монитора: как следует из названия, на нем видны все материалы, которые проходили через Монитор за последние 24 часа. Материалы делятся на опубликованные и те, которые находятся в работе. Верхняя желтая плашка называется «Заветы» и используется для важных объявлений.

Экран «24 часа» скоро ждут серьезные изменения. Про это будет отдельный пост.

Календарь

Календарь, самый неиспользуемый экран монитора

Наглядный пример того, что при разработке админки стоит сосредоточиться на обязательном. Календарь создавался для планирования: редактор создает материал на через неделю и помнит, что дедлайн грядет  —  в первой версии Монитора виджет календаря выводился также на экран «24 часа». В действительности оказалось, что подавляющее большинство членов редакции занимается новостями, где планирование по определению отсутствует. Той же малой части редакции, которая занимается долгими историями, проще пользоваться бумажными стикерами, приклееными к стеклянной стене. Календарь стоит пустым напоминанием о зря потраченном времени и деньгах.

Учитесь на наших ошибках.

Выпуск

Выпуск, самый сложный экран Монитора

Опубликованный материал не увидят пользователи сайта и он не попадет в RSS, если выпускающий редактор не поставит его в Выпуск. Процесс выпуска материала выглядит так:

Как только редактор начинает совершать активные действия в выпуске, для всех остальных экран блокируется:

Все разделы «Медузы» собираются вручную, никакой автоматики.

Все материалы

Все материалы, для сохранности

Ну, тут все просто: это архив. С поиском по типу материала, дате, редактору и названию. Не будем на этом долго задерживаться.

Наружка

Наружка, статистика для всей редакции

Вся редакция имеет доступ к внутренней статистике: сколько кликов собирают материалы, которые сейчас стоят на экранах. Статистика дается за полчаса и за все время.

Статистика

Это внутренняя статистика по редакторам и типам материалов  —  тоже открыта всем (вообще, в Мониторе нет ролей пользователей, все перед Монитором равны).
Среднее время, потраченное на материал  —  цифра лукавая и не всегда показательная.

Источники

Сложнейший экран, давшийся нам немалой кровью. Как вы знаете, «Медуза»  —  агрегатор, то есть в основе издания  —  материал со ссылкой на какой-нибудь источник. Казалось бы, все просто. Все просто, да не совсем. Источники бывают разные. Бывает, что один сайт  —  это несколько источников («ВКонтакте», «Фейсбук», ЖЖ и т.д.). Бывает, что один источник  —  это несколько сайтов (Алексей Навальный). Поэтому у источников бывают субисточники и синонимы. Вот так, например, выглядит страница источника под названием «ВКонтакте»:

Про экраны всё (оставшиеся экраны совершенно технические и ничего интересного о них сказать мы не можем). Переходим к процессу создания материала  —  то есть нажимаем на зеленый квадратик в левом верхнем углу.

Создание материала

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

Приятные мелочи:

1. Правая и левая колонки независимы.

2. К любому источнику автоматически добавляется скриншот (его делает робот, редактор к этому отношения не имеет). Делается это на случай, если нас обвинят в неверном цитировании: у нас всегда хранится оригинал.

3. Источник (если он есть в Мониторе) определяется автоматически. То есть в случае, когда редактор копирует в поле источника ссылку vedomosti.ru/чтототам, то Монитор сразу же поймет, что это газета «Ведомости» и привяжет материал к источнику.

4. В материале могут одновременно работать несколько человек  —  мы блокируем материал по полям. Более того: один редактор видит, что делает другой:

5. У полей бывают ограничения по знакам  —  работает как в Twitter.

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

7. С недавних пор работает постоянное автосохранение  —  то есть не надо все время жать на кнопку «Сохранить» и терять половину материала по любому поводу.

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

Фоторедактор

Фоторедактор  —  это альтернативный вид материала, доступен по ссылке из каждого материала. Выглядит вот так:

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

Фотографии можно вставлять только между абзацами. Чтобы вставить фото, нужно перетянуть его из левой области в правую в специально предназначенное для этого поле:

Монитор сообщает, какого размера фотография загружена, предлагает ее поменять прямо в тексте без удаления, посмотреть в полном размере, а также двигать по тексту вверх и вниз.

Создание материала

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

Мы пока тестируем эту функцию, поэтому такие картинки не уходят наружу. Запустится вот-вот.

А также

Несколько дней назад мы запустили быстрый способ создания и редактирования статей. Находится он не в Мониторе. Это расширение для Chrome.

Если установить расширение и нажать на него, когда вы читаете материал на «Медузе», то вы сразу немедленно попадете в Монитор. Вот так:

Или вы нашли интересный текст, скажем, в издании «Афиша-Город»:

Монитор создал материал  —  вместе с привязанным источником, заголовком и даже текстом (который мы, разумеется, перепишем, но это упрощает и ускоряет работу редактора).

Это всё?

Для начала да. Подпишитесь на наш Medium, мы будем рассказывать тут обо всем, что придумываем. Со своей стороны, будем рады любым идеям.

0
51 комментарий
Написать комментарий...
Аккаунт удален

Комментарий недоступен

Ответить
Развернуть ветку
Mikhail Gruznov

Распишите кухню Комитета. Интересно же.

Ответить
Развернуть ветку
Макс Павлюкевич

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

Ответить
Развернуть ветку
Maxim Syabro

Спасибо, очень интересно.
Идея с блокированием поля — шикарная.

Ответить
Развернуть ветку
Пейджи Ларр

Жалко что мало проектов которые вот так рассказывают о себе изнутри.

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Николай Григорьев

Единственное, что меня в сайте медузы смущает, так это то, что статьи открываются как-бы в новом фрейме поверх основной страницы. Вот это вообще непонятно зачем сделано, зато загрузку это существенно тормозит, особенно, когда с телефона сидишь.

Ответить
Развернуть ветку
Dmitrii Gotye

Нужно больше статей про админки изданий.

Ответить
Развернуть ветку
Denis Beskov
Ответить
Развернуть ветку
Sasha Korablyov

Глянул на админку Битрикса, прослезнулся как плачут мусульмане, слушая жизнеописание пророков

Ответить
Развернуть ветку
Ilya Guschin

Вы еще DLE не видели )

Ответить
Развернуть ветку
Nikolay Kachev

Статья хорошая но вот саму Медузу кроме редакторов кто-то читает?

Ответить
Развернуть ветку
Антон Корочинский

Я не поленился и пошел посомтреть, сколько расшариваний у медузы обычного материала, и их оказалось не мало, во всяком случае гораздо больше сотни. Я хотел бо этом написать. Потом я подумал, что можно пошутить, что судя по этой логике я один из сотни, что значит - один из немногих, и это явно должно мне льстить. Но продумав все возможные ответы на мои комментарии, если бы они были в таком же стиле, как и комментарий, на который я отвечаю, я решил ничего не писать. Руки в отчаянии и бессилии упали на клавиатуру и получилось: "Идите на хуй. Читают"

Ответить
Развернуть ветку
3 комментария
Григорий Голованов

Медузу не читаю, но учитывая пользу статьи минусанул тот бред, под которым нажал "ответить". Народа в стране много, у всех своя информационная игла.

И да, не читали бы - незачем и не на что было бы все это делать, ваш КО.

Ответить
Развернуть ветку
Антон Калашников

Вообщем, не знаю что вы читаете, но ваш сарказм смотрится просто смешно. Медуза, одно из лучших изданий, дизайн сайта и подача информации на высоте.

Ответить
Развернуть ветку
Andrey Uglev

читает та же аудитория что и слушает Латинину и Альбац на Эхе Москвы - человек 100 непримиримых борцов.

Ответить
Развернуть ветку
2 комментария
Nikolay Kachev

Воу воу медуза палехче! %)

Ответить
Развернуть ветку
1 комментарий
Павел

Там в скриншотах самое интересное в цифах количества просмотров новостей. То есть да, читают, но не особо много

Ответить
Развернуть ветку
Николай Лукин

В "Шапито" у них неплохие подборки

Ответить
Развернуть ветку
Eugene Koban

Между тем, пока тут спорят об их аудитории, в 'Top Stories on Medium' их пост на первом месте

Ответить
Развернуть ветку
Anton Sotniychuk

Некоторые вещи вызывают вопросы - почему нет прямого кросспостинга в соцсети и твиттер (и соотв. пометок в админке чтобы не пускать туда совсем уж проходное). Для тех кому именно так удобнее читать сухие новости и не нужен формат "лентача" с прибаутками.

Нет ни категоризации, ни новостей по теме. После рациональной Ленты читать неструктурированный поток сознания тяжело.

Из непоказанного в админках редакций обычно есть еще настройки продвижения новости и статистика по уникальности (разрабатывалась ли с нуля, шла по хлебным крошкам, рерайтилась или т.д.). Но для агрегатора всё это действительно ненужно.

Сильно спорный момент с созданием собственного календаря вместо Google Calendar и проч. Если только он не синхронизируется с календарями на телефонах сотрудников - иначе точно бесполезная вещь.

В остальном админка достаточно приятная и видно что пока еще сохранена простота интерфейса. Главное чтобы со временем ее не разнесло и через пару лет она выглядела бы также лаконично. :)

Ответить
Развернуть ветку
Илья Мишин

изобрели велосипед с квадратными колесами.

Ответить
Развернуть ветку
Владислав Козуля

Как человек, который регулярно пишет амдинки для разных околомедийных проектов, спешу вас расстроить – велосипеды везде.

Ответить
Развернуть ветку
Павел

Три вещи которые меня раздражают в сайте медузы

1) очень мало новостей вмещается в экран — http://gyazo.com/bb7b76e90ec1ea4d7aae3d87311b6048
(в желтой ленте было идеально, когда все заголовки помещались на один экран, взглянул и пооткрывал нужные новости, а не сидишь эксплоришь)
2) траурные картинки на которых ничего не разглядеть (когда белым текстом по темной-темной фотке). сразу настрой, что там какая-то чернуха
3) уже писали выше, как открывается новость на телефоне

Ответить
Развернуть ветку
Олег Балакин

По статистике: https://www.facebook.com/photo.php?fbid=10153495056473327&set=a.84270683326.104731.711408326&type=1.
2 миллиона за декабрь.

Ответить
Развернуть ветку
Ольга Белая

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

Ответить
Развернуть ветку
Злой Одуванчик
нужно сейчас админка проектировать.

Один админка, два экран — я хозяин всяких стран!

Ответить
Развернуть ветку
Пейджи Ларр

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

Ответить
Развернуть ветку
Sergey Shvets

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

Ответить
Развернуть ветку
Кирилл Титов

Ctrl+F “node.js” Ctrl+F “mongodb” ничего :(
ПЛОХО РАБОТАЕТЕ

Ответить
Развернуть ветку
Denis Grammakov

Неплохо для ресурса публикующего 2 новости в день. Overkill.

Ответить
Развернуть ветку
wuh-wuh

2? это такой irony сейчас был?

Ответить
Развернуть ветку
Maxim Nawak

Полезно. ЦП спасибо за наводку!

Ответить
Развернуть ветку
Ярослав Степанюк

Meduza + Kz = Все очень плохо :(

Ответить
Развернуть ветку
Андрей Носов

Круто!

Ответить
Развернуть ветку

Комментарий удален модератором

Развернуть ветку
Олег Балакин

Точку нужно убрать в конце ссылки.

Ответить
Развернуть ветку
Damir Muratov

Спасибо за статью, очень познавательно. Сейчас сам делаю что то подобное, увидел много интересных идей.

Ответить
Развернуть ветку
Praetorian

Только я увидел в статье идею для стартапа? )))

Ответить
Развернуть ветку
Sergey Sergeychik

Про идею для стартапа:
собсна все существующие сми уже сидят на своих велосипедах (или не-велосипедах), поэтому прийти с новым, пускай и хорошим, и предложить им изменение внутренних процессов, которые у них уже 'оптимизированы и обкатаны' - непростое дело.

Ответить
Развернуть ветку
1 комментарий
Sergey Sergeychik

Интересно бы послушать людей, которые в теме индустрии

Ответить
Развернуть ветку
Станислав Габрусевич

Насчёт скроллинга дельный вопрос. Как добраться до старых материалов (речь как о новостных материалах, так и статьях). "Поиск" или "Архив" абсолютно не помешали бы.

Ответить
Развернуть ветку
Sergey Sergeychik

Про идею для стартапа:
собсна все существующие сми уже сидят на своих велосипедах (или не-велосипедах), поэтому прийти с новым, пускай и хорошим, и предложить им изменение внутренних процессов, которые у них уже 'оптимизированы и обкатаны' - непростое дело.

Ответить
Развернуть ветку
Tanya Moseeva

"работает ЗАПЯТАЯ как в Twitter"

Админка шикарная, не хватает корректора, может?

Ответить
Развернуть ветку
Sergey Kushniruk

«Субисточник», «суб источник», «суб-источник».

Ответить
Развернуть ветку
Николай Иванов

Вопрос по теме. Что за расширение Chrome используется в последней части обзора (где контент чужого сайта перекидывается в админку)?

Ответить
Развернуть ветку
Читать все 51 комментарий
null