Рассказываем как сделать из Sonnet 5.5 сеньора-фронтендера с 15-летним опытом — гайд из 5 пунктов

Sonnet 5.5 — первая модель, которую реально можно превратить в сеньора-фронтендера. Не потому, что она «умнее». А потому, что она умеет следовать референсам, если они правильные. Гайд - здесь

Рассказываем как сделать из Sonnet 5.5 сеньора-фронтендера с 15-летним опытом — гайд из 5 пунктов

Фронтендер с пятнадцатилетним опытом не просто пишет код. Он знает, что такое хороший отступ. Чувствует, когда анимация «плоская», а когда живая. Понимает, что кнопка не должна быть просто синей — она должна быть правильной синей. Этот опыт невозможно упаковать в промпт «сделай красиво». Но можно упаковать в систему.

Что для этого нужно

Пять инструментов, которые закрывают всё: от стиля до финальной полировки. Гайд - здесь

Стиль. Два источника: Refero Styles — сайт, где собраны цвета, типографика и дизайны в готовые DESIGN.md, и awesome-design-md — коллекция из 118 тысяч звёзд на GitHub. Выбираете один, кладёте в корень проекта, добавляете @-импорт в CLAUDE.md — и Claude дальше следует его палитре, шрифтам, отступам. Не «на глаз», а по системе.

Компоненты. 21st.dev — готовые блоки на React и Tailwind. Component Gallery — 95 дизайн-систем на один и тот же компонент. Claude сначала проверяет 21st, потом смотрит, как то же самое реализовано в зрелых системах. И только потом пишет.

Анимации. Kinetics — анимации на физике пружин. Не CSS с задержками, а настоящая динамика. Можно взять готовый код или промпт для ИИ.

Демо-видео. HyperFrames — Claude пишет видео в HTML, HyperFrames рендерит. Референс разбирается на кадры, собирается в одно изображение, чтобы увидеть темп и переходы. Дальше — ролик.

Полировка. Impeccable — три команды прямо в Claude Code: bolder, distill, polish. Прогоняете результат — получаете то, что не стыдно показать.

Что меняется

Раньше вы говорили «сделай красиво» и получали то, что модель считает красивым. Часто — синие прямоугольники с закруглёнными углами. Теперь вы даёте ей словарь: конкретные палитры, проверенные компоненты, живые анимации, референсы. И она говорит на этом языке.

Вы не учите модель быть дизайнером. Вы даёте ей то, чем пользуется дизайнер. Остальное Sonnet 5.5 сделает сам.

Гайд - здесь

11