rhianon chaos
HBC Design System
Role UI Designer
Tools Sketch
Platform Desktop & Mobile
Overview
The HBC UI library was in need of an update. Designers began to use Sketch as the main wire-framing tool over Photoshop.
HBC was also in the process of migrating to a new platform so this was a perfect time to build a scalable design system.
Scalable Design System
Google Material Design has set the standard that each site
have a solid UI Style Guide.
It follows best practice and makes creating wireframes and
iterating for desktop & mobile quicker.
Design tools such as Sketch and Figma are powerful and
make it super easy to manage with symbols and components.
Elements
Building out a symbol library and type styles for each banner
made it easy to create wireframes on the fly.
This gives designers more time to focus on the design process
rather than recreating patterns UI patterns.
