Newsela Interactive Maps

A successful study of an idea to assess the value of specific features aimed at supporting teachers in their classrooms.

Role: Design Director and Designer

Impact

User testing involving 7 participants yielded ratings above 4 out of 5 for value (or satisfaction), and likelihood of use in 3 out of 4 prototypes, indicating a successful study.

Background

In the fall of 2022, driven by the desire to learn rapidly and explore potential product innovation or improvement opportunities, I collaborated with Ico Romero, then the Senior Editorial Production Lead of the Interactive Media team at Newsela. Together, we aimed to assess the value of interactive maps and specific features for teachers. We developed 2 interactive map prototypes and 2 types of interactive assessment prototypes, each offering distinct interactions, resulting in 4 prototypes.

Goal

Understand the value of 4 different interactive map features by learning how these features solved classroom problems, and determine what would be most useful in supporting teachers’ Social Studies instruction and assessment.

We utilized the content and map from an existing licensed piece created for printing, preserving its 3D aspect.

Design decisions

We utilized the content and map from an existing licensed piece designed for printing, preserving its 3D aspect. We added micro animations to most interactive elements, such as the location pins. In developing the assessment prototypes, we prioritized clear instructions and prominent interactive elements, drawing inspiration from design patterns and cues found in other interactive pieces and games. We also integrated Newsela branding elements, such as location pins and buttons. The style of these interactive elements follows the design found in other areas of the product.

Prototype 1

At the bottom, there's a timeline with different timeframes that serve as controls for the map. This feature enables students to focus on each timeframe individually.

Prototype 2

This prototype emphasizes the control panel at the bottom. In contrast to the previous version, it incorporates a multi-select feature, enabling users to view one or more timeframes simultaneously, providing greater flexibility. Additionally, we introduced complimentary content from Newsela.

Prototype 3

This prototype is designed for teachers to assess students' learning. In this case, we are using a hotspot feature, allowing users to select the correct option that answers the question located at the bottom of the map.

Prototype 4

This prototype is designed for teachers to assess students' learning. In this case, we are using a hotspot feature, allowing users to select the correct option that answers the question located at the bottom of the map.

Core team

Product Manager
Ico Romero

UX Research
Christian Haarhaus

UX Writing
Lisette Walberer

Director of UX Research
Malena Svarch

Product Design
Carlos Jara

Previous
Previous

Newsela's Video and Reading Experience

Next
Next

Weight Watchers Website Redesign