Design System, Mobile Design
In 2021, there is a new visual direction change in Search Element Design System and new use cases added in Commerce, Ads & Search, the visual & content strategy defined in REACH UX Sprint for Badging system needs to be updated for further alignment. Property, Ads format team, Shopping Ads & Search are working on inconsistent proposals with different timelines for badges.
Though Property is not part of Search Result Page, not having alignment on badges does impact the cohesive look and feel in shopping overall, hence impacts Ads format and Search Result Page.
Problems are the inconsistencies in many aspects not just visually in-alignment:
Visual direction: Font, Padding, Color, Shadow, Dark mode definition, Prominence level....
Positioning
Triggering guidelines
Content strategy
A11y & i18n
...
What we already know today is each product area shares highlight badges use case. Highlight badges are badges that visually draw users’ attention and clues them into something special or unique. Highlight badges are meaningful insights that help users make a decision.
But what we don't know is many other undefined badges across Commerce, Ads and Search surfaces. Thus in this project, I conduct audit across all CAS surfaces to help us scope and reconfirm:
What’s the scope Should there be a new CAS system level “highlight badge” definition that we want to be focused on?
What’s in scope What else on CAS can be considered as highlight badges (though they might visually look different but functionally the same, e.g flyout functions same as shopping acquisition badges)?
What’s out of scope What are not highlight badges (though they visually look similar but functionally different, e.g various price labels on Travel today)?
After the audit, we will summarize each badge use case to categorize them into different types, then further define badging system guideline.