Aztec Brand

As the first Creative Director at Aztec Labs, I was tasked with the initial mission of revamping the brand and its visual identity, as well as establishing an efficient and scalable design function to successfully drive an ambitious upcoming roadmap.

The Aztec brand, as it stood, lacked a long-term strategic focus. By reassessing and redefining its brand positioning and visual identity, we aimed to future-proof Aztec's look and feel to adapt and remain effective as it grows.

The main goal was to roll out a heavily documented visual style and template bank, focusing on scalability to ease the creation of on-brand assets and consistency across various platforms and interactions. These efforts laid a solid foundation for the Aztec brand, setting it up for immediate impact and long-term sustainability.

COMPANY
Aztec Labs
YEAR
2024
TYPE
Brand

Brand story

Shining the light on privacy.

Privacy is at the heart of what Aztec does. Often, privacy is seen as something dark, mysterious, or unknown; but Aztec views it differently. For privacy to truly exist, it must have a counterpart: the public. Just as a shadow cannot exist without light, privacy cannot exist without the public. Privacy and the public are opposite but interconnected, mutually perpetuating forces. Therefore, privacy doesn’t need to be dark, mysterious, or unknown. It is also about light; it's a positive and empowering right. By showcasing the brighter side of privacy, Aztec adds a unique aspect to its brand. It's not just about their world-class team or transformative technology; they are also rethinking privacy from a philosophical standpoint.

Abstracting complexity.

As Aztec prepares to compete for developers' mindshare, the goal is to win by creating an exciting, mission-driven, and welcoming experience, with its visual identity playing a major role. Aztec is revolutionizing how Web3 functions, offering developers opportunities to redefine what’s possible in a completely new design space. Aztec enables the next wave of decentralized applications that will reshape the financial frameworks of tomorrow. Yes, building this is complex. While Aztec's visual identity can encapsulate complex ideas when necessary, there's an opportunity to balance the technical complexity. This approach makes us more accessible and allows for strategic introduction of complexity as needed. The design should not outshine the content, and Aztec's complexity doesn't need to be apparent to everyone.

An inflection point.

Aztec stands at an inflection point, a pivotal moment, and its visual identity should reflect this journey: honoring its past, mirroring its present, and hinting at its future. Aztec has a successful history, a renowned team, and a reputation for excellence — a legacy worth celebrating. However, while cherishing Aztec's past, we are not bound by it. As Aztec continues to grow, we engage in planning, analyzing, strategizing, debating, drafting, and coding, much like a sports team devising strategies to win a game. Simultaneously, we're evolving and advancing, intentionally moving towards the future. The visual identity should offer a glimpse into what the future holds for Aztec.

Brand presentation video

Brand fundamentals

Logo

When updating Aztec's visual style, the logo stayed the same. It's more than just a symbol - it's something Aztec users know and trust, showing the brand's history and values. Keeping the logo shows a commitment to this trust and quality as the brand grows.

A bright and bold palette

Aztec's color palette builds on the existing and established hues but breathes new life into them by ramping up their saturation. This creates a palette that is more vivid, lively, and full of excitement.

This evolution in our colors aligns with the brand mission to present privacy in a new, vibrant light that not only protects but also celebrates individuality. This updated palette is crafted to make Aztec stand out, generating a unique personality that shines in the crowded Web3 landscape.

As will be elaborated further on later in this document, gradients at Aztec are more than a mere design choice: they symbolize two contrasting yet connected forces, like public and private, that feed into each other, embodying the spirit of the art direction.

In practice, gradients enable a wide array of combinations, with each color smoothly transitioning into the next, to create a unified but dynamic visual experience. This approach opens up limitless possibilities that keep Aztec’s brand lively, approachable, and full of energy.

Typography

Aztec's brand uses two typefaces: Space Grotesk for headings and Inter for body text. Both are open fonts, fitting Aztec's open and decentralized values, and free from licensing issues.

Space Grotesk is a sans-serif font, unique and futuristic. It has sharp lines, bold curves, and open shapes, creating a modern and friendly look that stands out. It's perfect for making headings and titles eye-catching.

Inter is the secondary font, chosen for its readability. It balances Space Grotesk's boldness, mostly used in body text and paragraphs. Inter's clean, neutral style is great for longer texts. Its open shapes and even lines are easy to read, making content clear and enjoyable.

Iconography

Iconography is kept simple following the Brand's principle of abstracting complexity and ensure ease of understanding. By avoiding extra details, these icons don’t add cognitive load, making information processing smooth and straightforward for users.

Graphic elements & style

Gradients

From a storytelling perspective, gradients serve as a powerful visual metaphor within the Aztec brand. They are composed of multiple, interconnected colors that seamlessly blend into one another, symbolizing the relationship between the private and the public—two forces that are distinct yet inseparable.

When adding an extra dimension through motion, gradients opens up even more avenues to represent privacy.

For example, an overlaying shape within a gradient can be visible only when aligned in a certain way. A simple rotation may obscure the shape completely, yet it remains part of the design.

This interplay of visibility is emblematic of privacy—the seen and the unseen—providing a dynamic visual resource to represent the essence of what is private and what is public.

Patterns

The visual identity of Aztec incorporates patterns to represent the Project's strategic planning and development process. These patterns, similar to an architectural blueprint, utilize a variety of shapes, colors, and compositions to showcase Aztec's feature-rich value proposition and symbolize its journey towards creating intricate frameworks.

Level 1 patterns are about simplicity. Here, basic shapes and a restrained color palette come together to create straightforward patterns. These can serve as ornamental backdrops or textures, providing a subtle nod to the brand's visual identity without overwhelming the content.

aztec pattern 1aztec pattern 2aztec pattern 12aztec pattern 3aztec pattern 5aztec pattern 6aztec pattern 7aztec pattern 8aztec pattern 9aztec pattern 10aztec pattern 11aztec pattern 4aztec pattern 16aztec pattern 14aztec pattern 15aztec pattern 13
Aztec | Patterns Level 1

Level 2 patterns introduce a layer of complexity. The shapes become more intricate and combine different color hues, resulting in compositions that command more attention. These patterns are designed to be used more prominently, such as as key graphics.

aztec pattern 17aztec pattern 22aztec pattern 18aztec pattern 20aztec pattern 24aztec pattern 23aztec pattern 19aztec pattern 27aztec pattern 25aztec pattern 28aztec pattern 30aztec pattern 29aztec pattern 31aztec pattern 32aztec pattern 26aztec pattern 21
Aztec | Patterns Level 2

Furthermore, these patterns are not only designed to enhance aesthetic appeal but are also easily replicable, ensuring their consistent application across various mediums.

Aztec | Animated patterns

Aztecmojis

In some spaces, the gradient patterns may come across as too solemn or serious for the intended audience or event. Recognizing this, the Aztec brand introduces Aztecmojis for instances where a dash of playfulness is not only appropriate but beneficial.

These offbeat interventions of the main patterns and gradients allow for the incorporation of characters and figurative elements that are engaging and relatable.

Aztec | Aztecmojis

3D

3D elements symbolize the brand's forward trajectory. While gradients suggest a sense of depth, they ultimately remain two-dimensional. Transitioning these gradients into 3D space, we give them tangible volume, bringing them to life and signaling a natural progression in our design narrative, and the project itself.

In this example, showcasing Aztec’s logo in 3D allows us to reinterpret its meaning, with a block in the center that is surrounded or protected by a shield. This can tie to the concept of privacy, or something that is being protected from the outside world.

Aztec | 3D interpretation of the logo

Photography

Aztec's photography focuses on capturing the true essence of the team and Aztec-related situations with minimal digital editing. Photos are taken in natural environments such as parks, city streets, offices, or open spaces, to create a relaxed and approachable atmosphere. This less formal, more personable style complements Aztec's laid-back company culture, making subjects appear relatable and genuine. The use of natural light adds a warm, welcoming quality, while a depth of field technique accentuates the subject against varied background colors.

For headshots, the camera is positioned at eye level and directly in front, ensuring clear facial recognition, with subjects captured in natural settings, without the need for major posing.

Aztec | Staff headshots

Brand applications

Documentation banners

Documentation banners feature Level 2 patterns as their primary images, aiming to convey a technical aesthetic. These banners reflect Aztec's comprehensive features and its commitment to developing complex frameworks, as detailed in this patterns section.

Diagrams

To cater to diverse needs and contexts, we have categorized diagrams into two levels, each varying in visual complexity, allowing designers to tailor technical graphics specifically to different outlets and audiences.

Level 1 diagrams are all about simplicity and clarity. Primarily composed of primitive components and arrows, they also leverage additional visual elements such as iconography as needed. The use of color can expand to certain tones of the color palette, but the style also admits monochromatic versions.

At Level 2, diagrams transform into fully visual representations. These diagrams are highly stylized, and likely work better to depict simpler / simplified systems. They incorporate a wide range of visual elements, from intricate icons and color gradients to dynamic shapes and patterns, and various perspectives.

Stationary

Stationary elements, both printed and digital, must always incorporate established brand elements, and always prioritize legibility. Creativity in layout, favoring irregular and innovative designs, is encouraged.

Slides template

General guidelines, backgrounds, and templates were made available to keep a consistent visual language throughout the overall presentation output. Consistency not only serves to consolidate the brand, but it’s also the key value to educate an audience on how to process information.

Web

Aztec's web design is where all our brand's visuals come together, offering a user-friendly and visually engaging experience. It's crafted for easy navigation and responsiveness, ensuring a seamless and enjoyable journey on any device.

aztec home page previewaztec noir page previewaztec 404 page previewaztec website previewaztec grants page previewaztec blog previewaztec blog post preview
Aztec | Website screens (copy not final)

Aztec's website features and related materials merge the various graphics and techniques of our main brand, along with some crafted visual extensions. This approach is especially notable in our blog, which is further detailed below.

Aztec | Website open graphs

Blog visuals

The vision for Aztec's blog visuals is to construct a distinct, immersive universe that complements the blog content, creating a special experience for readers. While the overall aesthetics align with the core brand through its color palette and overarching themes, it introduces a more narrative-driven and richly detailed environment. This approach is designed to engage readers in a way that goes beyond standard blog visuals, making each article  a journey into a crafted world.

The theme of this universe evolves the historical Aztec style that have been so well-received both internally and externally, helping the brand to embrace Aztec's legacy. We envision a futuristic space populated with gender-neutral characters, employing an outlined style that exudes a sense of craftsmanship and attention to detail.

wtf is aztec blog banneraztec is going open source blog banneraztec noir libraries blog banneraztec client side proof generation blog banneraztec improving sandbox blog banneraztec request for comments blog banneraztec sandbox alpha partner program blog banneraztec regeneration blog banneraztec announcing noir js blog banner
Aztec | Blog visuals

To bring this intricate and unique illustration style to life in a resource-efficient way we decided to leverage artificial intelligence. This approach allowed the Design team to maintain the high quality and detail of Aztec's visual style while enabling it to scale our efforts efficiently.

Various marketing applications

Version releases

Graphic to promote releases for the Aztec Sandbox and Noir on social media.

RFP Announcements

Animated loop to promote Request for Proposals (RFP) announcements on social media.

Aztec | RFP Announcement animation template

RFP Selections

Animated loop to promote and/or communicate Request for Proposals (RFP) selections on social media.

Aztec | RFP Selection animation template

Newsletter headers

Header images for the Developer Dispatch newsletter.

Developer Dispatch visuals

The background illustrations, which follow the principles of Level 2 illustrations, can be abstract or figurative, depSimilarly to the universe created for the Blog thumbnails, the Developer Dispatch thumbnails feature a world inspired by the Aztecs, filled with bright colors and bold shapes.

The style combines the grand structures of Aztec architecture with the wild beauty of nature. Figures in traditional dress appear against these scenes, blending ancient culture with a modern touch.ending on the topic. These are colored using gradients from the secondary palette to avoid high contrast. This system balances a content-first approach aimed at maximizing conversions, while also providing designers the creative freedom to add variety and counteract banner fatigue.

aztec developer dispatch 2023 year banneraztec developer dispatch tech brief banneraztec developer dispatch aztec is growing banneraztec developer dispatch announcing noir js banner
Chainlink | Developer Dispatch visuals

Partnerships

Animated loop to promote and/or communicate partnerships. For enhanced visual appeal and to emphasize Aztec's decentralized ethos, these promotional pieces incorporate branded elements from the projects Aztec is partnering with.

Aztec | Partnership animation template

Various banners

Aztec | HONK special edition social media .gif

Job of the week

Animated loop to promote featured Aztec open positions on social media.

Aztec | Job of the week animation template

Team spotlight

Animated loop to promote Aztec team members on social media.

Aztec | Job of the week animation template

Merch and swag

Swag is essential in shaping a Web3 brand like Aztec, significantly influencing its brand identity. At Aztec, the power of the swag comes from both its design and the careful choice of items, always reflecting our ethos and fostering positive connections.

In creating swag, designers were encouraged to balance between utilizing existing brand elements and being playful by intervining existing assets, such as the Aztec logo.

aztec t-shirt 1 mockupaztec t-shirt 2 mockupaztec t-shirt 3 mockupaztec t-shirt 6 mockupaztec t-shirt 4 mockupaztec t-shirt 5 mockup goblin plonk
Aztec | T-shirts

More projects