CSUMB School of Computing & Design Webpage

Overview

This was one of my first big coding projects. The assignment was to design a webpage for a partner in class. I was given the CSUMB School of Computing and Design page to redesign.

Design Process

Current Page

This is the current page for CSUMB SCD. I used all the text and images from the current page for my redesign. Some of the problems i noted with the original site were:

  • Subpar information architecture

  • Too much white space

  • Monotone color palette

  • Outdated design

Ideation

After a couple of brainstorming sessions, I came up with a couple of sketches and a mood board for the new page. I decided to go for a more image-based approach to make the site feel more modern. I wanted to highlight the beauty of the campus and give the site an earthy feel, given the location of the school. My original plan was to stick to the school colors and just modernize the layout.

Prototype

When I began prototyping, I decided to go for a darker and sleeker palette to give the site a more modern feel. I still wanted to do an image-based layout, so I experimented with incorporating the copy on top of the image.

Final Product

Once I had my prototype, I went to Wordpress to bring the site to life. I stuck to my dark palette but changed the header and flow of the site to give it even more differentiation from the original. I decided to keep most of the text in the body and not on the header image to improve accessibility since I did not want to take away from the image with a dark background. Before this project, I had knowledge of hard coding. I really enjoyed combining this knowledge with a tool like Wordpress because it allowed me to build a sleeker and more complex site than ever before.