📱

Get Our Mobile App

Take your business learning on the go!

Download on the App StoreGet it on Google Play

Top 5 OpenCode Skills That Actually 100x Your Workflow (Free)

AI Stack Engineer13:41

Transcription

Если вы использовали Open Code для какого-либо серьезного проекта, вы уже знаете, что агент силен, но рабочий процесс вокруг него имеет большее значение, чем большинство людей признают. Навыки — это то, как Open Code упаковывает инструкции, скрипты и справочные материалы в папку, которую он может извлечь только тогда, когда задача этого требует. Open Code перечисляет названия навыков и описания, а агент загружает полное содержимое по запросу через собственный инструмент навыков только тогда, когда он действительно в нем нуждается. Еще лучше, Open Code читает из шести различных мест хранения навыков, включая /skills, claude/skills и agents/skills, плюс глобальные версии каждого в вашей домашней конфигурации, что означает, что почти каждый навык, созданный для Claude code, может быть использован в Open Code без изменений. Это сохраняет ваше контекстное окно чистым и позволяет вам добавлять реальную экспертизу, не переписывая ваш запрос каждый раз. Пять навыков, которые я собираюсь рассмотреть, в основном заменили половину моей пользовательской настройки. Каждый из них решает проблему, за которую вы уже платите в виде потраченных токенов, сломанных сборок или общего пользовательского интерфейса. Итак, первый — это Graphify. Идея проста. Вы указываете на папку, любую папку, и он создает запрашиваемый граф знаний из всего, что находится внутри. Код, документы, PDF-файлы, скриншоты, фотографии досок, даже видео YouTube и аудиофайлы. Внутри Open Code вы вводите /graphify dot в подсказке TUI, и он приступает к работе. Поместите навык в папку /skills/graphify или в папку навыков вашей домашней конфигурации, и он будет автоматически подхвачен. Почему это важно именно для Open Code? Когда вы спрашиваете агента о большом репозитории, ему приходится просматривать файлы каждый ход. Токены быстро накапливаются, и если вы платите за токен через Open AI или Anthropic, этот счет растет с каждым разговором. Graphify выполняет три прохода в первый раз. Он использует tree sitter для обхода абстрактного синтаксического дерева каждого поддерживаемого языка. Таким образом, он получает классы, функции, импорты и графы вызовов без каких-либо затрат на LLM. Затем он локально транскрибирует любой аудио- или видеофайл с помощью Whisper, чтобы ничего не покидало вашу машину. Затем он параллельно отправляет документы, PDF-файлы и изображения в любую модель, с которой настроен Open Code, для извлечения концепций и отношений. Результатом является файл graph.json, интерактивный HTML-просмотрщик и отчет в формате markdown, перечисляющий наиболее связанные узлы и наиболее неожиданные связи. Число, которое постоянно цитирует сопровождающий, составляет в 71,5 раза меньше токенов на запрос по смешанному корпусу по сравнению с чтением необработанных файлов. Это соответствует моему собственному опыту. После первой сборки каждый последующий вопрос читает компактный граф вместо открытия 50 исходных файлов. Существует режим наблюдения, который автоматически перестраивает граф по мере редактирования, и команда клонирования, которая позволяет вам извлечь любой общедоступный репозиторий GitHub и построить его граф без ручного клонирования. Установка выполняется одной строкой с помощью tool install graphify и a graphify install. Если вы работаете в монорепозиториях или постоянно помещаете исследовательские статьи и заметки по проекту в папку /raw, это, вероятно, самый полезный навык из этого списка, особенно если вы используете Open Code с моделью с меньшим контекстом, где каждый токен имеет большее значение.

Номер два — awesome.md от vault agent. Это тщательно подобранная коллекция файлов design.md. Design.md — это формат, который Google представил через свой продукт Stitch ранее в этом году. Идея заключается в том, что AI-агенты плохо читают экспорты Figma или токены дизайна JSON, но они отлично читают markdown. Таким образом, файл дизайна — это просто текстовая спецификация системы дизайна. Настроение, цветовая палитра с HEX-значениями и ролями, шкала типографики, состояния компонентов, правила интервалов, что можно и чего нельзя делать, точки останова и краткий справочник для агента, который он может использовать при создании пользовательского интерфейса. Volta agent извлек реальные файлы дизайна примерно из 31 популярного веб-сайта: Stripe, Linear, Versil, Notion, Figma, Apple, Superbase, даже сам Anthropic. Вы помещаете файл в корневую папку вашего проекта рядом с agents.md и говорите Open Code создать соответствующую страницу. Теперь у агента есть каждый цвет, каждый вес шрифта, каждое значение тени, которое ему нужно, чтобы фактически попасть в нужный вид. Это особенно важно в Open Code, потому что модель, лежащая в его основе, меняется. GPT генерирует один стиль по умолчанию. Claude генерирует другой. Gemini генерирует третий. С файлом design.md, закрепленным в репозитории, все три дают примерно одинаковый результат, поэтому ваш проект визуально не смещается при переключении поставщиков. Комбинация, которую я на самом деле использую, это awesome design.md плюс agents.md. Agents.md говорит Open, как строить. Design.md говорит ему, как должны выглядеть вещи. Я начал с копирования файла Linear в проект, попросил Open Code в режиме сборки создать страницу настроек, и результат выглядел как Linear, без того, чтобы я написал ни одной инструкции по стилю. Репозиторий также поставляет предварительные HTML-файлы для каждого сайта, так что вы можете увидеть образцы и шкалу типов перед фиксацией. Это не гламурно, но если ваша проблема в том, что сгенерированный AI пользовательский интерфейс выглядит одинаково, это решает ее ценой одной копии файла.

Номер три — get done или GSD. Установка выполняется одной командой npx get shitdone- CC at latest. Суффикс CC — это пережиток Cloud Code, но сам навык — это просто markdown плюс скрипты оболочки. Поэтому он работает одинаково внутри Open Code. Что он решает, так это то, с чем в конечном итоге сталкивается каждая долгая сессия. Деградация контекста. Агент отлично подходит для первых 30% долгого проекта. Затем качество начинает падать, поскольку контекстное окно заполняется старыми планами, незавершенными задачами, и моделью, разговаривающей сама с собой. GSD относится к агенту как к младшему инженеру, который блестящ, но имеет плохую память, и строит систему планирования вокруг этого. Поток состоит из шести команд. /gsd new project задает вам вопросы, пока он действительно не поймет, что вы строите, затем запускает параллельные исследовательские агенты, затем пишет файл требований и дорожную карту. /gsd discuss phase — это место, где вы фиксируете решения по реализации до написания какого-либо кода. /gsd plan phase создает два или три атомарных плана, каждый из которых достаточно мал, чтобы выполнить его в свежем контексте. /gsd execute phase выполняет эти планы параллельными волнами, где это возможно, и последовательно, где это необходимо, и фиксирует каждую задачу с собственным атомарным коммитом. SLGSD verify work проводит вас через ручное приемочное тестирование пользователем с передачей сбоев отладочному агенту. Затем /GSD ship для создания PR. Умная часть заключается в том, что каждый исполнитель получает свежее контекстное окно исключительно для реализации. Ваша основная сессия Open Code остается на уровне 30 или 40% использования контекста, потому что основная работа выполняется в окнах под-агентов, которые исчезают, когда они закончены. Это хорошо сочетается с режимом планирования Open Code, который по дизайну является только для чтения. Вы нажимаете Tab, чтобы переключиться в режим планирования. Запустите / GSD discuss phase, и агент не сможет случайно коснуться файлов, пока он еще разбирается в архитектуре. Затем вы нажимаете Tab обратно в режим сборки для /gsd execute phase. Существует быстрый режим для специальных задач, который пропускает планирование, команда spike для одноразовых экспериментов и команда sketch, которая генерирует два или три варианта интерактивных HTML-макетов для каждого вопроса по дизайну. По моему собственному опыту, одни только атомарные коммиты git стоят установки. Если сборка сломается через 4 часа, git bisect точно скажет вам, какая задача это сделала.

Номер четыре — everything cla code от Afan Mustafa. Этот один огромен. 167 000 звезд, 25 000 форков, и репозиторий на самом деле не является одним навыком. Это целая система оптимизации производительности, которая поставляется с 48 специализированными агентами, 183 навыками, хуками, правилами, конфигурациями MCP и командами-заглушками. Автор выиграл хакатон Anthropic и совершенствовал это более 10 месяцев ежедневного использования. Несмотря на название, README явно перечисляет Open Code как поддерживаемую среду выполнения наряду с Claude code, Codec, Cursor и Gemini. Навыки загружаются из clude/skills, которые Open Code читает нативно. Таким образом, вы получаете всю систему без каких-либо преобразований. То, что я на самом деле использую из него, навык рабочего процесса TDD обеспечивает разработку, управляемую тестами, с 80% охватом. Агент ревьюера кода запускается после каждого значимого изменения и улавливает ошибки, которые в противном случае попадают в продакшн. Резольвер ошибок сборки — это то, что меня удивило. Когда сборка терпит неудачу, он не просто выдает ошибку. Он проходит через зависимости, несоответствия версий и несоответствия конфигурации структурированным образом. Существует также система непрерывного обучения, которая автоматически извлекает шаблоны из ваших сессий в повторно используемые навыки, и сканер безопасности под названием Agent Shield, который выполняет более 1200 тестов над вашей конфигурацией агента для поиска рисков внедрения и утечек секретов. Один только совет по оптимизации токенов в README стоит прочтения, особенно для пользователей Open Code, которые платят за себя через Open Router или напрямую. Переключение модели по умолчанию на модель среднего уровня, такую как Sonnet или GPT40 Mini, ограничение максимального количества токенов мышления до 10 000 и более раннее срабатывание компактирования при 50% использовании контекста приводит к снижению примерно на 60% без потери качества на большинстве задач. Установка выполняется npm install, или вы можете поместить папку skills в .claude/skills внутри вашего проекта. Теперь есть настольная панель для визуального просмотра всех агентов и навыков. Если вам нужен один репозиторий, который предоставляет вам полную систему производственного уровня вместо сшивания пяти меньших, то это он.

Номер пять — UIUX Promax Skill от Next Level Builder. Этот один сфокусирован на одной проблеме. Пользовательский интерфейс, который генерирует любой AI-агент по умолчанию, выглядит шаблонно. Те же кнопки Tailwind, тот же фиолетовый градиентный герой, та же скучная панель управления. UIUX Pro Max поставляет движок рассуждений, который берет описание вашего проекта и за секунды выдает полную индивидуальную систему дизайна. И поскольку Open Code не зависит от поставщика, этот навык особенно полезен здесь. Вы перестаете полагаться на то, какой бы моделью вы ни пользовались, чтобы иметь хороший вкус в дизайне. То, как он работает под капотом, интересно. Существует 161 отраслевое правило рассуждений. Каждое из них сопоставлено с типом продукта. Спа для красоты, финтех-банкинг, игровой портфель, стоматологическая клиника, B2B SAS, Web 3 NFT и так далее. Когда вы запрашиваете целевую страницу для вашего спа для красоты, движок выполняет пять параллельных поисков по типам продуктов, библиотекам стилей, цветовым палитрам, шаблонам целевых страниц и сочетаниям типографики. Затем он ранжирует совпадения с помощью BM25, отфильтровывает анти-шаблоны для этой отрасли и возвращает полный шаблон спецификации, название стиля, цветовую палитру с HEX-значениями и семантическими ролями, сочетание шрифтов со ссылкой на Google Fonts, ключевые эффекты, анти-шаблоны, которых следует избегать, и предварительный контрольный список, который охватывает коэффициенты контрастности, состояния наведения, кольца фокуса и адаптивные точки останова. Часть с анти-шаблонами — это то, что я ценю больше всего. Для финтех-банковского приложения он явно скажет агенту не использовать AI-фиолетовые градиенты или резкие анимации. Для спа для красоты он заблокирует темный режим и неон. Это именно те значения по умолчанию, к которым склонны большинство моделей. Навык поставляется с 67 стилями пользовательского интерфейса, включая стекломорфизм, глиноморфизм, неоморфизм, сетку бенто, брутализм и UI-аврору. Он поддерживает 15 текстовых стеков от React и Next.js до Swift UI, Jetpack Compose, Flutter, Laravel и shad cn ui. Установка выполняется npm install-g ipro- cli, затем ipro init-i внутри вашего проекта, и вы можете передать любое имя агента, включая Open Code. Существует шаблон master plus overrides для сохранения системы дизайна между сессиями. Таким образом, страница панели управления может переопределить основные правила без необходимости повторного объяснения всего. Краткое резюме перед уходом. Graphify предоставляет Open Code слой памяти для любой папки кода или исследований. Awesome.md делает пользовательский интерфейс последовательным независимо от того, какая модель работает за Open Code. Get done устраняет деградацию контекста с помощью шестикомандного рабочего процесса, управляемого спецификациями, который идеально сочетается с режимом планирования и режимом сборки. Everything Claude Code — это готовая к производству система с агентами, хуками и сканером безопасности, которая работает на Open Code без каких-либо преобразований. UIUX Pro Max генерирует реальные системы дизайна на основе вашей отрасли вместо того же стандартного вида, который производит каждая модель. Все пять бесплатны. Все пять устанавливаются менее чем за 5 минут, и они работают поверх друг друга, не конфликтуя. Выберите тот, который больше всего мешает вашему текущему рабочему процессу, и начните с него. Оставьте комментарий, если вы хотите, чтобы я сделал более подробный обзор любого из них, и я увижу вас в следующем.