¡La recta final! Team Clemente Nears the Finish Line

“La recta final” means “the home stretch” in Spanish.

Kyra Low
Team Clemente — CMU MHCI 2021
6 min readJul 25, 2021

--

Since our last post, our team has made considerable progress building our prototype to showcase our designs at the end of summer. We’ve scaled back our technical ambitions, to push a live site, to prioritize the completeness and robustness of our design itself — the most crucial part! Our prototype, now delivered through development-ready Figma files and the Unity Engine, has been tested this past week and iterated upon extensively. Let’s talk about how we’ve accomplished that, and what we’ve changed.

With just a few weeks left in the semester, it was important for us to put our prototype in front of the users once again and get their feedback for final iterations. While our target audience were young adults aged 18–30, we pushed to recruit particularly those from the Hispanic or Latino community. It has been a struggle, however, for us to connect with individuals from this community so we opted to use a third-party user recruiting platform. It was important for us to ensure that Roberto Clemente was being represented in a respectful and culturally appropriate manner and ensure the experience celebrated Clemente’s origins and story. We were able to strike gold using this third-party platform.

Given that this is our last chance to test with users, we aimed to test for three main things- (1) the overall user flow, (2) the usability of the experience and (3) whether the user was able to engage and connect with the curated Clemente’s stories. During the testing, users were asked to think out loud and freely move around the prototype as if they were alone and explore it on their web browser at home. We observed their initial reactions, marking important moments such as delight and confusion, and also asked direct follow-up questions to measure their overall engagement and enhanced user experience.

After testing with eight users, we can proudly say that people left our experience feeling like they understood Roberto Clemente as more than a baseball player. Some of the most refreshing comments we received were about how users from across Latin America felt that they could resonate with his story, even imagining themselves as future all-stars. Another point of validation came from the question “How would you rate this experience from 0–10, 10 being extremely enjoyable?” The feedback we received was consistently positive.

Testing with users also pointed out several UI usability improvements that we are in the process of correcting. For example, adding back buttons and changing icons to be more intuitive for users. Almost every user complimented our visual design style, often stating that it provided a good mix of text and images without being overwhelming. The feedback and recommendations we received from the users helped us further refine the fidelity of our prototype for the final push.

With feedback from our users, we spent the last week (and are still!) refining our interactive timeline. We added a collaged timeline page at the beginning of the experience which allows users to view events in Clemente’s life at a glance, all while keeping the aesthetic similar to that of the individual collage pages. As they hover over individual images in the collaged timeline, the year and label of the event appears. Users can click on the images and will be brought directly to the collage page of that event. This offers another form of navigation besides just the horizontal scroll.

On individual collage pages, instead of including the entire timeline at the top, we replaced it with a simplified timeline, which includes just three events — the event the collage page features, the event before and the event after.

This simplified timeline aims to orient the user to where they are in the experience without cluttering up the collage. With the home icon on the top left of each collage page, users can navigate back to the main collaged timeline anytime.

In spring, we found that providing people with time and space to reflect on what they saw enhanced their overall experience. As such, our experience also includes a social page, where users are prompted to leave personal stories revolving around the four themes that are core to Clemente’s story — family, sports, community and culture.

The experience ends with a call to action page. The Clemente Museum can utilize this interactive experience to draw attention to anything they want and/or need!

A key immersive scene our team has designed places users in Clemente’s Pittsburgh apartment, where he lived during the MLB season with Vera and his three young sons. After a brief introduction to Clemente’s family life, presented through warm photos hung on the apartment wall, the camera transitions into an open space where users are given 360 degree control to pan the camera and view a virtual environment re-constructed from real photos of Clemente’s family.

The photos themselves are overlays in the environment, combining a 2D and 3D perspective that contextualizes the virtual space with a historical and personal sentiment. Major usability improvements upon previous iterations, inspired by our user tests, include affordances to highlight all interactive elements in this space, as well as the control scheme.

Within this space are 3D models of real artifacts currently at The Clemente Museum, virtualized to live in a virtual environment similar to that of the past. Users can click to view artifacts such as the Vera Vase, leading to the artifact detail page below.

Within this artifact detail page, users can view and manipulate the 3D model, zooming in to see every fine detail. Curated annotations and supplementary text offer insight into the rich stories that lie beyond these artifacts, such as Clemente’s passion for artistry as a reprieve from the insomnia he suffered.

Another of the immersive scenes our team has been designing highlights Clemente’s most famous athletic achievement: reaching 3,000 total career hits. By reconstructing the environment and sounds of this historic achievement, our team is attempting to give users a sense of what it’s like to be in Clemente’s shoes.

The main interactive feature of this scene is a simple mini-game: playing as Clemente, users will need to attempt to hit the ball and recreate the moment of his 3000th hit. Though daunting at first, the mini-game has very simple controls and an option to skip the game if they would rather focus on the story.

The feedback from both user interviews and our clients at the Clemente Museum have been largely positive — many users mention our immersive scenes as special highlights of the experience. From the feedback we have gathered, we plan to further refine this interactive scene by refining the fidelity of the environment, adding in sounds and audio, and adjusting the difficulty so anyone will be able to relive one of Clemente’s greatest achievements.

Through the next few days, we’ll be making final design changes and shifting our focus to final deliverables! It really has been a journey full of ups and downs to get to where we are today. This might be the first time that our team has been able to sit down and appreciate how far we’ve come, not only in terms of our web experience but also as a group of friends working together. We’re excited to be able to share what we found with our clients as well as our cohort and the new friends that are coming into the program. Look out for our summer presentation. We think it’s going to be a major hit!

--

--