Rachel Grinbergs
Hub: Restructuring the Online College Experience
senior bfa thesis project
My senior year capstone project was Hub, a website and mobile app aimed at rethinking the online college experience. The website integrates fundamental tools used by college students such as class search and registration, extracurriculars, and advising to provide an up-to-date, streamlined, and intuitive system that is easy to use and optimizes a student's path to graduation.
The Problem
The online systems provided to college systems are managed by siloed departments, and as a result, they are all designed differently, accessed independently, and often convey incorrect information.
It got personal.
Because of this, I was almost unable to receive my BFA. The summer after I switched my major to the BFA, I found out I had been misadvised and talked to around five different advisors to sort out my path to graduation. However, after hearing five different stories and trying to work with information on my graduation progress system that was incorrect, I had to manually sort out my schedule. As it turns out, it was possible for me to receive my degree, but I only figured that out after having to work against multiple systems that should have been there to help me.
I knew I wasn’t the only one. I had heard grumblings about the systems provided to us amongst my classmates and I wondered how many times this had happened to others, and more importantly, how many had missed out on opportunities just because of the failure of these systems to work together and function properly.
As both a designer and a student, I knew I had the opportunity to solve this problem. I decided to design one website that housed all of these functionalities.
I found that the students who were the most enthusiastic about the idea of an updated ePortfolio were the ones taking classes and building skills outside of their degrees. How do you digitize a college student's experience?
I’m more than just a theology major. Studio art has been a significant thing I’ve dedicated my time to, and other things that don’t necessarily come with a label. You can share experiences that aren’t expressed in your Notre Dame introduction, like involvement in music, or passion for learning a new language."
An ePortfolio tells a story about the process and showcases the skills without the degree.”
I talked to four deans in order to be able to go abroad."
"
"
"
There’s no one who knows everything comprehensively about my major plan.”
Classes are listed multiple times. Cross-listing under different attributes is confusing.”
I never use the graduation progress system and I don’t trust myself enough to navigate it.”
I always schedule a meeting with my advisor so I’m sure I’m not wrong.”
"
"
"
"
Inspiration
For inspiration, I looked at data-heavy examples of interface design. I knew I needed to create something simple looking and intuitive, when the subject matter itself, was trying to recreate, was not simple at all. I knew I needed to provide the right balance of graphics and text; that balance was absolutely necessary for an interface that needed to convey so much information, yet do it in a visually appealing way.
Wireframing
Wireframing proved to be a difficult process, and one that involved both organizing the structure of the site and how it would appear as well as figuring out how the different functionalities and modules would work together in a cohesive way. By using a strict and consistent type system, color scheme, and layout for each module, they ended up working together visually.
My original color palette included these four colors, one of which changed when I received feedback that it might be too feminine. The plum (originally rgb 172, 102, 146) turned into the soft red pictured as the last color above. My type system integrated the DIN and Gotham type families, using DIN primarily for headings and Gotham for body text. The use of two sans-serifs provided a sleek, appealing, simple look to the interface. I found that anything too stylized was not the best aesthetic for what I needed to convey, so through a process of honing in on a streamlined design, the interface design came together in a beautifully simplified way.
Prototype
The final product integrated four primary functionalities: class registration, advising, extracurriculars, and ePortfolio. I kept the site gridded and structured through distinct modules on each page, keeping it visually tidy and easy to navigate. View the guided prototype here.
Snite Exhibition
I created print pieces detailing my process, along with a motion piece and guided prototype. I left out branded cards directing museum visitors to Hub’s landing page, where they could access the prototype and video once they left the exhibit.
