brightest

DTW

UX design, UI, frontend
Brightest is an easier and approachable solution for people in the IT industry to measure and confirm their industry-based knowledge by taking certified exams all around the world and choosing between several languages.

This way they can get more certifications without being frustrated due to language barriers or lack of locations.
Target
  • Students: IT professionals in the 30 - 50 age range who want to certificate their knowledge to promote or change their job.
  • Partners: Sales managers in one of our trainer providers or one of the examiner boards in the 25 - 60 age range who want to introduce their offers into our system.
  • Admins: brightest workers who want to check and approve the data added by the partners to assure that the tool is reliable and works properly.
Challenge
Two of the main requirements were clarity and simplicity. We had to find the easiest way to satisfy the different needs of the diverse targets and unify them. Adaptability was also crucial because different partners will introduce a lot of different information that will be shown automatically.
“It is impossible to promote in my company without an official certification of my knowledge but there are no exam locations close to my town.”
My Role & Responsibilities
The team was formed by a PO, two developers, a visual designer, and I who worked as a UX designer.
  • UX analysis (problem statement, personas, customer journey maps).
  • Interaction design (flows, sitemaps).
  • Prototyping & testing (Lo-fi, Mid-fi, Hi-fi prototypes, and user tests).
  • UI design.
  • Frontend (HTML + CSS3) with bootstrap and Django.
  • Design system.

Process & Result

The Process
Due to the fact that a stakeholder had worked in the customer service of one of the main competitors, he already had a wide vision of the clients’ challenges and needs as well as strengths and pain points of the competitors. He brought a big amount of qualitative and quantitative data, which saved us a lot of time researching. We worked together organizing all the information he had. We did empathy maps and we redefined the problem statement together.

I wrote the user stories, developed five primary personas and their customer journey maps which helped me designing the main tasks and users flows. In order to improve our productivity and facilitate the communication with the stakeholders, together with the developing team, we decided to split the big product in 4 different but related ones depending on the persona who was going to use it (admin, training provider, examination board and student). Therefore, I created 4 sitemaps and prototypes. The devs and I worked hand by hand on the different iterations, trying to strike a balance between optimal user experience and feasibility of development according to timing.
Some of the low fidelity wireframes of the webpage.
Some of the low fidelity wireframes of the webapp, logged as admin.
Usability tests
For obvious time reasons, I could not do all the tests I would have liked to do nor count with real users. However, I moderated in-person usability tests of the main functionalities' flows with colleagues who were familiar with the competition but not with our project. I also coordinated unmoderated usability tests of the "admin" part with the stakeholders who would be in charge of managing it in the future.

These gave us refreshing inputs to improve the prototypes, that we had not seen due to being focused on the project at such an accelerated pace. We realized that we had left aside the crosswalk when adding new objects, which was basic in a tool with so much interconnected data.
Training Provider Partner – Add a new training wireflow.
Some of the high fidelity wireframes.

Achievements

I developed prototypes with different levels of fidelity. I tested and improved them through several iterations. As the timing was tight, I didn't download all the screens but I developed the frontend code instead, specially the CSS3. After 4 months, we launched the website and two weeks later the web app with four different permissions that fits the needs of the different profiles of users. I compiled the design guides and elements on a design system for the future development of the project.

Take Away

Challenge
The main challenge was to find a solution that worked for four different personas with totally different, even opposite, goals and that had to be adaptable in order to keep growing. All of this with a very tight deadline. We figured out how to find the perfect balance that allowed us to meet the deadline without neglecting the design and user experience.
What went well
The fact that our stakeholder worked for the competence before, saved a lot of time with the research and the connections. We already had a big database of users: Board members, training providers and final clients. It also made the stakeholders feel even more involved in the process which made it easier for us to get their approval for some of the decisions.
What I would do differently
We went out with a too complex product for the first version. I would have divided the launching in three phases, one for the board members and admins, another one for the training providers and the last one with the final clients. So we would have gone with a simpler MVP for the first one and I would also have added more time to the testing phase. This way we could have validated it with real users.