amd.com redesign: creating a unified look and feel (UI) on a new platform improving brand awareness

AMD promotes products in many channels in the market. The goal of their products are consistent but customers respond to various messaging approaches depending on the channel of the market.

design challenge

The challenge when considering the amd.com redesign was how to apply all the diversified campaign designs in to one web property harmoniously. In conjunction with this strategic design puzzle the new design would also be applied on a different web platform. This meant that determining the best way designers would implement this design would also need to be considered.

design approach & my role

My role in the amd.com redesign I acted as both the design strategist, user interface and brand expert. As the online design lead, I had an expert understanding of the user needs (determined from past a/b testing, eye-tracking, and observing in person interviews), Stakeholder requests, development process, and the importance of consistent visual branded elements across the site. I worked as a web consultant for the creative director by providing these insider details, suggestions, and by collaborating on the best way to blend the various campaign assets in one location. I attended all design review meetings, presented wireframes & mockups to executives, and user flow demonstrations in InVision app. As the design lead, I was tasked with collaborating and testing with developers to determine the best way to actualize the modular and fluid content management system editing elements while maintaining the integrity of the design. We collaborated using an iterative method for both design and build by troubleshooting, testing several options, and then making quick edits. The design philosophy development also fell under my role which was shared with content strategists to align on the approach to maintain persistent brand elements across the site. Design tasks within the project also included providing defined styles to developers, creating a web design styleguide, defining the design philosophy, and educating stakeholders on the updated content and design strategy.

design philosophy & user journey points

• design amd.com to be more flexible in the way campaign art and messages are integrated within a single layout

• assets focus on consistency in campaign art from visuals to typography treatment

• showcase creative with a cinematic and texture approach to create depth and dimension within the pages of amd.com

• strategically determine the visual balance of content to establish an readability experience

wireframes

Wireframes were created for many phases of the project. preliminary wireframes were presented at the beginning of the project so that all stakeholders could remain focused on the user journey and consistent brand elements before visual discussions. high-fidelity wireframes were then created to demonstrate the cohesive design of all campaigns. Finally, detailed wireframes were created as a resource document for all projects moving forward. This resource provided intricate instruction on how the modules were to be represented on new pages.