Marriott International

Enhancing Marriott Bonvoy’s Component Library Templates

The goal was to enhance Bonvoy’s Component Library template page by allowing designers the ability of quickly creating an editable template so they can build new components more efficiently using Sketch.

Marriott International

UX Designer, UI Design, Information Architecture, Wireframing, Prototyping

The current state of the component library template needed to be updated and enhanced to help designers focus on organization. The redesign of the page template will be enhanced by aligning the content to the bootstrap grid 1440pw, Editable header, and dynamic content for body copy and code.

To achieve this update, Sketch was the preferred tool that could help with creating custom symbols within symbols where the header is editable, and the content is dynamic.

Building a dynamic page template has allowed for faster production of components by 33%, while design efficiency rose by 52% with dynamic editable content.

When designers were copying page templates to create a new component, it wasn’t realized how inefficient and inconsistent the templates where becoming. By organizing and enhancing the layout, their workflows become more efficient and consistent.