ModelEditor: From Lunch Break Experiment to Functional 3D Engine
“Let’s see how far I can push WebGL in a lunch break.”
That was the entire plan. WebGL is low-level, unforgiving, and normally avoided unless you need full control — which makes it a perfect stress test for rapid development.
Forty-eight hours later, the experiment had grown into a functional 3D model editor with scene graphs, lighting, cameras, and interactive tools.
The interesting part is not the renderer itself, but how quickly it emerged.
What Was Built
- Custom WebGL renderer (no frameworks)
- Hierarchical scene graph with parent/child relationships
- Multiple camera types (perspective and orthographic)
- Orbit, pan, and zoom controls
- Phong lighting with multiple point lights
- Material system with adjustable properties
- Interactive 3D transform gizmo
- Drag-and-drop scene manipulation
- Property panels and scene tree UI
- Basic asset handling
ModelEditor snapshot after rapid iteration: scene graph, drag-and-drop organization, materials, lighting, camera mapping, and transform tooling in one minimal WebGL editor.
Why No Frameworks?
This was a deliberate constraint, not an omission. Using raw WebGL keeps the system small in code size, transparent in behavior, easy to reason about, and free from hidden abstractions.
More importantly for AI-assisted development, it keeps the context small. Framework-heavy stacks introduce layers of complexity that slow iteration and increase the chance of unintended side effects.
Starting simple allows complexity to be added later only when needed.
KISS as a Prototyping Strategy
- Minimal dependencies
- Clear data flow
- Explicit control over rendering
- Small, focused modules
- Avoid premature architecture
This makes rapid changes safer. When the system is understandable end-to-end, refactoring becomes cheap instead of risky.
AI-Assisted Development Workflow
- Define a specific feature
- Generate or draft code
- Test immediately in the browser
- Commit if stable
- Iterate
Version control acted as a safety net, enabling aggressive experimentation without fear of breaking everything permanently.
Why This Matters
The combination of clear constraints, lightweight technology, immediate feedback, and structured iteration creates an environment where progress compounds rapidly. What began as a renderer experiment became a usable editing tool without a formal roadmap.
Limitations
The editor is not production-ready. Performance, robustness, and advanced features would require further engineering. But the objective was exploration: how far can a minimal stack go, and how quickly?
Takeaways
- Starting simple accelerates discovery
- Frameworks are not always required for complex results
- Small context improves AI-assisted iteration
- Immediate testing is critical for rapid progress
- Version control enables fearless experimentation
Next
Future work could extend the editor with import/export, better asset pipelines, or higher-level abstractions — building on the proven core rather than replacing it.