Design Case Study: Critical Making Studio Website
Background
When I first joined the Critical Making Studio at Occidental College in 2014, it was a new maker space on campus that very few students and faculty knew about. With a mission to foster an “open learning environment where students and faculty learn how to critically engage with a range of digital production tools and integrate them into their scholarly practice,” I knew that the space had potential to grow into a place where the entire campus community wanted to apply their knowledge and endless curiosity.
The year I was hired to work there, I had begun diving into web design and development classes both in school and online. In addition to assisting students and faculty with the various technologies in the studio, I knew I wanted to make an impact on its longer-term growth, and I thought a new website would be a great place to start.
Sketching + Information Architecture
After getting the website project proposal approved by my supervisors, I began by sketching out the potential landing page UI design on a whiteboard, along with some potential interaction user flows. While I didn’t document those particular sketches, I did follow a similar process as a different project pictured below.
My first major design decision for the landing page was to have a hero video showcasing the beauty of the campus and the creative spirit of the students and faculty. There was recent drone footage of the college that I got permission to use, and I came up with the tagline “Where Liberal Arts meets Innovation” to feature on top of the video. I wanted students and faculty to be immediately intrigued as soon as they got onto the website, and I thought that a video + slogan would be a good way to grab the attention of future Critical Making Studio patrons.
My next decision for the landing page was to feature some projects that students had already worked on in the studio so that others in the campus community could get inspired for their own projects, as well as get excited to spend time in the new maker space.
In terms of organizing the rest of the home page, I decided to have an “about” blurb, a calendar of events, and contact/social media info in the bottom toolbar. Since I was pretty new to web design at this point, I made the micro-interactions and layout based on intuition and feedback from peers.
The UX Impact
Following the launch of the website, our Critical Making Studio Team shared the site on social media and email blasts and organized a launch event in which dozens of students and faculty attended. In the two years after launching the website, hundreds of new students have utilized the Critical Making Studio, faculty have been using it to hold workshops for their classes, and student organizations have been using it as a meeting space! It was so rewarding to see the growth of a space that fit so well with the type of students and faculty Occidental attracts.
