Community portal

UI prototype

Project icon

Originally My Full Sail Experience, Takeoff is a mockup community portal for students. For one of my design courses at Full Sail, I wanted to push myself with creating an app prototype that would help other students. A problem I’ve noticed at multiple institutions is a variety of portals and platforms for students for different areas, each with different calendars, message inboxes and such and I wanted to design a way to consolidate them and help with other life tasks like finding roommates and notifying students of upcoming meetings and classes.

This project had many design iterations and names. It focused on style guide creation, user testing, and rapid prototyping. Each week over a month, two presentations were expected showcasing competitive analysis, user feedback and a fast turnaround on design improvements with as little as an hour.

Earlier prototypes

My first approach was to create a basic app with a hamburger menu, showing all of the options, it provided quite a bit of flexibility, but getting users to explore each area of the app was a bit difficult. Also, users felt the interface seemed a bit dark. In some of my later iterations, I opted for more of an onboard-heavy flow, however with this sacrificed much control by the users.

Yes, you can actually play with these prototypes! They are just that, prototypes, to illustrate interface concepts, not working versions.

Takeoff interactive prototype version 1.
Takeoff interactive prototype version 2.

Rounding it out

It turns out some of my earlier concepts were rather spot-on, and as I began changing minor details, it became faster to use SASS and HTML to implement these changes. I ended up also working with the Materialize CSS framework to help speed things up.