this is the full and ref image that I used:
You are a senior real-time 3D artist and Three.js engineer. Build a detailed, realistic, interactive mid-engine supercar in the existing project using Three.js and WebGL.
Use the attached image as a visual reference. It shows one original, modern Italian-inspired supercar from front three-quarter, side, and rear three-quarter angles. Keep the design consistent across all views. Do not reproduce the image as a flat plane, billboard, or texture. Build a real 3D car that looks convincing from every angle.
Work only inside this project folder. I do not need a mobile view or mobile-specific layout. Focus on the reference image and this prompt.
Required workflow: Complete the phases below in order. At the end of every phase, run the project using its existing workflow, inspect the actual rendered result, fix problems, and repeat the checks until the phase passes. Keep the project runnable between phases. Do not mark a phase complete based on code inspection alone when its appearance or behavior needs to be checked in a rendered scene. Make routine implementation choices yourself and continue through all phases without waiting for my review.
Phase 0 — Inspect the project
Inspect the project structure, Three.js version, rendering setup, conventions, local assets, and run and preview workflow. Decide where the reusable car component belongs and how it should integrate. Reuse suitable local assets and existing patterns. Do not add external dependencies or fetch assets unless the project already has an established workflow for doing so.
Check: Confirm that the implementation fits the project architecture and that you know how to launch and inspect the result.
Phase 1 — Build the silhouette
Create a low, wide, wedge-shaped mid-engine supercar with a short nose, swept windshield, compact two-seat cabin, broad rear shoulders, deep side intakes, and short overhangs. Use approximate real-world scale: 4.5 m long, 2.0 m wide, and 1.2 m tall. Use Y as up, X as left/right, and +Z as forward. Place the origin at the car’s ground-level center, or document a different origin if required by the project.
Create actual shaped 3D geometry. Do not leave the result as a crude collection of boxes or floating primitives.
Check: Inspect front three-quarter, side, and rear three-quarter views. Correct the silhouette, proportions, wheelbase, and wheel placement.
Phase 2 — Build the exterior
Create separate body panels with readable gaps around the doors, front storage lid, and rear engine hatch. Add performance tires with visible tread, detailed wheels, brake discs and calipers, headlights, tail lights, indicators, mirrors, window glass, wipers, front splitter, side skirts, rear diffuser, exhaust outlets, grilles, and visible underbody details. Make the side and rear air intakes look functional and integrated into the body.
Check: Inspect the same three views. Correct visible intersections, disconnected parts, and missing surfaces.
Phase 3 — Refine materials
Match the reference image’s metallic burnt-orange paint, dark wheels, restrained carbon-fiber accents, clear glazing, and realistic lights. Use plausible roughness and reflections for paint, glass, rubber, metal, leather, and carbon fiber. Keep panel edges and details readable under ordinary scene lighting. Avoid excessive gloss, oversaturated colors, and unstable shaders.
Check: Inspect the car under the project’s normal lighting from front, side, and rear angles. Adjust materials until its form remains clear.
Phase 4 — Build the cockpit and engine bay
Create a complete, believable two-seat interior visible through the windows and open doors. Include a shaped dashboard, readable instrument display, steering wheel and column, central controls, pedals, seats with bolsters and seams, seat belts, inner door panels, floor, and center tunnel.
Build a convincing engine assembly beneath the rear hatch. Include engine covers, intake parts, hoses, wiring, cooling components, exhaust routing, and supporting structure. The components need not simulate a particular production engine, but their scale, arrangement, and fit must look credible.
Check: Inspect the interior through closed windows and open doors, then inspect the open engine bay. Correct clipping, misplaced parts, and glass that hides the interior.
Phase 5 — Animate the doors and hatches
Make both doors open and close smoothly using mechanically plausible pivots. Scissor-style doors are suitable if the hinge motion and clearances are credible. Make the rear engine hatch operable, and make the front storage lid operable if the design includes one. Keep mirrors, glass, handles, trim, and inner panels attached to their moving parts.
Expose a clear API for toggling and explicitly opening or closing each part. Add interaction targets or raycasting hooks for a host application. Keep optional demo controls in the demo page rather than imposing UI on the reusable car asset.
Check: Open and close every moving part repeatedly. Verify pivots, easing, clearances, and attachments.
Phase 6 — Add engine audio
Provide engine start, idle, rev, and stop behavior if the runtime supports browser audio. Prefer suitable local audio assets. Otherwise, create layered Web Audio synthesis with harmonic content, filtering, and subtle noise. Revving should smoothly change pitch, intensity, and texture.
Initialize or resume audio only after a user gesture. Never autoplay. Handle muted or unavailable audio gracefully, and stop and dispose of audio nodes cleanly. Expose start, stop, and optional throttle or rev controls through the car’s API.
Check: Test start, idle, rev, stop, and disposal through user actions. Confirm there is no autoplay, lingering audio, or console error.
Phase 7 — Integrate and polish
Keep the car asset self-contained and separate from unrelated scene setup. Do not bake in a floor, background, scenery, camera, or permanent environment lighting. Its materials should work with lighting supplied by a host scene.
Document a concise interface for creating the car, attaching its root object to a scene, controlling doors and hatches, controlling engine audio, updating animation, and disposing of resources.
Run the project and inspect front three-quarter, side, rear three-quarter, cockpit, and open-engine views. Refine proportions, geometry, materials, and details until the result closely follows the attached reference and remains convincing from every angle.
Final report: List the files changed, explain how to instantiate and control the car, state which visual and audio checks you completed, and clearly mention any checks you could not perform. Do not stop at a plan or blockout.