Let's connect!

  • LinkedIn - Black Circle
  • Instagram - Black Circle

Copyright 2019 Rachel Pollock. All rights reserved.

Boomtown

a mobile educational tool that introduces middle schoolers to data literacy concepts

fall 2019 · 10 weeks · UI DesIGN / UX Design

how might we improve data literacy?

Many people lack the basic skills to understand and interpret data in our increasingly evidence-based society.  SAS, a global leader in analytics software, came to us asking how we might improve data literacy in education starting as early as middle school.  This project is a work in progress.  We will present our final design proposal at SAS's headquarters in December.

research plan​

So far, we've conducted extensive research to first validate the problem and second, discover opportunity areas within the data literacy sphere.  

  

 

secondary research

research methods

literature review, competitive analysis, heuristic review, content inventory

 

My team split secondary research tasks and organized a comprehensive shared research findings report.  

 

secondary research

literature review

key research questions

  • data literacy

    • what is the current state of data literacy in the United States?

    • how are data literacy concepts currently taught?

    • what does the middle school Common Core curriculum look like (for all subjects, not just statistics)

  • learning

    • what are the different learning styles?  What characteristics define each?

    • how do middle schoolers learn?

  • audience/users

    • what characteristics and demographics define Gen-Z?

    • what pop culture elements resonate with middle schoolers?

  • UX

    • what research exists around creating delightful learning experiences for middle schoolers?

    • what are some best practices and techniques for designing effective data visualizations?

  • gaming

    • what games do middle schoolers like?  Why?

    • what psychological theories / principles could we apply to an educational game?

 

 

key insights

  • data literacy

    • what is the current state of data literacy in the United States?

​​

secondary research

competitive analysis & heuristic review

key research questions

  • existing edutainment tools

    • what makes an edutainment tool engaging and easy to use?

  • existing data visualization tools

    • what makes data visualization tools easy to use and understand?  

  • existing games

    • what makes games engaging? 

 

​​

secondary research

content inventory

key content 

  • distributions

    • what is statistics?

    • what are distributions?

    • how are distributions used in the "real world"?

    • how do distributions apply to subjects that aren't math?

    • what data is available to use to demonstrate the functionality of the tool we create?

 

As I researched, I developed the following concept map about distributions.

 

 

​​

primary research

research methods

learning experience inventory, semi-structured interviews 

primary research

what makes learning a good experience?:

learning experience inventory

We asked each our peers (about 20 total) to tell us about two memorable learning moments- one positive (where they felt good about learning) and one negative (where they felt discouraged about learning).  We then abstracted these distilled these moments into their defining characteristics. 

 

Positive experiences (related to learning) were shaped by the following:

  • working toward and achieving a defined goal

  • personalized, relevant material 

  • routine / clear expectations

  • positive reinforcement

  • good teamwork

  • highlighting successes over failures

 

Negative experiences (related to learning) were shaped by the following: 

  • unclear language

  • demeaning language

  • unhelpful feedback 

  • miscommunication

  • feeling excluded or ignored

  • feeling a lack of agency /. choice

  • attitude being poisoned by a previous negative interaction 

  • not being allowed to express or explain oneself

  • falling behind and having no clear path forward

 

Most people found it easier to recall negative experiences over positive ones.  We considered how a tool could emulate the attributes of positive experiences and prevent and mitigate the negative ones.  

 

primary research

what is it like to be a middle schooler?:

semi-structured interviews with middle school students

To really get into the heads of our tool's users, we interviewed middle school students.  We asked them about their personal experience with learning, their personal goals and dreams for the future, and their favorite devices and tools to use in and out of the classroom.  We aggregated our interviews with those of our classmates to identify patterns among them.  

primary research

what is it like to educate middle schoolers?:

semi-structured interview with middle school teachers

goals

 

We interviewed two middle school teachers: a 30-year veteran 8th grade math teacher and a 7th grade math and science teacher with 3 years experience. The teachers work at Centennial Middle School, a Title 1 school in Raleigh North Carolina (see photo below). We sought to uncover the social behaviors, motives, and learning challenges that they observe among their students. 

 

 

key insights

 

  • middle schoolers are pretty self-absorbed and prideful

    • this leads them to be very competitive with one another

    • they are mostly extrinsically motivated

  • they want to know "why"

  • their attention span is about 3 sentences

  • they love pop culture, memes, and humor

  • they enjoy interactivity and tactility

  • they respond well to narrative

research synthesis

affinity clustering & concept mapping

Synthesizing our literature review and interviews, I created an affinity diagram of adolescent characteristics, behaviors, and motivations.​  ​

research synthesis

persona generation

Our research informed the development of Jordan, our target persona.  We validated this persona with experts (middle school teachers).  

research synthesis

as-is journey map

identifying design opportunities & goals

My team chose to focus on the following design goals:

  • narrative-driven experience

    • contextualize distributions and data with a narrative-based experience

  • user agency

    • give students agency over their own learning and an opportunity to be in control

    • show them that data intepretation is not just about "right" and "wrong"

  • user empowerment

    • empower students to interpret real data  in various contexts

 

challenges

device affordance considerations

Based on our research and our persona's needs, we elected to prototype our learning tool on a mobile phone (for iOS).  We considered a mobile phone's affordances (gestural touch interface, location services, accelerometer, haptics etc) and how we could incorporate them into our game.  Perhaps users could move their phone in a 360-degree circle to explore.  Perhaps haptic feedback and sound effects could reinforce learning.  

 

 

challenges

finding an appropriate data set

Once we'd decided to move forward with the city game, we searched for data from which we could build it.  Real-world data is never perfect like the data that's often used in textbooks.   Therefore, It was challenging to find a data set that was both interesting and appropriate for our audience.  

 

The following data set about whether or not people bike and/or walk (and if not, why) in Raleigh, NC fit the challenge.

 

site mapping

We created the following site map to define our tool's information architecture and navigation

 

 

user task flow

We then created a detailed user flow from which we would begin
building wireframes.

 

 

prototyping

hi-fi wireframes

Our first attempt was a little rough, but that's why we iterate!

 

We liked the color scheme we'd developed but, when we applied it to our wireframes, they felt too clinical and textbook-ish.  Generally, the wireframes lacked personality and the friendliness we knew we wanted to portray.  They also lacked clear hierarchy and any indication of progress.  

​​

iteration

Several new color schemes, content revisions, and layout iterations later and we had a clear, concise, friendly interface which we truly believed would satisfy our design goals.

 

Here's a few examples of the evolution our wireframes underwent:

​​

usability testing

protocol

test objectives

test navigation & information architecture

test participant interest in the gameplay & visuals

 

test subject

a clickable prototype made with Invision

​​

test methodology

ask each student to think aloud as they navigate a Learn Module and complete a Build Challenge

​​

participants

8 students at Centennial Middle School in Raleigh, North Carolina met with our team individually

 

test goals

Users should be able to complete one Learn Module and one Build Challenge.  They should be able to earn the bike path.

 

view the flow we tested below:

"it makes you seem like you have power over your entire town!"

usability testing

synthesis & reflection

I synthesized our results using the "rose, thorn, bud" format.

 

pain points (thorns)

  • Most of the navigational confusion occurred because the prototype was made with Invision's limited animation functionality.

  • Students brought their own preconceived biases to the game.  Sometimes, they let these biases drive their reasoning rather than their interpretation of the data.  We had to make it clear that the data should be informing their decisions.

  • 7 out of the 8 students answered the second Build question incorrectly.  This question required a level of understanding and interpretation that students do not have at this stage in their education.  We swapped this question out for an easier one.

 

things we should keep doing (roses)

Generally, the students responded positively to the game.  

  • They liked the color scheme (regardless of gender identity)

  • Progressive disclosure of information kept the students focused.

 

things we should build on (buds)

  • The students requested more interactive elements​

​​

introducing

usability testing

notable quotes from participants

"it makes you seem like you have power over your entire town"

- Skylar, 8th grader

 

"The colors are nice.  I like it"

- Madelyn, 8th grader

 

"I wish I could touch it more"

- Jeff, 8th grader

 

"the majority is pretty straightforward- read the thing, click the button.  The first question goes straight to the graph and doesn't build a story"

- Quinton, 8th grader referencing the gameplay

 

"is this true?"

"Oh no! Could that actually happen?  I'm scared" 

- Mary, 8th grader referencing the Build Challenge introduction

 

onboarding flow

The onboarding flow introduces the user to the game's goals and functionality.  Then, it asks them to customize their city's name and color scheme.  Though seemingly minor, these customization features provide the player with a sense of ownership from the beginning.

home

The player's fictitious city functions as the app's home page.  The player's location dictates its appearance and current weather state.

learn modules

Learn modules leverage real city data sets to teach players the foundational skills they need to solve problems that occur in their city.  Progressive disclosure of information ensures the player remains engaged and focused.

build challenges

One of our design goals was to make the user feel a sense of agency.  Build Challenges provide this by prompting the player to analyze real data to solve a problem in their city.  This flow, for example, prompts the player to analyze a real survey data set to determine whether they should build more bike lanes or add more lights to encourage their citizens to bike more often.  Their choices have a direct impact on the happiness of their citizens.  

 

Data interpretation is not a black-and-white thing.  We learned from our usability tests, however, that students are conditioned to think there is a "right" and a "wrong" answer to every problem.  Questions that required a lot of interpretation went over their heads.  In this question, adding lights over bike lanes will still get more people to bike, just not as many.  Foundational questions like this teach the basic reasoning required to interpret data.  As the player progresses and begins to understand data as a tool for interpretation, they begin to make more multi-dimensional decisions

achievements

Successfully completing Build Challenges earns the player something new for their city (in this case, a bike lane).  The game's "happiness feed" lets players see comments from their citizens.  It allows players to see that the choices they're making bear a direct impact they're having on their citizens' lives.  

location-based challenges

One of the pieces of feedback we received was that we should allow players to upload their own data from their own city and experiment with it.  We liked the idea but it didn't seem to fit within the game itself.  We instead met this feedback with location-based challenges, which prompt players to analyze real data from their current location (or a location nearby if the player lives in a smaller town) to earn a special location-specific feature for their city.  In this example, the player earns Raleigh, North Carolina's  Large Acorn sculpture.  

research synthesis

to-be journey map

UI motion design animation

We created a clickable prototype in Principle which we would present to the team at SAS.  Unfortunately this work is protected under NDA.  

presenting our work at SAS

My team had the opportunity to present our work at SAS's headquarters in Raleigh, NC.  People from across the SAS campus attended and live-streamed the presentation.  

reflection

Ultimately, I'm really proud of my team and what we were able to accomplish in such a short period of time.

acknowledgements

This project was a collaboration between myself and two of my talented classmates and friends: Cole Ferguson and Anna Schecterson.

 

Many thanks to the team at SAS for providing this opportunity and for being such a great partner.  

check back soon to see our progress!