In order to help users save on the electricity bill, SU Eletricidade (former EDP SU) has a recurring campaign where it offers a Smart Plug (SP) that allows to reduce the electricity bill by up to €44/year. This initiative exists under the Electricity Consumption Promotion Plan by Energy Services Regulatory Authority – ERSE.
My responsibility was to translate legal and technical specifications to identify the user flow, build wireframes and prototype, iterated after usability testing.
To manage this campaign, it was necessary a web application and respective back-office. Here we focus only on the Web Application.
The first challenge was to translate both, legal and technical specifications (both documents going well above 300 pages), into simple user and functional flows, and within a tight deadline.
Another challenge was the necessary support and collaboration from people working on different EDP facilities that would have to be in constant contact for feedback and inputs, but that ended up being very well managed by Project Manager 🙂
Identification of all steps required to complete the task of checking availability (subject to the max of 80,000 Smart Plugs in each campaign) and eligibility (each contract holder can ony get 1 SP), and fill in application.
Mapping the steps
This context mapping changed a lot during the process, being initially heavily populated, with every team member concern and specifications interpretation piling up.
After iterations, this was the shared understanding of the steps mapping. The original map was hand drawn and really messy, so I’ve redrawn this one for clarity and translation.
Flow and interactions
The next step was to identify all the Interactions on each step and plan for user feedback along the way. This can be done with low fidelity (low-fi) flows and functional flows, but that made it difficult for some people to picture them together.
The solution was to come up with low-fi wireframes and functional flows all in one, which was very much appreciated.
Below is the validated flow.
Wireframes were the final product I had to deliver on this project. UI Design was another project by another team and it is redone for each time the campaign is on.
These are only the main screens, but on InvisionApp you may see the whole set of wireframes. You might also try the screen sequence shown on the prototype (click anywhere to reveal links). The final product is not online at the time of writing this. It will be online in this address during the next campaign.
The Usability testing, intended to test the flow, identified that users rarely remember where can they find their CPE, which allowed to come up with a solution to show where – in the invoice – the user can find it, and demonstrate the advantages of testing prototypes before implementation.