DENVER NORTH HIGH SCHOOL

Enhancing Student Organization: Denver North High School’s Responsive Mobile App

 

Platform: Responsive Mobile Application

Tools: Sketch | pen and paper

Scope: 3 weeks

My Role :

  • Competitive analysis

  • User interviews

  • Personas

  • User testing

  • Problem & solution statement

  • Site app map

  • User flows

  • Website dashboard

P5mockup3.jpg
 
 

Denver North High School

Denver North High School, North High for abbreviation, is located in the Denver School District in Colorado and consists of a diverse and multicultural student body of 1050 students. Geared toward college preparation, the high school offers 17 sports teams, 21 clubs, and many additional extracurricular activities. The school’s administration team is constantly looking for new ways to keep the students engaged throughout their high school career and to be fully prepared for their life and education after graduation.

 
 

The Challenge

My team and I were approached by the administration team at North High to design a mobile app for the entire student body. It was proposed that a mobile app would help the students engaged with the school, their education, and to make the most of their high school experience. We had three weeks to complete all phases of the UX design process and submit the final high fidelity prototype to the stake holders.

The current website and recommended mobile apps for North High are confusing and spread information across several platforms. This method generally causes students to miss important information and creates general confusion for accessing the information they need, and an overall lack of centralized form of communication. The current UI of the platforms excludes the ability for North High from modifying their current app, as it is designed for the entire Denver School District. The opportunity in this project was to create a responsive mobile application for the students of North High that specially meets the needs of this unique and diverse student body.

 
 

Students of North High

Denver-Scholarhsip-Foundation_-Future-Center-Photo-1024x683 (1).jpg
 
 

Research

Curious about the experience and expectations of current North High students, we entered the discovery phase. We conducted a field study, interviews and a survey with current students to see what their academic priorities are and what they need to help them stay on task.

 
 

In synthesizing the data in an affinity map, we found six main pain points for the students in being able to stay up to date with their academic life:

  1. Trouble accessing their homework

  2. Communication with after school clubs, activities, and sports teams is confusing

  3. Notifications and reminders are missed

  4. Difficulty accessing personal schedule and bell schedule

  5. Announcements are getting lost

  6. Poor communication with teachers 

Screen Shot 2019-03-13 at 1.13.53 PM.png

Survey Results

From the survey distributed to a body of students ranging from Freshman to Senior classes, we discovered that the data matched the needs sourced from the interviews.

  • 73% of students tracking assignments is one of the biggest pain points in their education

  • 27% of students think that they are missing important information

    What type of features do they want?

    • 71% view of bell schedule

    • 67% quick calendar view

    • 57% wanted access grades calendars

    • 43% messaging with teachers and coaches

 
 
 
 

Journey Map

Under the current platform, the average student found it easy to submit homework and text message teachers. The user experience then began to decline once they tried to access their bless schedule, receive sports club announcements, keep track of graduation requirements. All of which lead the students to not use the current platform very often. We took all of that quantitative data and synthesized it, so we could figure out what to design for.

 
 
Journey Map_NHS (1).jpg
 
 

The Findings

North High is a task management app for primarily for students, but offers access and support for teachers, administrators, and parents as well. This app will allow students to access their schedule, send direct messages to fellow students and teachers, track their grades, receive notifications for events, update daily planner, and the enabling of preferred notifications. By having access to all of these platforms on one mobile app, the problem of important information being spread out between a website and multiple mobile apps is solved. A single and customizable app would be an intuitive and central way for students to stay organized, communicate, and share information on a daily basis with both their fellow classmates but also their parents, teachers, and administrators as well.

The Users

Based on the research found in the discovery period of the project, I created two personas, Juliette and Jerome. Designing for these two personas helped in making informed design decisions as we had the end user always in mind.

 
 
persona 1.png
 
 
persona 2.png
 
 
 

The Design

To bring our first ideas into form, I ran a design studio where we were able to bring together some early ideas on how to organize an app that captured the needs of tracking grades, accessing the bell schedule, communicating with teachers, checking announcements, and the overall basic structure of the app.

 
 
P5 mockup pic.png
 
 
 

User Flows

 
 
 
 

After rough sketches were made to brought into form, I created user flows for the two personas. Here we have the users going through two flows that capture the needs of the average user at Denver North High.

P5 User Flows.jpg
 
 

Site Map

The next step I took was to create a site map to start giving the design some real structure. I took the difference pages of the app and organize them in a way that created an even flow from one page to the next. The site map became a great reference point throughout the design process so understand how each page would influence the next. The user flows were also integral in this part of the design process. Since the user flows were based off the most important needs of the user, we were always able to keep creating the app with the user in mind.

Sitemap.jpg
 
 
 

Prototype #1

p5Portfolio1.png
 
 
 
 

Usability Test

I performed a usability test on the first prototype. The test subject was taken through the two user flows of Jerome and Juliette.

  • Onboarding process:

    • Preferences page is confusing and users did not know its purpose

    • Title of preferences page does not properly indicate why the user is on this page

    • English language preference should come before Spanish

    • Colorful background is distracting

    • Better indication is needed once a preference is selected

  • Dashboard:

    • Lunch menu would be better placed in a side menu

    • Bell schedule layout is confusing

    • Again the colorful background is distracting

  • Menu:

    • The menu page or a better indication for how to transition back to the dashboard

    • Chat Room should be given a title that currently trending

 
 

Card Sorting

I lead a card sorting exercise with 8 participants in order to find the level of importance for features of the app. This exercise let our team further refine our design by knowing where the icons needed to be placed for the main menu, footer, and the dashboard. I then separated the results into three categories for level of importance.

 
 
Artboard.jpg
 
 

Prototype #2

 
P5Prototype2 .jpg
 
 

Next Steps

The final prototype was presented to the stakeholders. They relayed that the design was speaking directly to the daily needs of the North High student. Inquiries are being made with the school district for funding to create the app and fully design it out. We projected the timeline for the fully functioning app to take one year to come into full production and release to the student body.

P5Mockup.png