“How might we provide our advertisers with a modern and accessible ad management experience utilizing Microsoft’s Fluent design while maintaining familiarity with users from Google Ads?”
Microsoft Advertising Rebrand & redesign
In 2019, Bing Ads announced a rebranding and redesign effort to become Microsoft Advertising. This change was inspired by rising changes in the market as Facebook Ads and Instagram Ads began to inspire the future of ad management experiences; additionally, Google Ads presented a full redesign of their product utilizing Material Design with a new focus on navigation changes and mobile.
Design question
Research
There were several factors that inspired Bing Ads to pursue not only rebranding itself as a product, but to also undergo a complete overhaul of the front-end experience — first and foremost, the competitive landscape. Our surveys illustrated that users didn’t readily associate Bing Ads as a Microsoft product, unlike Facebook Ads and Google Ads, whose branding directly tied to the companies that served them. Microsoft Advertising was a needed change, both for our users on the Bing platform and to begin integrating our service into more of the Microsoft ecosystem. I worked closely with our marketing and content strategy partners to create new help and onboarding material, and as design lead for the account & billing space, scoped this work into several phases so we could make incremental change without disrupting advertisers’ ability to run their business.
The rebrand paired with a company-wide push to adopt the Fabric/Web Fluent design system already used by Office and Windows, which opened the door to more cross-platform collaboration. Google Ads had introduced Material Design in 2018, and since a majority of our users also used Google Ads, staying familiar mattered — we wanted to ensure advertisers, from small business owners to high-spending agencies, wouldn’t have to relearn a new product when jumping between the two.
However, we simply could not follow Google down the path of Material Design. Instead, we studied primary workflows and features to extrapolate the primary user journeys within the product — Google Ads had reorganized its navigation in five major ways that inspired our own heuristics: primary campaign management and navigation, secondary navigation, contextual awareness, account switching/search/tools access, and grid data management.
Design implementation
This was an exciting time for Microsoft Advertising — while Google Ads was unveiling a new approach to ad and account management, Microsoft products across the company were also shifting to Fabric/Fluent design, which fell in line with our own business goals and UX framework. Our competitors were making strategic, potentially risky changes to their products, and now it was Microsoft Advertising’s chance to do the same, further differentiating itself as a leading provider in the market.
Adopting web Fluent meant peeling back the layers of the product and rebuilding with accessibility and responsiveness in mind, tackling the problem first at the component level. We audited the entire product to find gaps, inconsistencies, and functional failures. Alongside another designer, I led the effort to align our design guidelines and build a process for sharing assets more easily with our team and developer partners, using an atoms/molecules/organisms approach to reevaluate our human interface guideline documentation and update our content so cross-channel teams could collaborate with us more efficiently.
Inclusive design meant more than color contrast — it meant robust interactive states for keyboard tabbing and screen readers, reformatted content for reflow and responsive scenarios, aria labels for images and content, and usability studies that recruited participants with accessibility needs. I drove presentations and knowledge-sharing on keeping accessibility in mind as we built, which ultimately reduced churn and duplicate work across the design process.
The new Microsoft Advertising app icon, part of the rebrand from Bing Ads.
Results
The feedback was clear, and we delivered on these benefits:
- Better tools to help improve effectiveness and save time
- Confidence to test campaign changes
- Ability to drive customers to immediate action
- Clearer insight on ad performance with prominent metrics
- Multi-account management with clear, contextual, actionable notifications
- Easier resolution of payment problems
- Healthier accounts through AI-powered recommendations
Before
After
Account overview: left-hand navigation replaced the old top bar, and performance data moved into clearer, scannable cards.
Tools such as the date picker gained a refreshing Fluent design look and feel that helps users quickly find reporting insight into their campaign performance. This component is crucial not just for our external advertisers navigating the product, but also for our internal account managers supporting customers worldwide, helping illustrate their periods of ad spend and goals. It was designed with accessibility at the forefront — quick, easy keyboard navigation and clear visual indicators of selection — saving advertisers time and money by helping them find the insights they need faster.
Before
After
The date range picker gained a visual calendar and a clearer comparison toggle.
“Easier access to my campaigns and their results!”
“This redesign represents a new, principled design approach that is centered on customer feedback and contributes to an open, cross-platform design system. The redesigned Microsoft Advertising will be a member of the Microsoft Fluent design community, allowing the product to continuously maintain the newest, most modern design principles for our customers.”
— From Microsoft Blog, “Achieve More With The Redesigned Microsoft Advertising”
