NU Student Hub Mobile App

Northeastern University’s digital resource center for undergraduate and graduate students.

Project Scope

The Student Hub is a one-stop-shop for Northeastern students’ digital needs. It can only be accessed through a browser. As a Digital Experience Assistant for Northeastern Information Technology Services, I was tasked with developing a mobile app version of it.

Research & Focus Groups

Google Analytics

I wanted to go a step further than turning the SH website into a mobile app. Instead of redesigning the current UX/UI for mobile, I decided to re-examine the Google Analytics to see if there was anything that is not being sufficiently highlighted on the website. I found that the E-Bill—which students review regularly to see whether their financial aid has been dispersed and their tuition paid—was hidden behind several clicks, even though it was the second-most visited page. I decided to better highlight this feature in a mobile app design.

User Focus Groups

The DX team hosted several focus groups to better understand what students wanted from a mobile student hub. We found that students accessing SH on their phones usually did so when the task at hand was urgent. This includes checking their registration status, their e-bill, and their schedule. Tasks of this nature were what they wanted highlighted most in a mobile application. Many students also mentioned that they would want the mobile app to have a dark mode, considering many popular mobile apps have this.

Current student hub for web.

Branding Development

Existing Student Hub Brand

The SH website veers away heavily for Northeastern’s current brand. Both our primary school colors of red, black, and white and our typographic hierarchy are nowhere to be seen. Although this was originally an intentional decision, the DX team wanted to explore a version of the hub that sticks to the Northeastern brand.

New Student Hub Brand Development

I brought back the red, white, and black that is seen in the rest of Northeastern’s branding. This color palette lent itself nicely to a dark-mode mobile app. I did, however, keep the typographic hierarchy that is currently used on the hub. I found that it was more suitable for digital design than the print typography guidelines typically used by the university.

UX/UI Wireframing