UX/UI design of a new classroom assessment platform

Optimising the usability and updating the aesthetics of two existing mobile applications.

thumbnail

For some time now, new assessment methodologies have emerged in Spanish education, among them the competency-based assessment by scales, which has been promoted by the current education law LOMLOE.

PROBLEM

The aim was to develop the first digital solution that would enable teachers to assess their students’ competences in accordance with current educational standards. This assessment model was to consist of two levels: 

  1. On the one hand, an attempt is made to achieve a competency-based assessment characteristic of a course. 
  2. On the other hand, the impact of this assessment on the level of acquisition of key competences is analysed. In addition, it is expected that students will have experienced upon completion of their training pathway.

In this way, the aim was to solve one of the major educational problems: to recognise and assess the competences acquired by students.

CHALLENGE

The initial challenge posed by our client was to develop, in record time, the UX/UI design of Perflick, this new digital notebook, working in alignment with the client’s implementation teams to achieve a suitable Go-To-Market.

This process ranged from the conception of the information architecture to the delivery of an interactive prototype, all with the aim of improving team coordination and speeding up the implementation for our development team.

OBJECTIVES

At Thinkers, we approached this design challenge with clear goals:

  1. Define the information architecture: We immersed ourselves in creating a structure that would optimise the usability and accessibility of the digital notebook.
  2. Design the user interface: Taking into account two crucial requirements: the adaptation of our client’s existing digital notebook to the new interface and the alignment with the visual design system already defined by the client.
  3. Develop a navigable prototype that serves as a common thread to present, discuss and iterate with the rest of the organisation: The culmination of our effort translates into a dynamic prototype that can be presented with impact to all stakeholders involved in the project and also serve as a guide for implementation by the development team.

METHODOLOGY

As a starting point for this project, we held a kick-off meeting, which allowed us to thoroughly understand the business needs linked to the “Competency-based assessment” methodology and to resolve all our doubts about it. This session also allowed us to understand the product architecture that our client proposed as a solution, which we had to use as a starting point. 

The next challenge was to design, in record time, the look and feel of this digital notebook. To do this, we worked on analysing other solutions on the market, carrying out an exhaustive benchmarking analysis of the competition to gather inspiration, good practices and ideas from the competition, both direct and indirect, on platforms similar to the one we were about to design. As can be seen in the attached image, the process of gathering information and evaluating the solutions was necessary to see what evaluation standards were being applied and what options we had to start with in the design process.

Partial view of the competition analysis carried out for the new digital notebook. Partial view of the competition analysis carried out for the new digital notebook.

This study of the competition served as a basis for us to work on a first version of wireframes of the main screens of the platform (horizontal prototyping), and to start drawing the layout of the elements on the screen, the information and the different functionalities.

Of course, the iterative design work process could not avoid feedback and design critique work sessions with stakeholders (business, product and technology) to ensure functionality and make joint prioritisation decisions on the new design.

The active participation of the stakeholders and the development team was essential as it allowed us to anticipate friction points and complications, ensuring the implementation within the agreed deadlines.

With the wireframes validated, we proceeded to create the interactive prototype in high fidelity, using the design system provided by our client. 

Implementing and becoming familiar with a client’s own design system is always a challenge. However, choosing to use the client’s own design system gave us the advantage of ensuring visual consistency between all user interfaces. In addition, this choice contributed significantly to improved productivity. Although it was necessary to create unique components, leveraging an existing design system greatly facilitated scalability by introducing new elements essential to the platform.

Visual fragment of the design system provided by the client, used in the creation of this platform. Visual fragment of the design system provided by the client, used in the creation of this platform.

Again, feedback sessions with the client team allowed us to refine the final solution until we had a team to validate the prototype, some modifications were made until we finally got this final result:

Video demonstration of the functionality of the developed evaluation platform (digital notebook). Video demonstration of the functionality of the developed evaluation platform (digital notebook).

Every element integrated into the platform has been designed to facilitate teacher navigation, ensuring accessibility and practicality throughout the student assessment process, which can involve several steps.

The visual design has also been meticulously revised, incorporating illustrations and rounded edges to provide originality, a more persuasive visual language, differentiation and more clarity in the message AND always seeking alignment with the needs of our target audience: the teaching teams.

CONCLUSIONS

In conclusion, we can say that the project for the creation of this digital notebook for the assessment of students’ competence development has been a success, both for the result achieved and its alignment with the business objectives, as well as the coordination with the client’s different teams to ensure a launch within the established deadlines and in accordance with the client’s quality standards…

Through the close relationship with stakeholders and the development team, we have managed to develop in record time all the key processes identified in an evaluation tool that stands out for its accessibility, usability and consistency with the previous design system developed by our client. 

Although the platform is currently in the testing phase, we at Thinkers are excited about its transformative potential in the classroom and look forward to its launch! If you are also working on a project where you think we can be of help, don’t hesitate to contact us  We’re here to help!

Otros Blogs