I was assigned with redesigning Competenz E Services portal. The E Services portal provided a way for account managers, assessors, employees and companies to easily access learner, assessor and unit standard information aswell as prioritise their search and organise their data. I was responsible for design and UX/UI from start to finish. Below is the strategy and development I went through for the project.
Know your users
The project began with stakeholder interviews, I spoke with the key people needed to fully understand the product. This also gave me an insight to the users of the current tool and some information on the primary use cases. it was important I also understood the Competenz Brand values, businees needs and user needs.
I had the team walk me through the exisitng E Services portal. Highlighting the strengths and weaknesses. This identified why it needed a redesign and what was currently not working.
Now I had a good understanding of who my users were, I went through some simple task analysis with the main user groups. Here you can see an example.
From the task analysis I could then define my red routes. Red routes are the most important user tasks. I used a sheet to break down my users actions even more so.
The user journey technique was used to see what screens a user goes through to reach their desired outcome. It helps define what can be automated and gives a great overview of how easy or difficult something is.
I used Balsamiq Mock Ups to create fast templates of how the new E Services may work. This allowed me to get something infront of test users before any programming is needed. It also allowed me the flexabillity to test the user flow and check it all made sense.
Now I had to work through the technical opportunites and restrictions. Our users were a mixture of people in the field and at their offices etc. So we needed to make sure the E Services portal could work across multiple devices. This ment making a custom version for mobile phones that was slightly more streamlined. We made the portal design responsive and able to work on computers, tablets and phones.
Once the screens were ready I used Invison to mock up working prototypes in the mobile and computer views. Invision is a great tool for collaboration between users/testers, myself and developers as you can comment and leave notes on any part of the working prototype aswell as do live screen shares.
Build & Iterations
Once the protoype is confirmed, then development begins. I worked closely with the dev team using an agile design process until all bugs were fixed.