Дата публикации
coding

Как выжать из Claude максимум в 3D‑проектах: рабочий цикл для Three.js и CAD

Что появилось / что изменилось

Автор проекта Counter Slayer и Table Slayer описывает, как превратил Claude Code из просто автодополнения кода в полноценного участника 3D‑пайплайна. Ключевое изменение — не в самой модели, а в подходе к работе:

  • вместо «попросил — получил код» он строит вокруг Claude замкнутый цикл итераций;
  • Claude сам запускает скрипты, генерирует STL‑файлы, рендерит изображения сцены и проверяет результат по скриншотам;
  • вся работа с геометрией идёт через понятные для LLM «читаемые» артефакты: PNG‑рендеры, JSON с позициями, логирование координат.

Появился конкретный workflow для 3D‑веба на Three.js:

  1. Внесение изменений в геометрию (файлы lid.ts, counterTray.ts, box.ts).
  2. Перегенерация STL: npx tsx scripts/generate-geometry.ts.
  3. Рендер статичных видов сцены: npx tsx scripts/capture-view.ts --angle iso и другие ракурсы.
  4. Чтение project.json с позициями и раскладкой объектов.
  5. Проверка нескольких углов обзора и зума.
  6. Если результат не совпадает с задачей — возврат к шагу 1.
  7. Только после успешных проверок Claude сообщает разработчику, что задача закрыта.

Главное новшество — разработчик больше не вручную делает скриншоты и не «кормит» их ассистенту. Claude получает инструменты, чтобы сам управлять камерой, ставить маркеры в сцене и анализировать рендеры.

Как это работает

Базовая проблема: Claude 4 неплохо рассуждает о CSS и цвете, но «падает» на пространственных задачах в 3D. Модель не понимает бинарные STL‑файлы, хотя и уверяет, что может. Попытка заставить её «читать» STL приводит к длинной цепочке: установка Python‑библиотек, просмотр мешей, вращение камеры — полезно для анализа файлов, но плохо помогает, когда источник проблем в самом CAD‑коде.

Автор решает это через слой инструментов вокруг Three.js‑приложения:

  • скрипт capture-view.ts рендерит сцену с разными параметрами:

    • пресеты ракурсов: --angle iso | top | front | left | bottom;
    • зум: --zoom 3;
    • произвольная позиция камеры в координатах Three.js (Y‑up): --pos "100,80,150" --look-at "0,25,50";
    • вывод в конкретный файл: --out mesh-analysis/view-top.png;
    • выбор объекта по ID и автоматический ракурс: --trayId nrme206 --angle bottom --zoom 2.
  • отдельные скрипты генерируют геометрию и STL.

  • project.json хранит конфигурацию сцены: позиции, раскладку, связи между объектами.

Claude получает инструкцию‑«цикл»: как изменять код, какие команды запускать, какие файлы читать и какие PNG анализировать. Плюс — возможность ставить в сцену визуальные маркеры (например, красные сферы в нужных координатах), чтобы самому проверять, совпадает ли фактическое положение с ожидаемым.

Фактически разработчик превращает абстрактный текстовый ассистент в скриптового оператора, который умеет:

  • навигировать по приложению (через Playwright или похожий инструмент);
  • управлять камерой в 3D;
  • расставлять маркеры и сравнивать скриншоты с задачей;
  • повторять цикл без постоянного «подтверди, что всё ок» со стороны человека.

Что это значит для вас

Если вы пишете 3D‑веб на Three.js, работаете с CAD‑геометрией или сложными сценами, из этого опыта можно вынести несколько практических правил:

  1. Не верьте, что Claude «читает» STL‑файлы напрямую. Бинарный STL для него непрозрачен. Лучше сразу добавить слой инструментов, которые превращают меши в картинки и структурированные данные.

  2. Думайте в терминах «читаемых выходов».

    • PNG‑рендеры с разных ракурсов;
    • JSON с координатами и связями объектов;
    • временное логирование позиций, углов, размеров. Claude хорошо справляется, когда видит картинку и текстовое описание сцены, а не сырые бинарники.
  3. Соберите свой «цикл геометрии».

    • Скрипт генерации геометрии и STL.
    • Скрипт рендера видов сцены.
    • Набор команд для зума, смены ракурса, выбора объекта по ID.
    • Инструкцию для Claude, как всё это запускать и по какому критерию считать результат успешным.
  4. Не полагайтесь на модель в чистом пространственном мышлении. Для сложных пересечений, boolean‑операций и скрытых объёмов в CAD лучше дать ей визуальные подсказки. Например, попросить поставить красную сферу в точку, где должен появиться вырез, и проверить скриншот.

  5. Руки всё равно нужны. Автор всё ещё вручную пишет важные куски — CSS, дизайн, раннюю архитектуру API. Claude берёт на себя рутину, но код после него приходится «санитизировать» и дорабатывать.

Если вы работаете из России, доступ к Claude 4 может потребовать VPN и зарубежный аккаунт. Без этого описанный подход не получится воспроизвести один в один, но идею цикла можно перенести на любого ассистента с поддержкой кода и изображений.

Место на рынке

В тексте нет прямых сравнений с GPT‑4o, GPT‑5 или другими моделями. Автор фокусируется на том, как выстроить процесс, а не на том, кто быстрее или дешевле.

Из контекста видно несколько моментов:

  • Claude 4 достаточно хорошо пишет прикладной код для веб‑приложений, если разработчик задаёт архитектуру и каркас.
  • Визуальные задачи без картинок для него сложны: пространственный анализ 3D‑сцен, особенно с boolean‑операциями в CAD, даётся тяжело.
  • Работа с изображениями — сильная сторона: если дать несколько рендеров сцены под разными углами и понятный словарь команд, модель может сама находить ошибки и предлагать исправления.

Главный вывод для рынка: вопрос уже не только в «какая LLM умнее», а в том, кто сумеет построить вокруг неё правильный слой инструментов. Автор показывает, что даже без нативной поддержки STL можно эффективно использовать Claude 4 в сложных 3D‑проектах, если превратить его в участника замкнутого цикла «изменил код → сгенерировал геометрию → отрендерил → проверил по картинке». Это подход, который легко перенести и на другие ассистенты, если у них есть доступ к коду и к изображениям.


Читайте также

Как выжать из Claude максимум в 3D‑проектах: рабочий цикл для Three.js и CAD — VogueTech | VogueTech