Avaliação 360

This was a project in which we had to adapt to a reduced deadline. However, since it was an internal project of the company, we were able to achieve some agility in some of the processes.

Later on, we will talk about the requirements. But to make it clear, our goal was to reduce the time required for leaders to apply a 360-degree assessment methodology.

Previously, the assessment was done in separate spreadsheets, requiring the creation of a new spreadsheet for each team member, which ended up being an extremely laborious and costly task. We needed to use our expertise to create a web application that could solve this challenge.

Designer & Developer working together

Synergy and co-creation between Design and Front-end were necessary to provide a great solution for our users. Renan and I went through the whole process together and made several iterations so that the project could be feasible under the available conditions while still providing a good experience for the end user.

We found several solutions together. Even though the area was not completely familiar to us, we helped each other out, whether it was finding ways to manipulate an SVG in Lottie or applying Emotional Design to a button 🙂

Home page

We visually structured the layout to have the focal point on the login fields, and to create a visual impact, we used animations from the Lottie library

Change password

The user could not change their password directly through this application, due to an API limitation. But we knew it was something that would generate doubts if there was no information about it.

We solved the problem by trying to avoid a bad user experience. We kept a "standard" flow, where the user has the "forgot password" functionality, but it would only serve to bring information.

Based on Don Norman's Emotional Design, even if the user does not have a good experience in terms of behavioral level, we can explore other aspects. We disguised this negative experience with good visceral and reflective design (through an animation of a frustrated koala, showing the user that we are disappointed in not offering this solution to them).

Evaluation component

We created the evaluation functionality as a "component" before starting the layout of the entire page.

It is the most important interaction in the project, due to the cognitive load required for the user to evaluate a team member.

In addition, it would be necessary to show an explanation for each type of rating. We focused on a few points:

• Not taking up too much screen space: that's why the explanation was placed in the blank area on the right corner, only visible after the user's interaction;
• Micro-interactions: we reinforced the current system state with micro-interactions;
• Scannability: we created a structure that facilitated Western-style reading, so that the user could easily scan the page.

More about Emotional Design

The first time the user rates any team member with a maximum score, they are surprised with an animation and a unicorn sound feedback. This creates an immediate and positive visceral response, increasing user satisfaction with the experience.

In addition, the interaction also uses the reflective level of emotional design, encouraging the user to reflect on their choices when giving maximum scores to other team members' skills. This helps promote a more critical and fair evaluation, increasing the user's confidence in their ratings.

To avoid the experience becoming repetitive or tiresome, we added an option to pause the sound feedback after the first use, which helps to maintain a pleasant and engaging experience over time.

Easter Eggs, Informal character e Buzz Marketing:

We added some easter eggs to the tool, from secret codes (Konami Code - ⬆️⬆️⬇️⬇️⬅️➡️⬅️➡️🅱️🅰️) to memes from the cultural repertoire of team members.

This was done with two main objectives:

1. To solve technology limitation issues. Some points were beyond our control, and we wanted to solve them in a friendly way (like the case of the password)
2. We wanted to create a buzz within the technology sector, making the tool talked about before use, the famous buzz marketing.

An example of this is that the tool was designed to be used on desktop, and if someone accessed it with a mobile device, they were surprised by a not so common message in an application 😏

The Choice of Technology

The main challenge in front-end development was to put into practice the entire process described in the interface stage. What is the best way to implement an animation? How to implement micro-interactions without losing accessibility points? How to integrate this application with a spreadsheet? All of this was taken into consideration when choosing the technology and its architecture.

The technology chosen for development was React, motivated by the ease in managing the application's state, session persistence (the user could pause the evaluation and resume it later), and the use of animations with the Lottie library, which would be an essential ally for the proposed Emotional Design in the interface design stage.

There was also the challenge of creating a simple and functional architecture that would be integrated with a Google Sheets spreadsheet. Considering the short development time and the lack of specialized back-end labor, we chose to use a JSON file as the database for questions, but they would still be listed dynamically for each employee and their respective position. Functional programming was the key 😀

Conclusion

Collaboration between designers and developers enhances the process and outcome of the project.

The company's Slack was flooded with messages when team members started doing the evaluations. Some laughed, others wanted to know the secret codes, and some even posted screenshots of the tool on their social media. Others also wanted to know how to change their password 😂

To achieve our goal, we needed to find a balance between seriousness and playfulness. For that, we collected feedback from leaders and team members to evaluate the ease of applying the methodology and the reliability of individual evaluations.

Based on this feedback, we were able to achieve an ideal balance that ensured a lighter yet effective approach to managing our team.