Developers
D3pth engine is built for developers who want to control regular HTML elements in a spatial browser-side presentation layer. It keeps the project close to ordinary HTML, CSS, and JavaScript while adding depth, camera-like movement, and finite-state-machine-driven transitions.
1. What developers get
D3pth engine lets developers work with ordinary HTML content blocks and place them into a controlled 3D-like scene. Elements with the class name “card” can be translated, rotated, and animated through defined scene states.
2. Regular HTML structure
A D3pth engine page is still a normal web page. The system does not require WebGL, canvas, or a game engine. The implementation is based on DOM elements, CSS transforms, configuration objects, and browser-side JavaScript.
3. Typical page elements
A typical implementation contains a visible viewport, a scene container, a world container, and controlled card elements.
- viewport3d
- scene
- world
- card elements
- scrollSpace for scroll-driven interaction
4. Card data attributes
Cards can carry data attributes that define identity, position, depth, and rotation. These values can then be used by the engine and by the state configuration.
- data-item: card identifier
- data-x: translation on the x axis
- data-y: translation on the y axis
- data-d3pth: depth value
- data-alpha: rotation around the x axis
- data-beta: rotation around the y axis
- data-gamma: rotation around the z axis
5. Scene configuration
Developers control geometry, perspective, spacing, depth scaling, and scene behavior through configuration. The final effect depends on the page structure, CSS, content dimensions, and state definitions.
6. Finite state machines
D3pth engine uses finite state machines to move the scene between named states. This makes transitions explicit, repeatable, and easier to reason about than a loose collection of unrelated animation callbacks.
7. Camera control
The engine can expose camera-like control so that the visible scene can react to scrolling, user events, or custom application logic. This allows developers to connect normal page behavior with spatial presentation.
8. Developer responsibilities
D3pth engine gives you the spatial presentation layer, but the final implementation remains your responsibility.
- HTML structure
- CSS layout and styling
- Responsive behavior
- Accessibility
- Performance testing
- Browser compatibility
- Touch and keyboard interaction
- Deployment into the target website
9. What D3pth engine is not
D3pth engine is not a full application framework. It should be treated as a licensed browser-side engine for spatial control of website content.
- It is not a CMS
- It is not a hosting platform
- It is not a visual page builder
- It is not a replacement for frontend architecture
- It is not a substitute for responsive testing
10. Licensing and source notice
Commercial use requires a valid license. The license notice is part of the licensed materials and must remain attached to the delivered, deployed, bundled, embedded, minified, or published source code according to the applicable license terms.
11. Summary
For developers, D3pth engine is a practical way to build browser-native spatial presentations from regular HTML elements, controlled through configuration, state machines, and normal frontend code.