Project Overview
I worked independently to create website mockups for Magma Creative, a creative agency based in Roseville, CA. The new website needed to reflect the company's innovative approach towards branding, marketing, and videography services. It also needed to tell a story about how the company uses design to push the boundaries of what already exists in order to pave the way for groundbreaking new technologies and approaches (NFT's, AR editing, etc.). I implemented space-themed visuals to represent how Magma Creative is prepping to advance their current line of work in new ways to support futuristic endeavors.
Role: Solo UI/UX Designer | Duration: 2 weeks | Project Type: Website/Desktop | Tools: Figma
Mockup 1: Top Navigation Bar
I focused mainly on typography and high-quality imagery for these mockups. The client wanted the website to allow for a continuous vertical scroll so that users pass by the team, about, services, work, and contact information. Though the website is meant to be a continuous experience (with consistent background imagery) I made sure that each section could be comfortably viewed as a standalone screen so users could comfortably read each section. The top navigation ensures that users may skip from one section to another without having to scroll up or down.
The idea here is to have the astronaut headshot fade into the employee's portrait if the user hovers their mouse over the astronaut.
Users can click on a client's logo to read a client testimonial
Mockup 2: Side Navigation
The side navigation allows for content to fill the entire space (without compromising top row real estate). I wanted to explore this style of navigation because it's a visual indicator that tells the user where they are on the vertical y-axis.
I envisioned some type of user interaction for this screen. Maybe the DNA swirl moves across the screen as the user scrolls, or the astronaut follows the users mouse as they move it across the screen.
This fieldset wasn't requested by the client, but I proposed this as another way for potential clients to reach out to Magma Creative directly from the website.