Best Buy and Microsoft Surface:
Create for a Cause

Team: Designit (Formerly Rational Interaction)

Client: Best Buy

Role: Senior UI/Visual Designer

Project Description: Create an immersive design contest experience for Best Buy. To design a Microsoft Surface Type Cover for the chance to win a Surface prize pack! Not only that, one design will be produced, with proceeds going to the Best Buy Teen Tech Center.

Design/Visual Approach: The visual approach was inspired by the creative user interface within the application itself. Using various shapes that are options within the design tools, patterns were created to set the stage for the interface with which the user will be engaging. Additionally, the color palette was pulled directly from the design interface as well, opting to use the lighter shades to breathe a playful, welcoming vibe into the surroundings.

Design flow

How the user journey maps from Best Buy site to completion of contestant entry

Screen Shot 2021-06-10 at 3.35.10 PM.png

Design and visual elements

How the experience is represented visually. We took a more playful approach using a wide variety of collage, shapes and tools found in the actual UI to create a design language.

Color Palette:
Our approach went beyond the Microsoft blue. The total colors used in our created toolbox is 24. UI and interaction elements are limited to core brand colors (grays, primary blue, etc). While graphics and heroes open up the palette as if they were created within the program.

Landing page and age gate

Video will play giving a high-level view of the competition and creative interface. Our simple layout patterns include hints of elements that can be used in the design user interface.

Guidelines

This page is dedicated to informing the user of contest rules, prizes, judging, and tips to creating a winning design. The user can access this page at any point by using the dropdown menu.

About the teen tech center

This page, which highlights the Best Buy Teen Tech Center, can be accessed at any point of the user journey using the drop-down menu. When finished, the user can learn more about the Teen Tech Center or return to design.