The Otis

Nest Renovation

Project

At Otis College of Art and Design, we have a portal that allows students to access our individual classes and their individual and unique information.

After collecting user data, many students reported that the website was too clunky and hard to navigate. It took so many clicks in order to find the thing in particular that they were looking for, and that was not conducive to their work. 

I wanted to create an app that would not only streamline the UX, but be as universally accessible as possible, meaning that international students might have an easier time entering Otis.

As someone who uses this portal every day, I decided to spearhead a hypothetical solution to the problems current students were facing.

I am a senior at Otis , and using feedback along with my own personal experience with the Nest, I decided to renovate the currently existing Nest.


User Feedback

"It's Clunky"

•

"It's Meh"

•

"Teachers don't use it"

•

"It's Clunky" • "It's Meh" • "Teachers don't use it" •

  • 1.) I want to find my grade for individual assigments in my class

  • 2.) Let's log in for the 3rd time today

  • 3.) Now we're on the homepage with a lot of unutilized space

  • 4.) Now we're looking at a specific class. Where do I go now?

  • 5.) Let's check 'coursework'

  • 6.) There's so many options.

  • 7.) Oh, there's Grades

  • 8.) Ah, we made it.

  • Now, there's no grades here, but this is what you have to do to get here.

Project Values

Simple

•

Accessible

•

Welcoming

•

OTIS

•

Simple • Accessible • Welcoming • OTIS •

Renovations

Here’s a quick overview of the key elements I wanted to encapsulate for my changes

  • In order to streamline and cultivate academic success, I wanted to renovate the Nest so that students would be able to work more efficiently towards completing assignments.

  • Because the original idea of ‘The Nest’ is sold as the ‘home for all Otis owls’, I really wanted to try and encapsulate the idea of welcoming as well as giving a homey vibe. This is why I utilize more rounded elements such as typeface, so that it’s not as intimidating.

  • I wanted to ensure that the renovated Nest was accessible to all students, with the focus of my accessibility aimed towards international students. Many of my international peers have described the Nest as confusing, and considering that many of them are new to English, I wanted to ensure that it is intuitive and understandable to them.

  • I really wanted to tie this app with the new Dashboard, along with giving visual ties back to Otis as a whole, so I chose a color palette that reflected its physical campus with the vibrant reds, and concrete and corrugated steel greys.

Style Guide

Here is how I decided to style the prototype

Less than 5 steps to complete your task

No Login

Minimized Categories

No Wasted Space

Home Page > Select Class > Content > Done |

Home Page > Select Class > Content > Done |

Home Page > Select Class > Attendance > Done |

Home Page > Select Class > Attendance > Done |

Home Page > Select Class > Discussions > Done |

Home Page > Select Class > Discussions > Done |

  • 1.) Let's Find My Grade Now. (Login once and hopefully rarely, if ever, again.)

  • 2.) Here are all my classes. Let's select the top one

  • 3.) Everything that I could possibly need is here. Let's tap the "See Grades" section

  • 4.) Grades Acquired. Mission Accomplished!

Check out the Prototype in action here!

https://www.figma.com/design/d5iAdCWHGqv0SlmnoSCaqL/Prototyping?node-id=0%3A1&t=JWulAXHS6FmD97TW-1

Click the link and then click the play button on the top right next to the open face book icon and zoom percentage.