The Task
Before
The original design from the previous year's portal looked much like a mega-menu. It had everything on the front page, which makes it comprehensive in theory. This home page a few others had the problem of having too much on the page. It may take a bit of skimming through the entire page to find what one may seek. If the information the user seeks is not explicitly addressed in the plethora of links, it takes a bit of digging into the site tree, but due to limits in the Canvas interface (it does not seem to be meant for building a site within it in this way) navigating back up the hierarchy of pages is daunting and messy. I thought a priority would be to limit the amount of information on a given page but make clicking on the "wrong" link be more forgiving.

Via desktop browser.

On the Canvas mobile app (video).

After
These are some screen shots of the new look. I designed a new header graphic, and turned most of the links into clearly legible, visually associative buttons. I also added a makeshift navigation bar to allow for quickly returning back up the site tree.

Newly designed home page.

Typical page design of each main category. The rectangular buttons lead to external links or the final pages.
Some of the main categories may also be broken down into sub-categories in order to minimize information overload on a given page.

Typical pages at the bottom of the site tree.

On the Canvas mobile app (video).

Graphic Assets
Creating the branded assets were relatively simple. I created a header graphic, main page circular buttons, lower-page rectangular buttons and navigation icons. Images were taken from Unsplash.com or from University photography. The heading graphics were created from scratch on Illustrator based on official school brand colors and the program logo. The buttons were created on Photoshop. The icons were edited versions of Google's free Material Design icons
Back to Top