9 December 2022 Elena Toniolo
Journal of Experiences
Example of participatory design to improve people’s online experience, for the Research Center of the Catholic University of the Sacred Heart of Milan
Cetif, the Research Center of the Catholic University of the Sacred Heart of Milan, is an institution that deals with research and training to promote the strategic, technological and organizational evolution of the financial, banking and insurance sectors.
Precisely due to its nature devoted to research and technological innovation, we felt very close to this reality right from the start and, when they entrusted us with the redesign of their digital ecosystem, we could only do it according to our approach, based on listening to people, and therefore on the search for key information to design a digital space according to the needs of tomorrow’s public.
We often say that the skills of the expert, whether we are talking about usability, design or positioning on search engines, are just the starting point for good planning: if we don’t listen to the people who will use the space we are designing, the our work will remain solely an exercise in style.
For this reason, we have proposed to the Cetif team the participatory design of the site, to design, together with the people to whom it is addressed, a quality digital experience, capable of creating real value for those who will use it and, consequently, for Cetif itself.
Participatory design: what it is and which activities we used in the project with Cetif
What we mean when we talk about co-design or participatory design we have described in depth in another article of the journal, dedicated specifically to this theme. In summary, it means listening to the people who will use a space, a product or a service, taking their needs to heart and putting them at the center of the design, even before putting pen to paper to draw any draft of information architecture, layout or prototype.
In the specific case of Cetif, our design flow envisaged various listening and involvement activities:
- objective workshops
- card sorting
- tree test
- co-design workshops
- UX design of the whole site
- experience analysis test
But let’s see them in more detail.
Objectives workshop: how to get on board a project looking all in the same direction
The objectives workshop is an activity that sees our researchers and UX designers sitting at the same table as the reference people of the company we are supporting.
Opening each project with this moment of sharing allows us to align ourselves on how the team sees its company, its values and its medium and long-term objectives, which endogenous or exogenous difficulties may arise during the project and, above all, which needs must meet and what expectations this collaboration will have to meet.
In this specific case, we have fully understood the organizational structure of Cetif and the needs, different and specific by purpose and function, of each company area.
We have identified the focus of each area and understood how to make the different souls of the business coexist within the same platform, aiming to improve people’s browsing experience and make the different contents more accessible and findable according to the different priorities, also thanks to subsequent listening activities.
Card sorting and information architecture: how to organize contents to increase their findability
Card sorting is a participatory design activity that makes it possible to optimize the findability of content and understanding by people, analyzing and understanding users’ mind maps. A purely qualitative research and listening phase: it can also be carried out remotely, but we prefer to organize it face-to-face, using pen and paper and not giving up being able to look each other in the eye.
We wrote the different content and features of the site on different “cards” and asked people to organize and group these cards based on their personal experience. In this case, we used the additive method: each person modified and optimized the organization of the contents of the previous version. This allowed us to arrive, thanks to the involvement of 8 people, at the best possible architecture for the site’s users.
Tree test: the validation of the information architecture and menu labels
The information architecture, i.e. the organizational structure at a logical and semantic level of the contents and functions of the platform, was then tested with a tree test.
The tree test is a research activity that involves analyzing the navigation systems of a site. So in this case we validated the information architecture, and in addition, evaluated the choice of menu labels and understood the solidity of the organization of the different materials on the site. How did we do it? By giving people a series of tasks that involved finding specific content by navigating the site’s structure.
Also for this activity, the direct involvement of people is fundamental for us, possibly in presence, to grasp all the nuances of their experiences during the experience and the performance of the various tasks. This phase is followed by a questionnaire that collects additional information on the search for content, for example the degree of ease/intuitiveness of the task.
Co-design workshop: listen to people to identify the necessary features within the site
The co-design workshop, on the other hand, has the main function of understanding the needs and expectations of users who use the site in order to transform them into functionality. We have dedicated this moment, indeed these moments, to listening to the internal figures of Cetif, the so-called editors, divided by the different areas, in order to respond to the different expectations expressed during the objective workshop phase.
We then mapped the features (gathering requirements) and prioritized them to be able to design wireframes and then interfaces according to this evidence.
This activity therefore becomes the concrete manifestation of that participatory design method that distinguishes us in various fields.
Design of the User Experience of the Cetif site
The real design part, previously of the structure and functionality, and then of the graphic layout of the different navigation flows, was the result of all these listening activities, and of a skilful union between function and aesthetics.
First of all, we created the wireframes based on the collection of functional requirements that took place during the workshops: each navigation flow was validated and optimized along the way together with the teams of the interested Cetif areas.
Once the entire site structure was approved, we then moved on to the design of the graphical interfaces, also in this case comparing ourselves, template after template, with Cetif’s representatives. In this phase it was essential to implement the guidelines of Cetif’s new brand identity for the digital world: we created a UI kit that brought together all the characterizing elements of the platform, starting from the most minimal ones, according to the principles of atomic design, to maintain brand consistency.
The last activity of this design phase was to create a navigable prototype to carry out a usability test by integrating the results even before development, optimizing the effort required for these modifications, which would be decidedly more expensive if it were to take place in a staging environment.
Usability test: how to validate and optimize people’s browsing experience
But we could not fail to listen to people again: otherwise we would have relied only on our experience in the field, which we consider valuable, but not exhaustive, as we said at the beginning.
For this we conducted a usability test, an analysis of the user experience while browsing our site prototype, investigating:
- any objective problems
- degree of satisfaction
- emotional and cognitive impact.
During the test, our moderator indicates to the person the task to be carried out and guides him, listening to him and stimulating him to comment freely on his actions, in what is called “think aloud”. We thus combine observation of actions and collection of comments, also integrating a part of the undeclared, with the help of neuroscience tools, such as eye-tracking, which are oriented towards an objective dimension of information.
Also in this case we collect people’s evidence to optimize the layouts and make our project more and more in line with their expectations.
Together with Cetif people to design a quality digital experience
The project resulting from the activities we have described is online at www.cetif.it but the activities that see us alongside Cetif continue, in name of a collaboration that makes people’s involvement the key to giving an experience of real value.