06 · Anti-patterns · правила против тупизны¶

Зачем этот файл¶

Каждое правило здесь = провал в production который CEO ловил визуально. Каждый раз когда правило игнорировалось — было разочарование, переделка, потеря времени.

Запоминание этих правил = 50% качества Senior UX 18+. Знать конкретику принципов важнее чем знать абстракции.

Этот файл — расширенная версия feedback_design_lessons_learned.md + feedback_dont_change_approved_components.md + извлечённые уроки из 26 версий v4.4.0 → v4.5.0.

См. также 11-failure-modes.md — этот файл содержит правила в формате ❌/✅ (что не делать). Файл 11 содержит case studies с датой / реакцией CEO / root cause analysis (откуда правила взялись). Истории учат глубже чем правила — для cold-start обучения 11 обязателен.

Группа A · 11 правил v4.2.8 (фундамент)¶

После провала v4.2.6 (модалы) CEO сформулировал 11 правил «против тупизны». Это базовый contract.

1 · First read эталоны как ФАЙЛЫ¶

❌ Делать «по памяти» / «как помню»
✅ Открыть эталон файл + memory + ui-kit-v4.2.md ПЕРЕД правкой

Пример провала v4.2.6: правка модалов без чтения feedback_modal_f_canonical.md → border-radius сломал canonical, padding изменён без причины. CEO «провал».

Правильный workflow: 1. Открыть feedback_modal_f_canonical.md 2. Открыть актуальный модал-эталон (например academy/billing modal) 3. Сравнить proposed change с canonical 4. Если расхождение — обосновать в commit

2 · НЕ Linear / Stripe (не копировать чужой UX напрямую)¶

❌ «Сделай как у Linear» / «как у Stripe»
✅ GOLDJAXE имеет свою брутальную айдентику (square brackets, gold accents, JBM/Space Mono mix). Inspired by — да, copy-paste — нет.

Пример: запрос «сделай sidebar как у Linear» → CEO «нет, у нас свой стиль · square brackets, не chevrons». Sidebar Б финальный — был адаптирован, не скопирован.

3 · Headline center, body left¶

❌ В модалах body text center-align (плохая читаемость для длинного текста)
✅ Headline center, body left, form fields left + override text-align: left для form rows

4 · Кнопки min-width¶

❌ Buttons разной ширины из-за разной длины текста
✅ flex: 1 в .btn-group ИЛИ min-width: 220px фикс

5 · Цены strong амбер¶

❌ Цены plain text neutral color
✅ На любых tier-pricing экранах — <strong class="price">$149</strong> с amber color

6 · Canonical extends¶

❌ Page-isolated класс с нуля для повторяющегося element
✅ Сначала grep master CSS на existing class. Если есть — использовать или extend.

Пример: - Нужна tier badge - Сначала grep .tier-pill → нашёл .tier-pill-l1 в master - Не создавать .my-tier-l1 page-isolated

7 · Body min 14px¶

❌ Font-size < 14px в body text
✅ Никогда меньше 14px (нечитаемо, особенно на high-DPI)

8 · Async closing¶

❌ Висячие promises без .catch() или try/catch
✅ Все async операции должны обрабатывать errors gracefully

9 · Апрув CEO до push¶

❌ Commit + push без явного апрува CEO
✅ ВСЕГДА wait CEO trigger («апрув» / «фиксируем» / «commit X») в чате

См. 07-workflow.md § CEO approval gate.

10 · CSS многострочный комментарий закрывать `*/` ОДИН раз¶

❌ Несколько */ внутри multi-line CSS comment (комментарий закрывается раньше)
✅ Закрывать */ ОДИН раз в самом конце

Пример провала v4.2.7:

/* Multi-line comment
 * with link http://example.com/*/
 * still in comment */
.my-rule { /* эта rule НЕ применяется — комментарий закрылся на /* */ */}

11 · Visual screenshot before showing CEO¶

❌ Доверять computed-style MCP / памяти / интуиции
✅ Делать screenshot через Chrome MCP + computed values + ТОЛЬКО ПОТОМ показывать

Пример провала v4.4.17 phase 1: заявил «footer dark работает» на основе computed = rgb(14,13,11) без screenshot. На самом деле footer выглядел cream на screenshot — я неверно прочитал dark warm #0E0D0B как cream. CEO ругался «5 раз тебе писал».

Triada visual proof (новое v4.5.0): 1. Screenshot full page или область 2. Zoom (если нужна детализация конкретного элемента) 3. Computed style для критических свойств (color / bg / hover state)

См. 07-workflow.md § Visual proof протокол.

Группа B · 10 anti-patterns light theme¶

Полный список в 03-light-theme.md § Anti-patterns light theme. Здесь — резюме с критичностью.

#	Правило	Severity	Reference
1	`color: rgba(255,255,255,X)` в class definitions	🔴 HIGH (invisible)	03 § anti 1
2	`background: var(--bg-secondary)` без проверки	🟡 MED (cream-on-cream)	03 § anti 2
3	Inline `<style>` `[data-theme="light"]` без проверки master	🟡 MED (duplication)	03 § anti 3
4	`#EBC554` яркое gold для CTAs в light	🟡 MED (low contrast)	03 § anti 4
5	Pure white `#FFFFFF` body bg	🟢 LOW (visual fatigue)	03 § anti 5
6	Stripe-pattern dark footer на academy UI-app	🔴 HIGH (context broken)	03 § anti 6
7	Hover `color: var(--bg-secondary)` (cream-on-color)	🟡 MED (sliyaetsya)	03 § anti 7
8	`*/` посреди multi-line CSS comment	🔴 HIGH (rules не работают)	03 § anti 8
9	Premium PDF artifact «immutable dark» в light	🔴 HIGH (CEO 5x жаловался)	03 § anti 9
10	White-on-white в hover state на chip/badge	🔴 HIGH (text invisible)	03 § anti 10

Группа C · Workflow anti-patterns¶

1 · Commit без явного апрува CEO¶

❌ Push на master до visual ревью CEO
✅ Накапливать в working tree, ждать «апрув / фиксируем / commit X»

См. feedback_audit_fix_workflow.md.

2 · Bulk fixes без предварительного показа¶

❌ 13 экранов в одном commit без CEO ревью
✅ Разбивать по призмам, каждая призма = отдельный цикл

3 · Fix + audit в одной сессии без явного перехода¶

❌ «Я тут одновременно audit и fix»
✅ Чёткие границы фаз: audit → отчёт → CEO ОК на план → fix → CEO ОК на результат → commit

4 · Self-approve¶

❌ «Это же очевидно правильно, push»
✅ ВСЕГДА жди явный CEO trigger

5 · Push без CSS bumping¶

❌ Edit master CSS без bump query ?v=X.Y.Z в HTML links
✅ После CSS edits — bump query на ВСЕХ HTML которые consumes этот CSS, иначе CEO browser cache держит старую версию

Пример провала Phase 1 v4.4.17: добавил [data-theme="light"] .cert-paper { background: white } в master, но ?v=4.4.17.3 остался — browser кэш отдавал старый CSS. Потерял 5 минут диагностики «почему не применилось».

6 · Memory обновление пропущено после canonical change¶

❌ Изменил canonical pattern, не обновил memory
✅ Каждый новый canonical → создать/обновить feedback_X_canonical.md

7 · ROOT_LOG entry пропущен¶

❌ Push в design.goldjaxe.ai без entry в /claude/ROOT_LOG.md
✅ После каждого push — entry с типом операции / commit hash / что закрыто

Группа D · CEO-специфичные правила¶

Англицизмы запрет¶

CEO 2026-05-04: «80% не понимаю».

❌ sprint / scope / refactor / boilerplate / MVP / hero / viewport / anti-pattern / LTV / tier
✅ Русские замены: - sprint → этап / спринт работы - scope → объём / задачи / границы - refactor → переработка / переделка - boilerplate → шаблон / заготовка - MVP → минимальная рабочая версия - hero → главный экран / hero-блок (если допустимо) - viewport → область просмотра / экран - anti-pattern → плохая практика / запрет - LTV → пожизненная ценность клиента - tier — оставить (это canonical brand term, в коде остаётся)

См. feedback_no_anglicisms.md + feedback_anglicisms_audit_prompt.md.

Применение: перед каждой отправкой ответа CEO — прочитать на жаргон. Если есть — заменить.

Vegasoft team isolation¶

❌ Привлекать Кирилла / Алексея / Валентина / Серафиму / Мехри / других Vegasoft людей к разработке/контенту/маркетингу GOLDJAXE
✅ Core team только: CEO, Артём, Виктория, Свят (но Свят НЕ admin GitLab)

Why: юридическая аффилиация запрещена.

См. feedback_no_vegasoft_for_goldjaxe.md.

Q-Check juridical isolation¶

❌ Упоминать Q-Check cap table / nominee structure в открытых каналах / TEAM-вики
✅ Только в private wiki, без деталей в team-репо

См. project_q_check_cap_table.md.

Артём как фронт-исполнитель¶

❌ Делегировать дизайн напрямую Артёму
✅ Workflow: Claude+CEO → Артём → Виктория. Artyom раскатывает уже утверждённое CEO дизайн.

См. feedback_design_workflow.md.

NDA-then-access¶

❌ Дать доступ новому сотруднику до подписания NDA
✅ Сначала NDA, потом доступы. CEO 2026-05-04: «не путать вышел на работу с получил доступ».

См. feedback_nda_then_access.md.

Конкурентная разведка — оборонительная¶

❌ Использовать данные конкурентов для атаки / донос в надзорные органы
✅ Изучать чтобы стать сильнее, фиксировать как «не повторять» + защита

См. feedback_competitor_analysis_defensive.md.

Холдинг ≠ инфобиз¶

❌ Позиционировать GOLDJAXE как школу/курс/новую профессию
✅ Холдинг + экосистема + своя платформа. Контр-нарратив против Бурмистрова и подобных.

См. feedback_holding_positioning_vs_infobiz.md.

Группа E · Тематические anti-patterns по теме¶

Cards¶

Создавать .my-special-card без проверки existing семейств
Менять padding canonical 24px без обоснования
Locked state через opacity: 0.55 (использовать chip + gradient overlay)
Heavy white bg + heavy border внутри .profile-acc (создаёт «решётку»)

Buttons¶

Hover только color без bg (race condition с idle !important)
Разная ширина в группе (нарушение симметрии v4.4.12)
Custom button class вместо canonical .btn-ai-*

Менять height / cube / typography без re-апрува CEO
Адаптировать на light theme (всегда dark immutable)
Заменять Space Mono в wordmark

Stripe-dark на academy UI-app context
Cream footer на marketing landing (нарушает grounding)
Прятать триаду на `<5xl viewport (она важна для cross-product awareness)

Modals¶

Менять Modal F canonical без re-апрува
Body text center на длинных формах (header center / body left rule)
Buttons разной ширины

Forms¶

.eco-theme-pill в header (это для settings, не header)
.eco-theme-btn в settings (это для header)
Дублировать .eco-switch как .switch page-isolated

Status¶

Дублировать .tier-pill-l1 как .tier-l1
Inverse semantic colors (red = success, green = error)
Использовать gold для status (gold = brand action only)

Timeline¶

.eco-timeline-row с heavy white-bg в profile-acc (решётка)
Misaligned text-x vs meta-x (нарушение симметрии уровень 4)

i18n¶

Hardcoded text без data-i18n атрибута
Native EN перевод machine translation качества
Date format inconsistent (RU 06 МАЯ 2026 / EN May 6, 2026 mixed)

Versioning¶

Patch bump для нового компонента (нужен minor)
Minor bump для breaking rename (нужен major)
Skip CHANGELOG entry

Группа F · Выученные уроки sessions май 2026¶

v4.4.17 уроки¶

Computed style != visual proof — getComputedStyle может returning correct value, но visual broken (case: footer rgb(14,13,11) computed, но screenshot выглядел cream — я неверно прочитал warm dark)
Browser cache aggressive — без ?v=X query browser держит старый CSS days. Bump на каждом master change
/tmp/goldjaxe-mirror устаревает — раньше использовали как mirror copy. CEO смотрел на это, я на актуальный working tree. Confusion. Решение: один preview server указывающий на actual repo
Hover requires bg + color оба — race condition между idle !important и hover only color
Premium artifact ≠ immutable dark — CEO 5x жаловался про сертификат. Light theme = light surface + gold preserved
Two-fase commit-on-failure — если phase1 fix не сработал, не делать «второй fix поверх» вслепую — заглянуть на корень (cascade issue, browser cache, etc.)

v4.4.14 уроки (AI-Diagnostic)¶

Generic onboarding конвертирует хуже personalized — AI-Diagnostic 90 sec vs welcome+pricing
Aspirational ladder важнее immediate value — Step 3 cross-product visualization работает emotionally

v4.4.12 уроки (symmetry)¶

4 уровня симметрии — не «nice to have», а baseline — без них экран выглядит «почти как», но не «как»
Audit-промпт перед CEO ревью обязателен — иначе CEO ловит то что Claude мог поймать сам

v4.4.2 уроки (Certificate golden standard)¶

A4 landscape ratio — гарантирует print compatibility (даже если user не печатает сейчас, может потом)
Vertical rhythm 679/651/767 — calculus для compact-fold всё ещё применим к premium artifacts

Уроки L3-аудита и пересборки academy (diagnostic / dashboard / pricing / courses / partnership). Прецеденты verified числами на dev.

❌ Мерить фолд только на чистых 1440×900. Хром браузера (меню+табы+адресная строка) съедает ~100-115px — реальный фолд ноутбука CEO ≈ 790-810. ✅ Контрольный замер на 1440×800: низ смыслового ядра ≤790. Канон 900 остаётся целевым вьюпортом, 800 — контрольной точкой реальности.
❌ main { min-h-screen } + футер ПОСЛЕ него — каждая короткая страница скроллится ровно на высоту футера (класс бага «+67px везде», вскрыт аудитом 10.06 на всех коротких экранах academy). ✅ Sticky-footer канон: обёртка flex min-h-screen flex-col вокруг main+footer, main = flex-1; страничные min-height: 100vh / calc(100vh − header) убрать → страница ровно в окно, скролл 0.
❌ justify-content: center на родителе короткой сцены — при переполнении (мобайл, клавиатура) верх контента срезается за край без доступа скроллом. ✅ margin-block: auto (my-auto) на контент-блоке — центр в свободной высоте, при переполнении margin схлопывается, верх доступен.
❌ Линию CTA-кнопок в гриде равновысоких карточек ломает переменная подпись ПОД кнопкой (1 строка vs 2). ✅ min-height зоны подписи = высота самой высокой → кнопки всех карточек на одной линии (pricing 10.06: разброс 914→1px).
❌ Несимметричные низы колонок двухколоночного экрана (правая болтается ниже/выше левой). ✅ Грид items-stretch + колонка flex flex-col + растяжимая панель flex-1 + фиксированное число элементов ленты → низы на одной линии на любом вьюпорте (dashboard 10.06: Δ57→0).
❌ Поиск и фильтры над списком из 3-4 элементов — шум, съедающий фолд. ✅ Пороги появления: поиск от 7 элементов, фильтры от 5 (защита на рост каталога, рубка чиста сегодня).
❌ Геометрия-аудит без канон-классификации. «Фолд/мобайл чисты» ≠ «экран канон»: под чистыми числами может жить легаси-дизайн (Apple-слой, скругления, чужая типографика). ✅ Перед любым «посмотри» — классификация canonical/legacy КАЖДОГО экрана глазами + полный ls ОБОИХ эталон-слоёв (ecosystem-prototype/** И canonical/landings/**) — эталоны settings/profile/billing существовали, пока боевой лепился «из головы» (CEO 10.06: «ты смотрел вообще в брендоси все экраны?!»).
❌ НЕ-flex обёртка-layout группы между layout-main и страницей (min-h-screen без flex у группового клиент-layout) — убивает flex-1/my-auto всех страниц группы и возвращает класс «+67px». ✅ При «my-auto не центрирует» — искать обёртку группы ((group)/x/layout.tsx, *LayoutClient); канон: flex flex-1 flex-col на div и main обёртки (прецедент DashboardLayoutClient 10.06: один фикс вылечил 6 страниц кабинета).
❌ Бланкет-правило card > *:not(.watermark) { position: relative } молча перебивает position: absolute у лент/бейджей карточки — лента встаёт в поток и рвёт симметрию рядов (флагман L2 +52px). ✅ Исключать absolute-элементы из позиционных правил: :not(.lad-flagship); после любого бланкет-селектора на детей — проверять absolute-элементы карточки.
❌ Доводить шкалу до floor (caps 12 / body 14) на новых экранах. ✅ Канон comfortable эталона .ai: caps 13 · body 15 · поля ввода 16 · нав/футер 13; floor 12 — только аварийный минимум, не рабочая шкала (волна 10.06: подъём 14 canonical-CSS, minFont=13 на всех 20 экранах, фолды целы).

Памятка-якоря (по темам)¶

Тема	Anti-pattern reference	Memory
Header	Менять canonical v3.2 без re-апрува	`feedback_header_canonical_v3.md`
Footer	Stripe-dark на UI-app академии	`feedback_light_theme_v2.md` (v4.5.0 update)
Auth	Hybrid dark cards на cream body	`feedback_auth_flow_canonical.md`
Cert	Paper immutable dark в light theme	`feedback_certificate_canonical.md` (v4.4.17 update)
Modals	Менять Modal F без re-апрува	`feedback_modal_f_canonical.md`
Quiz	Скролл / асимметрия 4 опций	`feedback_no_scroll_on_interaction.md`
Sidebar	Менять Sidebar Б на admin	`feedback_admin_sidebar_canonical.md`
Lang	EN-first на investor с RU UI overlay	`feedback_no_anglicisms.md`
Naming	Дубли классов	`feedback_standardization_audit_rule.md`
Mobile	Поднимать mobile до desktop UI Kit	`project_pending_mobile_after_ui_kit.md`
Workflow	Commit без апрува	`feedback_audit_fix_workflow.md`
Fold-реальность	Мерить только 900 без контроля 800	`feedback_compact_fold_v3_v4_canonical.md` (v3 10.06)
Sticky-footer	min-h-screen у main + футер после	`project_academy_screens_ux_redesign.md`
Variants	Сухой список без рекомендации	`feedback_recommend_with_reasoning.md` (v4.5.0 new)

Когда читать¶

ПЕРЕД любой правкой — пройтись по списку «не нарушаю ли»
При сомнении «может так можно?» — first source of truth
При onboarding нового подрядчика — обязательно вместе с 01-mental-models.md
После каждого факапа — добавить в этот файл (превентивно для следующего раза)