Интерактивная 3D-сцена с мармеладной долькой апельсина на WebGPU: сравнение версий Claude Opus 5.5 в день релиза и сегодня

Промпт

Создай Citrus Jelly — интерактивную 3D-сцену с долькой апельсина из мармелада. Всё должно работать непосредственно в браузере в одном HTML-файле с использованием WebGPU и шейдеров WGSL. Создай настоящую объёмную 3D-геометрию, а не изображение или заранее записанную анимацию.
ВНЕШНИЙ ВИД
Толстая полукруглая долька апельсина с ярко-оранжевой мякотью, светлым слоем альбедо и более плотной внешней кожурой.

Видимые радиальные сегменты, тонкие внутренние перегородки и крошечные пузырьки.
Сочный полупрозрачный мармеладный материал с мягкими бликами, преломлением света и цветом, зависящим от глубины.
Не допускай, чтобы он выглядел как жёсткий пластик или стекло.
Используй светло-кремовый фон, мягкое студийное освещение и контактную тень. Избегай пересвета.
ФИЗИКА И ВЗАИМОДЕЙСТВИЕ

Позволь пользователям захватывать мышью или пальцем любую видимую точку и тянуть её.

Деформация должна начинаться в точке захвата и естественно распространяться на соседние области.
Мякоть должна растягиваться и утончаться под натяжением, а кожура — оказывать большее сопротивление.
После отпускания долька должна мягко возвращаться в исходное состояние, а колебания — постепенно затухать.
Используй стабильную симуляцию мягкого тела: пружинную сетку или объёмные упругие ограничения с сохранением объёма.
Сегменты, перегородки и пузырьки должны деформироваться вместе с мякотью, а не отделяться от неё и не плавать независимо.
Добавь столкновения с землёй: при ударе долька должна слегка сплющиваться, а затем покачиваться.
Не допускай мгновенного возвращения, бесконечных колебаний и разрушения геометрии.
ИНТЕРФЕЙС

Минималистичная редакционная компоновка с большим количеством свободного пространства.

Крупный курсивный заголовок с засечками “Citrus Jelly.” слева.
Компактная панель управления справа с ползунками Firmness и Internal damping.
Добавь кнопки Give it a nudge, Reset и Pause.
Покажи переключатели Mesh и ¼ speed.
Три цветовых пресета: Orange, Blood Orange и Lemon.
Небольшая подсказка по взаимодействию: “Grab. Stretch. Let go.”
Все подписи должны быть на английском языке, а элементы управления — удобными на компьютерах и мобильных устройствах.
ТЕХНИЧЕСКИЕ ТРЕБОВАНИЯ

Настоящий рендеринг с помощью WebGPU, а не замена на Canvas 2D.

Генерируй геометрию и материалы в коде, не используя готовые модели.
Используй фиксированный шаг симуляции и ограничения, предотвращающие чрезмерное растяжение.
Обеспечь плавную работу во время захвата, перетаскивания и отпускания.
Показывай понятное резервное сообщение, если WebGPU недоступен.
Протестируй разные точки захвата, сильное растяжение, затухание колебаний, столкновения и сброс.
Главный приоритет — убедительное ощущение мармелада. Долька должна выглядеть мягкой и сочной, а её движение — настолько приятным, чтобы людям хотелось снова и снова её растягивать.

Create Citrus Jelly — an interactive 3D scene featuring a gummy orange slice. Everything must run directly in the browser in a single HTML file using WebGPU and WGSL shaders. Build genuine volumetric 3D geometry, not an image or a prerecorded animation.
APPEARANCE
A thick semicircular orange slice with vibrant orange flesh, a pale pith layer, and a firmer outer rind.

Visible radial segments, thin internal membranes, and tiny bubbles.
A juicy, translucent gummy material with soft highlights, light refraction, and depth-dependent color.
Avoid making it look like rigid plastic or glass.
Use a light cream background, soft studio lighting, and a contact shadow. Avoid overexposure.
PHYSICS AND INTERACTION

Let users grab any visible point with a mouse or finger and pull it.

Deformation must originate at the grab point and propagate naturally through neighboring areas.
The flesh should stretch and narrow under tension, while the rind offers more resistance.
On release, the slice should spring back gently, with oscillations gradually settling.
Use a stable soft-body simulation: a spring mesh or volumetric elastic constraints with volume preservation.
Segments, membranes, and bubbles must deform with the flesh rather than separating or floating independently.
Include ground collisions: the slice should squash slightly on impact and wobble afterward.
Prevent instant snapping back, endless oscillation, and exploding geometry.
INTERFACE

A minimal editorial layout with generous whitespace.

A large italic serif heading, “Citrus Jelly.”, on the left.
A compact control panel on the right with Firmness and Internal damping sliders.
Give it a nudge, Reset, and Pause buttons.
Show mesh and ¼ speed toggles.
Three color presets: Orange, Blood Orange, and Lemon.
A small interaction hint: “Grab. Stretch. Let go.”
All labels in English, with comfortable desktop and mobile controls.
TECHNICAL REQUIREMENTS

Genuine WebGPU rendering, not a Canvas 2D substitute.

Generate geometry and materials in code without premade models.
Use a fixed simulation timestep and constraints that prevent excessive stretching.
Maintain smooth performance during grabbing, dragging, and release.
Display a clear fallback message when WebGPU is unavailable.
Test different grab locations, strong stretching, oscillation decay, collisions, and reset.
The main priority is a convincing gummy feel. The slice should look soft, juicy, and so satisfying in motion that people want to keep stretching it.