Interactive Training App Prototype
Budget: £250 – £750 GBP
I am looking for a clean, efficient front-end web developer to complete a simple, low-code training application prototype.
The Project Architecture is Already Defined:
The app runs on a math-free "digital flipbook" image-refresh engine across 49 static steps. No complex 3D engine or coordinate math is required. Every page swap simply updates the background image vectors based on user input.
What I Will Provide to You:
1. A pre-written HTML5/JavaScript code shell outlining the logic architecture.
2. A complete Functional Software Specification document mapping out the states.
3. A folder of 49 sequential whiteboard photo assets for the canvas background.
4. Photorealistic component image cutouts for the bottom interaction tray.
Key Core Mechanics to Finish:
- UI Layout: Grid split into a Main Viewport Canvas, a Top Plan View card, an Opposite Plane View card, and a bottom Sidebar Component Dock.
- Hooking up local visual assets to the UI layout splits.
- Mapping a single invisible hit-box target position for each of the 49 steps.
- A continuous background millisecond stopwatch engine (Time-Attack speed run).
- Instant retraction rule: Wrong placements immediately flush and snap back to the sidebar container slot.
- 1-second visual success cue: Correct placements trigger a 1000ms freeze, screen text HUD updates, and text-to-speech audio pronunciation before refreshing to the next frame layout.
The app needs to run as a single file or a clean local folder structure where I can double-click 'index.html' on my desktop and immediately test it natively in my Chrome or Edge browser.
The Project Architecture is Already Defined:
The app runs on a math-free "digital flipbook" image-refresh engine across 49 static steps. No complex 3D engine or coordinate math is required. Every page swap simply updates the background image vectors based on user input.
What I Will Provide to You:
1. A pre-written HTML5/JavaScript code shell outlining the logic architecture.
2. A complete Functional Software Specification document mapping out the states.
3. A folder of 49 sequential whiteboard photo assets for the canvas background.
4. Photorealistic component image cutouts for the bottom interaction tray.
Key Core Mechanics to Finish:
- UI Layout: Grid split into a Main Viewport Canvas, a Top Plan View card, an Opposite Plane View card, and a bottom Sidebar Component Dock.
- Hooking up local visual assets to the UI layout splits.
- Mapping a single invisible hit-box target position for each of the 49 steps.
- A continuous background millisecond stopwatch engine (Time-Attack speed run).
- Instant retraction rule: Wrong placements immediately flush and snap back to the sidebar container slot.
- 1-second visual success cue: Correct placements trigger a 1000ms freeze, screen text HUD updates, and text-to-speech audio pronunciation before refreshing to the next frame layout.
The app needs to run as a single file or a clean local folder structure where I can double-click 'index.html' on my desktop and immediately test it natively in my Chrome or Edge browser.