1. Context
The regional government sought to digitize its energy renovation tools to make it easier for individuals to submit renovation requests and improve the tracking and reporting process for advisors. This assignment did not include any interface design work regarding visual identity. The final deliverables were realistic wireframes with realistic data. The whole process of adapting the print graphic charter into a system design was part of a potential second package.
2. Objective
The objective was to design an all-in-one solution that serves as a central interface for the advisors. Those interfaces serve others key user groups: individuals applying for renovations (uploading documents & asking for meetings), and regional administrators responsible for reporting (datatable alimented by the differents category from the tracking tool).
3. Process
3.1. User Research and Analysis
I conducted qualitative user interviews with energy advisors, renovation applicants, and regional project managers to gather insights into their needs, pain points, and expectations. These sessions helped define user personas and informed the product’s feature set.
3.2. User flows & storyboard
Through co-design workshops with stakeholders, we defined frictionless user journeys tailored to different personas. This was followed by the development of detailed storyboards to visualize user flows and task completion processes.
3.3. Wireframing and Prototyping
I created an interactive, evolving prototype using a feedback loop from remote testing sessions with both advisors and external users. Regular demos allowed for iterative improvements, incorporating real-time feedback to optimize the user experience.
3.4. Content Handoff and Documentation
I produced a detailed functional specification document, tailored for both developers and the UI Designer. This included user stories, interface behavior descriptions, and data types, ensuring a seamless handoff between design and development phases.
Achievement: The clear documentation and defined user stories helped accelerate the development process, cutting development time by 20%, by comparison with a past similar project.
4. Tools Used
- Balsamiq for wireframing