top of page
Microsoft Azure Brand System.png

Refreshing Microsoft Azure spot illustration system

At the end of 2023 and the beginning of 2024, I created Microsoft's Azure  3d isometric spot and spot hero illustration system. As the Azure brand evolved the spot illustration system needed to be able to live in product and on the website and align with the hero and icon systems of the Azure brand. The new visual brand system and brand identity will be implemented across Azures in product, website, and marketing content. Included in the system is a Figma component library, Illustrator libraries full of pre-built spot and spot hero illustrations along with an object library and a how-to-build section for net new asset creation. I also created both the content and visual design for the brand guidelines for the system. The illustrations in this system are the cornerstone of Azure's spot-and-spot hero illustrations. The system abstractly conveys concepts like security, avatars, servers, finance, and accessibility. I created the system to be ownable, simple, engaging, and easily understandable to users. 

Microsoft Azure System Ecosystem.png
Illustration Ecosystem


Spot Illustration

Spot Hero Illustration

Hero Illustration

The Azure spot illustration system is showcased at the informative level. The system is less detailed than the  hero illustration system and more detailed than the icon system.

Azure Spot Illustration Evolution
Microsoft Azure Evolution.png



Throughout the process of creating the Azure system, I did concept development, creative strategy, and art direction in tandem with the day-to-day design and illustration work. Within the system, illustrations live on four different background colors and have a consistent line weight. There are two levels of detail one simpler treatment for spot illustrations and one detailed treatment for spot hero illustrations. To ensure productivity within the system for the Azure product and marketing teams I created a Figma component library of the illustrations that are organized by category. I also mentored two mid-level designers on how to create new illustrations in the system by leveraging the object library that I built in Illustrator with hundreds of premade objects that can be built up to represent any story that they are trying to tell for the Azure brand.

Microsoft Azure Brand System Servers.png

I created a weekly PowerPoint presentation to present to leadership to show my progress, explain creative decision-making, and receive buy-in on the system.

Microsoft Azure Brand System Gradients.png

One of the biggest breakthroughs that I made was the use of complementary gradients that can work on four different backgrounds without washing out colors on any of the four backgrounds. Before making this discovery I was finding it difficult to get the gradient treatments to work well together as each object in the illustration needed to have a gradient treatment. I was able to wrangle the gradients to work together and complement each other. 

Spot and Spot hero Illustrations
Avatar Spot System
Microsoft Avatar 2.png
Server Spot System
Microsoft Azure Servers.png
Security Spot System
Microsoft Security System.png
Object Libraries
Microsoft Object Server.png
More Objects Microsoft Azure.png
Figma Component Library
Figma Microsoft Azure System.png
Microsoft Azure Guidelines.png

In conclusion, this is what my creative director had to say in a recommendation on my LinkedIn that I felt summed up the project well "It was an absolute pleasure working with Nicholas. With a methodical and disciplined approach, he quickly understood the challenges of a large and complex system. He came well prepared for every meeting, and clearly articulated the pros and cons of various approaches, resulting in a functional and creative library of illustration assets." From building and evolving brand illustration systems for Facebook, Atlassian, Lyft, Amplitude, and now Microsoft this was the largest and most complex system that I have ever worked on. In this role, I used my experience in art direction, creative strategy, content design, illustration, visual design, concept development, design thinking, Figma component libraries, Illustrator templates and toolkits, and building brand guidelines. I'm excited to see the illustrations out in the wild and to see how the system evolves. 

bottom of page