Utah Valley University App

Insights

Client: Utah Valley University (Educational Initiative)

Team: Myself

My Roles: Research, Design, Testing, Documentation

Length: August 2019 - Early December 2019

Audience: Students of UVU

Tools: Concepts, Adobe Xd

The Problem

The Utah Valley University app has been outdated for a number of years and is not meeting the needs of the student body. The overall experience of the app is convoluted with little to no way-finding, making it so students can’t accomplish simple tasks to help with their schooling. The app has been made slightly redundant by the deserving rise of “Canvas”. On top of its user flows and overall experience, the user interface, branding and experience was un-welcoming and outdated and only added to the already jarring situation. So, how could we make the app relevant again?

The user interface,  

branding and experience was

un-welcoming and outdated

IMG_8232-1.jpg
IMG_8231-1.jpg
IMG_8230.jpg

Mobile screens of the current/original UVU app

The Process

Research

I first did a heuristic markup of the existing app to separate what features should stay with the update and which ones could be taken out. The heuristic markup also allowed me to point out elements of the existing app that were not design-friendly. After carrying out a review, I began to speak with students around the university. I asked them a series of questions:


• Did you know there is a UVU app?
• Have you used it? And for how long?
• What 3 things would you like to be able to accomplish in the app?


These questions would help me to determine the awareness of the existing app and how I could design the new app to meet certain needs.

Sketches/Ideation

After review and research, I moved to sketching out how the re-designed interface would look. I expected this phase to be fairly quick, but as I began sketching, I found myself re-working user flows and how the app would work. This became one of the areas where I spent most of my time. As the old app was difficult and confusing to use, I wanted to make sure I got it right this time.

HR_pt1.jpg
HR_pt2.jpg

Heuristic markup of areas with pain points

crazy_8.jpg
Revision.jpg

Crazy 8's and revision sprint exercises to determine which designs would work for a home screen

Iterations for how screens could look and how the app might flow

Mockups

I created gray mockups to confirm my sketches in a vectorized form and make sure that designs were still functional and working. During this phase I also received feedback from creative professionals, which I was able to use to refine the mockups and prepare for the final ideation stage. I also took the opportunity to create a quick prototype with the gray mockups to confirm that the flow of the designs was usable. The student experience was a large part of this project for me, as I wanted the user to be able to easily navigate the app, whether that meant going forwards, backwards, or jumping to an entirely different part.

Screen Shot 2019-11-19 at 6.36.12 PM.png

During this phase I also received feedback from creative professionals, which I was able to use to refine the mockups...

Screen Shot 2019-11-19 at 6.35.48 PM.png

Iterations for how screens could look and how the app might flow

Hi-Fidelity Comps/Prototype

With the user flow fleshed out through sketches and mockups, I was able to focus on the look of the app. I designed utilizing the principle of “Hick’s Law,” in that I limited number of the choices on screen so as not to overwhelm the user and to present a clear path to them. With a limited number of items, they only have a set amount of ways to navigate, which reduces being lost and increases way-finding within the app. Using the official UVU branding guide, I focused on designing around the principle color of UVU; green, while accenting areas with teal and yellow. 

Highlights of the app re-design included:

  • Newsfeed landing page - This would keep students updated on current events on campus and events coming up.

  • Calendar with Filters - Again, to drive student engagement on campus, events are clearly displayed with dates and times so that students are better informed. Many students expressed they would like to be involved with school events but don't know where or how.

  • Schedule UI - I designed a schedule for when a student is registering so they can see how their classes affect their weekly schedule.

  • Registering Help - The student has 3 choices to register for classes with automated options and customizable options. Through the process, the student can also be prompted as to what classes to take for graduation.

threed_mockup (9).png
threed_mockup (11).png

Final screens for the re-designed app

The Solution

The proposed answer to giving life to a dying app lied with the audience it would be serving; the students of Utah Valley University. I put into place a plan to research the existing app, its use, and then move onto talking with students from around the school to determine what features would be useful to them. Once I had confirmed what was needed for an update, I then planned to move onto re-designing the app by strongly branding the app and giving it a more updated look. With each phase in place, it would create an updated app that would be beneficial to students around the campus.

The proposed answer to giving life to a dying app lied with the audience it would be serving...

Outcome

Through testing the prototype with students, I was able to receive critical feedback on the app design and experience. Many students expressed that they would love a new app like the one created and that the options to register for classes on the app were beneficial, as well as an updated map. While students praised most features, they also expressed that they wish they had the option to edit scheduling through the app and access other features such as financial aid management, and an option to pay tuition. Students expressed more interest in being able to handle more administrative tasks through the app. 

Many students expressed that they would love a new app like the one created...

What I Learned

The preparation stages of a project can sometimes be the most important, depending on the scale of the project. In the time that I had to focus on each stage, I originally thought I would spend less time on the research and sketching, as it seemed like a simple re-design. It was during the research stage that I realized that this wasn’t a simple UX re-design, but rather a mini-overhaul of what the app was and what it would do. As I stated before, “Canvas” handles the homework part, but what handles the school culture, news, and registration? That’s what the app evolved into with this re-design; an app that could connect students to each other, and most importantly, connect them to their school so they felt involved.

...I realized that this wasn’t a simple UX

re-design, but rather a mini-overhaul of what the app was and what it would do.

EXTRA Insight - The Official UVU App Re-design

As this was an educational initiative, the re-design wasn’t officially implemented, but during the process I was informed by classmates that an official survey had been sent out by the school to get feedback on features that were wanted on a new app. I took this opportunity to confirm my research further and compare my re-design to a possible official one. I contacted the people in charge and was able to meet with them and see a new updated UVU app that was scheduled to be released. This situation was great as it allowed me to further my own designs and take inventory of my project.

I was shown the survey results that they had received and confirmed that registration was a much wanted feature for an updated app. The official research also confirmed that an easier to use interface was desired by students. While the official research was very close to what I had discovered during my own research, the design was much different. The interface was much better than the existing app, but in my opinion, still suffered from being overcrowded with options in the menu. It seemed that there were complicated pages, as many options used an in-app browser. Although there were parts I would change about the updated official app, they did explain that they were constrained to this particular build as it conformed to accessibility standards that were required for the app.