
Modular, adaptable and scalable website design system for SpotDraft.
Modular, adaptable and scalable website design system for SpotDraft.
Visual Identity
Visual Identity
Visual Identity
Design System
Design System
Design System
UI Design
UI Design
UI Design
Web Design
Web Design
Web Design
Imagine a website with different font sizes, color pairings, inconsistent components and misaligned with company’s branding. SpotDraft faced a similar situation as multiple teams were developing pages in absence of well-defined guidelines.
Imagine a website with different font sizes, color pairings, inconsistent components and misaligned with company’s branding. SpotDraft faced a similar situation as multiple teams were developing pages in absence of well-defined guidelines.
For a scaling startup as SpotDraft, the brand website and associated marketing campaigns are the building blocks of brand recognition and credibility. Thus, it is imperative that a consistent visual expression is maintained for seamless user experience.
For a scaling startup as SpotDraft, the brand website and associated marketing campaigns are the building blocks of brand recognition and credibility. Thus, it is imperative that a consistent visual expression is maintained for seamless user experience.



With multiple marketing initiatives, the number of asks for campaigns was increasing. But lack of design bandwidth made the teams to incline towards external agencies leading to disjointed components and UI patterns in the final output.
The goal was to manage design at scale, so we needed a set of standards as guiding light for both designers and developers to be consistent with output across all channels. By defining foundational tokens, components and UI patterns, we enabled faster design creation and eliminated unnecessary errors .
With multiple marketing initiatives, the number of asks for campaigns was increasing. But lack of design bandwidth made the teams to incline towards external agencies leading to inconsistent components, UI patterns and visuals in final output.
The goal was to manage design at scale, so we needed a set of standards as guiding light for both designers and developers to be consistent with output across all channels. I enabled faster design creation and eliminated unnecessary errors by defining foundational tokens, components and UI patterns.



We built up a design system with each component designed to solve a specific UI problem and work harmoniously as part of a greater whole.
We built up a design system with each component designed to solve a specific UI problem and work harmoniously as part of a greater whole.








We also defined a comprehensive set of UI patterns that are customizable—select and simple drag & drop layouts, eliminating the need for intricate design for recurring use cases.
We also defined a comprehensive set of UI patterns that are customizable—select and simple drag & drop layouts, eliminating the need for intricate design for recurring use cases.











With the implementation of new website system, we enabled stakeholders with faster outputs and eliminated unnecessary errors with pre-defined guidelines for every use-case.
This also improved the performance of revamped product pages with an decrease in bounce rate from 56% to 38% and increase in CTR from 1.24% to 2.11% within the first week of going live.
This also improved the performance of revamped product pages with an decrease in bounce rate from 56% to 38% and increase in CTR from 1.24% to 2.11% within the first week of going live.
With the implementation of new website system, I enabled stakeholders with faster outputs and eliminated unnecessary errors with pre-defined guidelines for every use-case.






ALL RIGHTS RESERVED 2025 © STUDIO BAUNO