BuCodex · дизайн-разбор, версия 2

Сигналы возвращаются, шум — нет

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

Правило, по которому это держится

Цвет — только на площади до 10pxТочка состояния, чип, рельса. Как только цвет заливает рамку карточки или свечение, он перестаёт быть сигналом и становится украшением.

Одна точка входа взглядаСлева фиксированная колонка 28px: иконка провайдера, а на её углу — точка состояния. Глаз сканирует один вертикальный ряд и сразу видит, где что горит.

Идентичность и состояние разделеныПровайдер (Claude / GPT) — постоянный оттенок, он не меняется. Состояние — отдельный цвет, он меняется. Их нельзя смешивать в одном пятне.

Источник — нейтральныйGitHub и локальный путь это категория, а не тревога. Иконки серые, 11px, в мета-строке. Никакого наезжающего капслока поверх названия.

Движется только то, что действительно идётДыхание 2.4s — у работающего треда. Ждущий ответа моргает раз в 3.2s. Всё остальное статично.

Живой список

Три способа показать состояние. Кликай строки, переключай варианты — и проверь, за сколько находишь «Нужен ответ» в списке из 12 тредов.

Чем отличаются варианты

Точка на иконкеКак индикатор присутствия в мессенджере. Самая плотная подача: ни одного лишнего элемента в строке, а состояние видно в той же точке, где и провайдер. Лучшее для длинных списков.

Статус-чипСостояние подписано словом на цветной подложке 10% — читается даже боковым зрением и не требует знания цветового кода. Съедает ширину, зато самый однозначный.

Цветная рельсаСлева вертикальная полоска цвета состояния. Список выглядит строже всего, «горящие» треды собираются в заметный вертикальный паттерн на краю.

Палитра состояний

Работает

#5fb3ad — единственный статус с анимацией: дыхание точки 2.4s.

Нужен ответ

#d3a45f — самый «липкий» для глаза. Редкое моргание раз в 3.2s.

Ошибка

#c87f82 — статично. Красный не должен мигать, иначе это паника.

Готово

#7f9c85 только в точке; текст статуса при этом нейтрально-серый.

Простаивает

#656a70 — фон списка, ничего не требует.

Иконки

Все на сетке 16px, одинаковая оптическая плотность. Провайдер — с оттенком, источник — серый.

Иконка	Где	Цвет	Смысл
Claude	левая колонка, 15px	`#cf8a63`	Идентичность провайдера. Постоянна, не зависит от состояния.
GPT / Codex	левая колонка, 15px	`#8fb7a6`	То же для второго провайдера. Два оттенка различимы и в ч/б по форме.
GitHub	мета-строка, 11px	`--ink-4`	Тред привязан к репозиторию. Рядом — owner/repo.
Папка	мета-строка, 11px	`--ink-4`	Локальный путь вместо репозитория.
Точка состояния	угол иконки провайдера, 9px	по статусу	Единственный цветной триггер в варианте А.

Что берём из текущей версии, а что нет

Элемент	Решение	Почему
Цветные статусы	оставляем	Это рабочий триггер. Меняем только площадь: точка/чип вместо жирного цветного текста.
Иконки провайдера	оставляем	Отличать Claude от Codex нужно мгновенно; выносим в фиксированную колонку слева.
GitHub / путь	оставляем	Но в мета-строке и серым: это категория, а не состояние.
Пульсация рамки `workspaceOpenInvite`	убираем	Бесконечный цикл на большой площади. Заменяется дыханием точки 9px.
Свип по тексту `threadThinkingSweep`	убираем	Движущийся текст мешает читать именно то, что пытается привлечь внимание.
Призрачный капслок поверх названия	убираем	Наезд на текст читается как баг. Источник уходит в мета-строку с ellipsis.
Цветная рамка активного треда	убираем	Активность показывает фон 5.5% и рельса, чтобы не спорить со статусом за внимание.
`translateY(-1px)` на hover	убираем	Список перестаёт подпрыгивать под курсором.

Собрано по скриншоту от 15 сентября 2026 и стилям front/src/ai/chat/AiSidebarStyles.module.scss. Иконки — упрощённые геометрические знаки для макета, не официальные логотипы. Данные вымышленные.