McGuffin Mornings & 404 Page
Graphic Design Co-op | McGuffin Creative Group
McGuffin Mornings
McGuffin Mornings is the speaker series McGuffin hosts to feature professionals in the industries related to their clients. Pre-pandemic, they were hosted in-person with some coffee and breakfast, which is why the web page's theme followed the visual aspects of a coffeeshop. As the format of the talks changed to adapt to a virtual environment, the coffee theme was no longer relevant.
Inspiration and Wireframes
I took inspiration from other sites that archive speeches, videos, and even blog posts — TED, other creative agencies, and design blogs.
Hi-Fi Wireframes
The following prototypes show my final proposed design for the new McGuffin Mornings page. It features parallel information - the description of what McGuffin Mornings is for visitors who aren't already familiar with the speaker series, and drop down recap videos of previous talks. I also designed for the scenario that we don't have the next event planned yet and where there is an event planned that a user can register for.
404 Page
A page that I haven't previously thought about very much is the 404 page. The previous design didn't align with the rebrand, so we wanted to update the look and feel. This gave us the opportunity to explore more creative ways to show an error page.
More Than Just An Error
Sid, Danielle, and I went searching for our favorite 404 pages across the internet. We gathered some interesting examples and wanted to play around with new ideas.
​
One idea was to play on the idea that the "McGuffin is the thing that drives the action" particularly in films. An example is the brief case from Pulp Fiction. I proposed leveraging an illustration that already existed of the brief case paired with some witty text along the lines of "This page is in action..."
​
Another concept was to play into branding since a lot of the client work McGuffin does is related to branding. I thought we could convey this by changing one of the 4's in 404 to be an off-brand font and color.
​
The final concept that we ended up using was to tap into the design world by showing a "vector" of the typography that is still being completed. Click here to see the 404 page live.
Learning a New Program
Prior to my co-op at McGuffin, I had no real experience using Figma to design. My first pages I designed were the case study pages. They were fairly simple — compiling existing mock ups onto a cohesive web page. The McGuffin Mornings and 404 Page were exciting to work on because I had room to actually be creative and learn the tool's capabilities.