top of page
FY23_TTC_Mentorship_DSC7543-2 1.png

Best Buy Foundation Website

Foundation Mock.png


Project Name: Best Buy Foundation Webesite

Time Frame: 4 Months

My Role: Lead UX Designer

Tools: Figma, Miro

Objective: Create a stand alone website for the Best Buy Foundation that will allow for visiting users to easily learn about the foundation, find ways to get involved, and make donations.

The story behind the Best Buy Foundation

The Best Buy Foundation is a private Foundation, separate from but originally established by Best Buy.
In 2013 in partnership with The Clubhouse Network, the foundation narrowed its focus and created the Best Buy Teen Tech Center Program. This program is aimed at ptoviding teenagers from underpriveleged communities with training and skills through state of the art technology. As of today there are 50 Teen Tech Center locations across the country. The foundation has awrded over $13 million in grants in 2022 alone, and has impacted more than 1 million people over the last 10 years.


  • The Best Buy Foundation lacks a stand-alone website that clearly distinguishes it from Best Buy Co Inc. and in doing so protects it from significant legal risk to its tax exempt status.
  • The Foundation does not have a simple, user-friendly way to collect donations. Currently the only ways to donate to the foundation are at the point of purchase at Best Buy, or by sending a check.


  • Create a brand-aligned, standalone Best Buy Foundation website which meets legal compliance standards, and serves to educate users about the foundation, opportunities for getting involved, and a clear and simple experience for making donations.


Foundation Process Graphic Final.png

Align on Needs

The first step in the discovery and planning phase was to reach alignment with the project partners on the basic needs for the website. Through a variety of discussions as well as prioritization exercises, the team reached alignment on the basic needs for the website. Some of the overarching needs that were aligned on included, but were not limited to:
  • Easy navigation organizing functional areas.
  • A responsive platform that visually aligns with Best Buy Foundation branding.
  • A search functionality that includes our functional sites.
  • A donate CTA that appears throughout the site.
  • A blog with regularly updated posts
  • A section laying out the history of the foundation.

Competitive Analysis

Once alignment was reached on the basic needs of the site, the next step was to conduct a competitive analysis of similar websites for inspiration and a better understanding of best practices. 

Create Site Map

Utilizing the inspiration from the competitive analysis, as well as the basic site needs previously aligned on, the information architecture was laid out comprehensively through a site map.
Best Buy Foundation Website - Site map V1.jpg


With the information architecture laid out, a set of wireframes was created as a first pass in order to give stakeholders an idea of the general vision of the design team for the structure and overall experience of the site. These wireframes would be leveraged to prompt feedback from stakeholders, that would influence the next iteration of designs.
Best Buy Foundation Website - First idea.jpg
Best Buy Foundation Website - Copy of Classic.jpg
Best Buy Foundation Website - Minimalist.jpg
Best Buy Foundation Website - Narrative-based.jpg

Competitive Analysis

Once alignment was reached on the basic needs of the site, the next step was to conduct a competitive analysis of similar websites for inspiration and a better understanding of best practices. One site in particular stood out for the quality of the user  was the Coach Art website which served as the main source of inspiration for the Best Buy Foundation website's information architecture.

High Fidelity Designs

Wireframes were shared with project stakeholders, leading to an extensive back and forth discussion around feedback and feasibility. Once the wireframes reached a point of wide consensus across the team, a set of high fidelity designs was created to give a better idea of what a final version of this site could look like, and how it would function.
Home page V1.png
Grantmaking v1.png
Impact page v1.png
About V1.png

Iterate and Align

The high fidelity designs spurred a back and forth cycle of feedback and iteration. During this period things such as imagery selection, page structure, specific elements and interactions were finalized. After several feedback/iteration cycles were complete, the team finally reached alignment on the design at the targeted date. From here handoff would occur, and the implementation stage would begin.


With designs finalized, it was imperative to add detailed annotations around interactions, behaviors, and edge cases so as to answer as many potential questions from the development team prior to the implementation process. 

Development Support

Even though the level of detail in the annotations left little room for confusion among developers, it was still crucial to maintain regular communication with the development team in order to ensure the implementation met all of the quality standards outlined by the designs. 

Launch and Measure

The Best Buy Foundation website was launched on October 11, 2023. Since the launch a variety of metrics are being measured including visits, visits with tab interactions, and completed donations. The latest data spanning October 11 through December 7th has shown a significant increase in donation transactions as well as total amount donated. 
With the launch of the Best Buy Foundation website, millions of underprivileged youth across the country have more visibility and receive donations that will provide them with state of the art technology tools and training, that will provide them with lasting skills and opportunities for a better future. To view the finalized design go to
bottom of page