Clazar: Website Design System

Clazar: Website Design System

Clazar: Website Design System

Clazar’s website was redesigned to align with the company’s new identity as The Cloud Sales Acceleration Platform.

Clazar’s website was redesigned to align with the company’s new identity as The Cloud Sales Acceleration Platform.

Role

Brand Designer

Brand Designer

Duration

2

2

Tools

Figma, Illustrator, Photoshop

Figma, Illustrator, Photoshop

Team

Head of Marketing, Content Writer, Junior Designer, PMM

Head of Marketing, Content Writer, Junior Designer, PMM

Mobile UI Cover page
Table of Content
No headings foundSelect the Frame that wraps your article content → open Accessibility → set Tag to main, article, or section.This message disappears as soon as headings are detected.

Project Overview

The goal was to bring clarity, enterprise-readiness, and authority to every page — making it easier for Sales, Revenue, and Finance leaders to understand exactly how Clazar helps them drive revenue through cloud marketplaces.

The Challenge

While Clazar’s product and positioning had evolved, the previous website hadn’t kept up. It lacked the structure, depth, and visual strength to appeal to enterprise decision-makers — especially those in complex sales or co-selling environments.

Goals

We needed a website that would:

  • Reflect Clazar’s new brand identity — modern, confident, and built for enterprise

  • Clearly communicate how Clazar supports selling and co-selling via cloud marketplaces

  • Cater to our key personas: Revenue, Finance, and Sales leaders

  • Improve navigation and content structure to help users find what they need, fast

  • Increase conversion — from first visit to signed customer

Process and Exploration

To bring the new brand identity to life online, I translated it into a modular design system that could scale across all digital touchpoints. The goal was to create a look that felt confident, enterprise-ready, and distinctly Clazar — while still being warm and easy to navigate.

Color Palette


The Color Palette is a rich mix of deep navy and energetic orange, expanded into tints and shades to add flexibility. Supporting colors for text and gradients help ensure strong hierarchy and keep visuals dynamic rather than monotonous.

Typography


Typography that has clean, highly legible typefaces with a versatile range of weights, allowing for clear type hierarchy and emphasis across use cases.

Icons


We adopted Material Design icons from Google for their universal clarity and minimal design, which complement our visual language perfectly.

Photography


The stock photography for the website is curated to reflect real-world collaboration and modern B2B teams, avoiding overly staged or generic corporate imagery.

Product UI for Marketing


For showcasing the product in a simple, easy-to-understand manner, we used modified UI snippets throughout to anchor our storytelling in the actual platform experience.

Concept Illustrations


Solution

The final website reflects a confident, enterprise-ready Clazar — with focused messaging, persona-led navigation, and design that brings the product and value to life.

Impact

The redesign didn’t just elevate how Clazar looked — it directly contributed to growth across the board:

3x

Increase in enterprise deals

95%

Increase in svg session duration

3.5%

Increase in conversion rate

The site now works harder — helping visitors understand, trust, and choose Clazar over the competition.