An interactive web editor for creating emergency and evacuation plans with specialized graphical tools.
EvacuaPlan Studio brings to the web a process that normally requires general-purpose design tools or manual work. The goal is to provide a specialized, understandable editor prepared for printable documents.
Role
Product design and Full Stack development
Timeline
2026–present
Platform
Desktop and tablet
Status
Functional technical prototype
The problem
Emergency plans combine architectural structure, symbols, routes, text and print requirements. General-purpose tools can be too complex for users who only need to produce a clear and useful document.
The challenge is to reduce that complexity without losing precision, editing capability or compatibility with different input devices.
The solution
I designed a fixed canvas per floor with dedicated tools for walls, doors, windows, areas, text, stairs and emergency symbols.
The interface combines direct canvas editing with a contextual properties panel, history controls, multi-selection and interactions adapted to mouse, touch and stylus input.
My role
I define tool behavior, convert operational needs into interaction rules and develop the technical architecture that manages objects, geometry and change history.
Functional definition and editing experience
Object modeling and graphical state
Drawing and transformation tools
Mouse, touch and Apple Pencil interaction
Visual, functional and responsive testing
Git, checkpoints and incremental releases
Engineering decisions
The visible part is the canvas; the real difficulty is preserving coherent relationships between objects and allowing reversible changes.
Each floor uses a defined area to preserve scale, orientation and the relationship with the final printable output.
Walls, openings, areas, text and symbols maintain their own properties and behaviors.
Changes are managed through history so users can experiment without losing the previous state.
Several elements can be moved and managed together while respecting locked or protected objects.
Tools are validated with mouse, touch gestures, pinch zoom, two-finger pan and Apple Pencil.
Features are introduced in small stages to validate behavior before expanding complexity.
Current capabilities
Creation and editing of walls, doors, windows, areas and stairs.
A library of elements that can be moved, rotated, scaled and locked.
Multi-select, copy, paste, lock, hide, delete, undo and redo.
Zoom, fit-to-view, panning and behavior adapted to touch devices.
A foundation prepared for separate levels and related views of a building.
The editor structure is designed around clear final documents prepared for printing.
Visual walkthrough
Symbol library and transformation
Emergency elements that can be moved, resized, rotated, locked and copied.
Project status
The editor already supports structures, symbols, object transformation and multi-selection on desktop and tablet.
The project remains in active development and demonstrates work with complex state, geometry, graphical interfaces and touch interaction.
Verifiable signals
Active development
Mouse, touch and Apple Pencil
Multi-selection
Undo and redo
Multi-floor architecture
Next step
I can help translate interaction rules and technical processes into a maintainable web application.
