David Maish

Dr. Anne Streeter | Research Methods Professor David Meyers | User Experience Prototyping

David Maish | M.A. Interaction Design

50 STATES STUDY GUIDE INTERFACE DESIGN

TABLE OF CONTENTS

4 6 8 10 12 14 22 28 38 40

Executive Summary Concept Brief Solution Hypothesis Project Overview Research Exploration Solution Design Research Outcomes Conclusion

Lindsey Wilson College | 50 States Study Guide

2

3

50 States Study Guide | Lindsey Wilson College

4

EXECUTIVE SUMMARY

The use of mobile apps for learning and involving students has become increasingly more popular.

I am inviting a new generation of students to learn geography in their media of choice. “50 States Study Guide” engages the student using a geography study guide that is delivered on a mobilefirst app. Research was conducted in the form of usability testing, competitive analysis and SWOT analysis. Paper prototyping uncovered problematic areas, which called for simplifying my design.

My app focuses on learning the US states, capitals and abbreviations. Through an iterative development process, I have developed a simple and intuitive design that creates a “fun to learn” user experience.

Lindsey Wilson College | 50 States Study Guide

4

5

50 States Study Guide | Lindsey Wilson College

6

CONCEPT BRIEF

My primary research goal was to find out whether my 50 States Study Guide would be useful to my market delivered on a mobile-first platform. Today, many students have a mobile device or have access to one. In essence, I am developing a geography lesson and presenting it in a user experience that is fun and readily available on a mobile platform. I also want to make it appealing enough to be used as a learning tool for a broad range of age.

Lindsey Wilson College | 50 States Study Guide

6

7

50 States Study Guide | Lindsey Wilson College

8

SOLUTION

50 States Study Guide offers a solution for learning the 50 U.S. states, capitals and abbreviations delivered on a mobile-first app. This allows students to study geography using their media of choice. A smart phone, iPad or tablet.

Lindsey Wilson College | 50 States Study Guide

8

9

50 States Study Guide | Lindsey Wilson College

10

HYPOTHESIS

The creation of a mobile-first app that will serve as a geography lesson for learning the 50 U.S. states, capitals and abbreviations.

Lindsey Wilson College | 50 States Study Guide

10

11

50 States Study Guide | Lindsey Wilson College

12

PROJECT OVERVIEW

My primary research goal was to find out whether my 50 States Study Guide would be useful to my market delivered on a mobile-first platform. This was achieved by implementing an iterative design process that included personas, competitive analysis, SWOT analysis, concept sketches, wireframe development, usability testing and paper prototyping.

Lindsey Wilson College | 50 States Study Guide

12

13

50 States Study Guide | Lindsey Wilson College

14

RESEARCH

PERSONAS

Personas were developed to characterize or represent my users. This would give me a better idea of the kind of user I would target for my market. Knowing the user characteristics for my product helped me focus on a user-centered design. The following personas represent the two target audiences: children and teachers. My student persona had access to an iPad at school or at home.

Lindsey Wilson College | 50 States Study Guide

14

15

50 States Study Guide | Lindsey Wilson College

Lindsey Wilson College | 50 States Study Guide

16

17

50 States Study Guide | Lindsey Wilson College

COMPETITIVE ANALYSIS OVERVIEW

I am developing an app that will function as a study guide for learning the U.S. 50 states, capitals and abbreviations. I have conducted qualitative research in an effort to gain knowledge about competitors in this market. Online research in the form of product reviews and analysis as well as interviews were used to provide insight into problems, help develop UX design ideas and expose competitor strengths, weaknesses and opportunities.

What is the best way to engage a new generation of students to learn geography? Many students find studying geography in the way of memorizing states and capitals difficult and boring. My plan is to involve the student using a geography study guide that is delivered on a mobile-first app, thus crating a “fun to learn� user experience.

Currently there are geography applications on the market that target learning the U.S. 50 states, capitals and abbreviations, but most of the applications I found either on the iTunes App Store or website based games were poorly designed or had distracting advertising. My competitive Analysis focuses on educational apps offered by the iTunes App Sore. This is first tier competition as opposed to website based learning games.

Lindsey Wilson College | 50 States Study Guide

18

19

50 States Study Guide | Lindsey Wilson College

CONCLUSION My user research suggests that I keep the design of my geography app focused on learning the 50 state names, capitals and abbreviations. The user interface has to be simple and intuitive to keep the user engaged in the learning process. If I can keep the design of my app simple and focused, I believe it will be successful.

Lindsey Wilson College | 50 States Study Guide

20

SWOT ANALYSIS SWOT Analysis was conducted to determine product strengths, weaknesses, opportunities and threats.

21

50 States Study Guide | Lindsey Wilson College

22

EXPLORATION

CONCEPT BRIEF

I am proposing a geography study guide app that will be delivered on a mobile-first platform. The app will be used for learning the U.S. 50 states, capitals and abbreviations.

Lindsey Wilson College | 50 States Study Guide

22

SITE MAP

23

50 States Study Guide | Lindsey Wilson College

CONCEPT IDEATION SKETCH

My concept sketch shows the first iteration of the geography app. This iteration consisted of states that would flip over to reveal state names or capitals.

Lindsey Wilson College | 50 States Study Guide

24

25

50 States Study Guide | Lindsey Wilson College

26

BRANDING

LOGO

While exploring branding for my app I combined the outline of the United States into the number 50 to create a clean logo design.

Lindsey Wilson College | 50 States Study Guide

26

27

50 States Study Guide | Lindsey Wilson College

28

SOLUTION DESIGN

LOW-FIDELITY WIREFRAMES

Low-fidelity wireframes were developed as a result of competitive analysis research. This iteration uncovered problematic areas in the navigation.

Lindsey Wilson College | 50 States Study Guide

28

29

50 States Study Guide | Lindsey Wilson College

30 HIGH-FIDELITY WIREFRAMES

High-fidelity wireframes were developed in this iteration. Navigational problems were corrected and a color scheme was developed.

Lindsey Wilson College | 50 States Study Guide

30

31

50 States Study Guide | Lindsey Wilson College

Lindsey Wilson College | 50 States Study Guide

32

33

50 States Study Guide | Lindsey Wilson College

34

USABILITY TESTING

PROCESS

In conducting my usability test, my goal was to determine if my user interface was understandable and easy to navigate. Middle school and high school students, as well as teachers were tested individually in a controlled, quiet, setting in my office. Performing this test uncovered problematic areas in my apps navigation.

Lindsey Wilson College | 50 States Study Guide

34

RECRUITING CRITERIA Study participants were selected based on the following: • Male and female • Children/Students starting at approximately 11 years of age • Middle School Students (6th, 7th and 8th grades) and High School Students • Teachers or School professionals • Have access to a smart phone or tablet • Are familiar working with apps on a mobile device

FEATURES TESTED The following features were tested by the participants: • Navigation • Ease of use • How long it takes to complete the tasks

PARTICIPANT PROFILES Study participants were the following: • Sarah B. - 24 year old - Elementary School Teacher • Sherri H. - 44 year old - Occupational Therapist • Gracie M. - 7th Grade Middle School Student • Jackson H. - 10th Grade High School Student • Kaylin M. - 7th Grade Middle School Student • Shelby S. - 7th Grade Middle School Student

35

50 States Study Guide | Lindsey Wilson College

WRITTEN SCRIPT The following script was read to each of the study participants prior to starting the test: Hi, _______________, my name is David, and I’m going to be walking you through this session today.

Before we begin, I have some information I’d like to read to you. I’m going to read it out loud just to make sure I cover everything.

Today we are going to test a mobile geography app that I am working on to see if people understand how to use it and navigate through it.

In this phase of my project, we will be using paper prototype screens. As you go through the tasks I have prepared, you will navigate by touching each paper prototype screen and I will give you the next appropriate screen.

As you go through these steps, please think out loud. I want to know what you are thinking as you navigate through the app, so please be honest. This will help me in the design of my product.

Thank you for participating in my project!

Do you have any questions before we start?

TASKS The participants were asked to take the following actions: At home screen, click “States” • Click “Hint #1” • Click “States” • Click on “Hint #2” • Click “States” • Click Hint #3” • Click “States” • Click “Answer” • Click to go “home” screen

Lindsey Wilson College | 50 States Study Guide

36

TASK PERFORMANCE SUMMARY The following chart summarizes study findings, where: 1 - Fail 2 - Succeed slowly (minimum time - 20 seconds) 3 - Succeed quickly (optimal time - 10 seconds)

Sarah Navigation 2 Ease of use 3 Time 3

Sherri 2 3 3

Gracie 3 3 3

Jackson 3 3 3

Kaylin 3 3 3

Shelby 2 3 3

Avg. 2.5 3 3

User Testing conducted using Low-Fidelity wireframes for the 50 States Study Guide.

37

50 States Study Guide | Lindsey Wilson College

38

RESEARCH OUTCOMES

RECOMMENDATIONS

By watching the users cycle through the screens of the app, I uncovered problematic areas, which were mainly in the “hints section” of the user interface. Based on the findings from the navigation tasks, two buttons will be added on the “hints” section: one button that says ”show answer” and another button that says “next state”. This will allow the user to go directly to the answer without having to swipe through all three hints. It will also allow the user to skip to the next state at any time.

Lindsey Wilson College | 50 States Study Guide

38

39

50 States Study Guide | Lindsey Wilson College

40

CONCLUSION

CONCLUSION

Through this iterative development process, and the implementation of user testing recommendations, I believe my app will create a more useful user experience and learning environment on a mobile device. Future research might involve a focus group or the use of surveying teachers’ needs and the use of mobile applications in the classroom, as well as the possibility of mobile app design integrated into classroom whiteboards.

Lindsey Wilson College | 50 States Study Guide

40

41

50 States Study Guide | Lindsey Wilson College