Заметка Как я делаю новый дизайн форума

[Сергей Попов]

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

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

Как сейчас​

Четыре вещи в текущем форуме, которые меня бесят.

Мобайл. Больше половины из нас сидит с телефона, а первый экран там шапка, переключатели и баннеры. Содержимое начинается сильно ниже первого экрана, и до первого треда надо доскроллить.

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

Знания раздроблены на три несвязанные таксономии: статьи, разделы, префиксы. Хочешь собрать всё про AD-пентест - лазишь по всем трём и всё равно через поиск гуглишь то, что не нашёл.

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

Каждое решаемо по отдельности, но вместе они держат форум в прошлом веке.

Как все примерно будет​

Рабочее место исследователя вместо доски. Лентой управляешь ты, а не алгоритм. Слева конструктор: темы (Pentest, AppSec, DFIR, Reverse, OSINT, Cloud, SOC), формат (разбор, инструмент, гайд, новость про CVE, вопрос), уровень, свежесть. У любой карточки можно спросить «почему она здесь» и скрыть из ленты то что не релевантно. Карточки типизированы: разбор; свежая критическая CVE со статусом «эксплуатируется в дикой природе». Релиз инструмента с версией - сразу видно, что это и в каком оно состоянии.

Лента не одна. Переключатель режимов и всё по делу: «Новое» (по времени), «Тренды» (что разгоняют прямо сейчас), «Подписки», плюс срезы для копания - «Research», «Deep Read», «Signal». Режим запоминается между заходами: поставил «Deep Read» по реверсу - заходишь и сразу видишь длинные разборы по теме, а не ленту обо всём подряд.

Мобайл - равноправный экран, а не урезанная «версия для телефона». Те же панели на той же разметке сворачиваются в шторки и аккордеоны. Справа «продолжить чтение» с процентом прогресса, который доезжает с другого устройства, и «что в тренде» по реальному обсуждению, а не по лайкам.

Под это четыре экрана.

Лента знаний - то, что видишь первым. Вместо случайной выдачи поток по твоим темам и форматам, и у каждого материала видно, почему он тут. Нужны только свежие CVE по AppSec уровня «про» - получаешь только их, без шума из соседних разделов.

Ридер для лонгридов - разбор читается как статья: слева оглавление с прогрессом, режимы плотности, нормальный код с подсветкой, кнопкой copy и сохранёнными отступами. Длинный разбор перестаёт быть простынёй: видно, где ты в тексте и сколько осталось, а код забираешь одним кликом, не выковыривая из абзаца.

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

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

Язык дизайна спокойный. Не соцсеть с коинами и дёрганьем. Тёмная тема по умолчанию, нормальная светлая рядом. Код, логи, конфиги - полноценные элементы интерфейса, а не сноска мелким шрифтом. Минимум визуального мусора: инструмент не должен мешать думать. Видимый слоган - «Your InfoSec Upgrade».

Из чего делаю​

Форум не сносится под ноль. Под новым интерфейсом всё тот же XenForo. Это сознательный выбор: за плечами огромный архив тредов, который годами приводит людей из поисковиков, работающие логины и единый вход, живые ссылки, карты сайта, разметка. Снести ядро и переписать на модный фронтенд - убить поисковый трафик и разлогинить пол-форума за одну ночь. Не вариант.

Поэтому гибрид. Ядро рендерит страницы, держит авторизацию, отвечает за поиск и индексацию. Сверху новый слой: вид, навигация, лента, ридер, помощники. Слой берёт у ядра данные, а не подменяет его. Выключи слой - страница откроется в привычном виде, содержимое на месте, старые ссылки и поиск живут: ни один тред не теряет адрес, ни одна закладка не ломается. Новое - надстройка, которую включают и откатывают частями. Данные и разделы те же, что сейчас, просто в новой оболочке.

На каком этапе​

Пока это концепт и кликабельные прототипы. Прод не тронут - макет, по которому можно кликать. Слева уже новая навигация: переключатель «Лента / Форум», разделы, экосистема HackerLab / форум / Academy, тумблер темы. В центре всё ещё классический список разделов, часть пунктов помечена «СКОРО». Оболочка надета на старое содержимое, шов между ними виден - на этой стадии так и должно быть.

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

Про ИИ без иллюзий​

ИИ тут два помощника, оба про навигацию, не про подмену людей.

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

Разбор кода по кнопке: жмёшь на непонятный кусок - помощник объясняет именно его. Не переписывает, не дорисовывает флаги, которых нет.

Зачем создал этот тред​

В чём я не уверен. Лента против привычных разделов: поток вместо структуры заходит не всем, и спорить есть о чём. Поиск внутри длинного треда отдельная инженерная задача, не «прикрутить за вечер», я в это уже упирался. Дозировка ИИ где «ровно сколько надо», а где уже «слишком». По этим пунктам мне нужна помощь:

1. Что в текущем форуме бесит сильнее всего - одна вещь, которую выпилили бы не задумываясь.
2. Лента вместо разделов - за или против, и почему.
3. ИИ-помощники - польза или мусор, и где для вас грань.
4. Тёмная или светлая тема- чем пользуетесь и чего не хватает.
5. Три фичи, ради которых заходили бы каждый день - не «было бы неплохо», а то, чего реально не хватает в работе.

Аргумент полезнее оценки: «тут плохо, потому что я теряю вот это» работает, «нравится / не нравится» нет. И отдельно: в правильном ли направлении двигаюсь?