Esri.com Art Direction
Creating a visual storytelling framework that meets users where they are
The Goal
Develop a visual language to meaningfully unify 5K+ web pages across Esri.com
As one of the world’s largest enterprise SaaS tech companies, Esri’s marketing website serves over 2M visitors annually, catering to a diverse audience of newcomers and GIS power users. Leveraging user research and performance data, I led a complete reimagining of the site’s art direction strategy to better meet the needs of all users.
The work behind the work
Beyond the visual design, this project included many pitch decks, philosophical conversations about the future of Esri.com, and strategic thinking that helped bring the vision to life.
I played a key role from initial research through final rollout—leading both the design strategy and the operational path to adoption. Here’s what I contributed over the course of a year:
-
Comprehensive audit of Esri.com to identify inconsistencies and pain points
Competitive analysis to benchmark against industry best practices
Conducted stakeholder interviews to identify opportunities from diverse perspectives
Clearly defined the problem space and surfaced areas where legacy thinking was limiting impact
Presented insights and recommendations to leadership, generating interest in a large-scale solution
-
Defined visual strategy based on audience needs across the user journey, from discovery to adoption
Created concept art that redefined our approach to visual storytelling and brand expression
Designed high-fidelity mockups to stress test scalability across use cases
Designed systems-level artifacts to demonstrate how the new strategy scales across Esri’s digital experiences
Led the creation of a style guide covering foundational elements like imagery, product visuals, and illustration
-
Proposed and implemented changes to project workflows that empowered better cross-functional collaboration
Facilitated working sessions with designers and stakeholders to iterate transparently and build alignment early
Delivered targeted presentations to executive leadership to build confidence in the new direction and secure alignment
Presentation decks and recordings available upon request
Led the organization-wide rollout of the new style guide, presenting to design, marketing, and product teams to ensure clarity and buy-in
Currently serve in an advisory role to maintain quality and consistency as adoption continues to scale across Esri.com
The Solution
Tell the right visual story at the right time
Establishing when to show what to who was key to meeting the needs of a broad audience. New users, unfamiliar with the technology, should be served visuals they can relate to. Similarly, a GIS-savvy audience needs more technical detail.
Visual Hierarchy
A flexible, but cohesive, system
This framework works for any use case across brand campaigns, industry solutions, and product marketing, and other verticals on Esri.com.
Scalable Templates
Patterns of use help designers and writers work quickly without compromising quality.
Visual Language
Showing real-world applications makes the technology relatable.
My research found that when a graphic showed GIS data in context of the real world, people just got it. I proposed we use conceptual representations of GIS to show the landscape changes over time, how a drone captures imagery data, shipping routes in a popular port, and more.
Product Visualization
Knowing what to leave out is just as important as knowing what to include.
Including too much technical detail risks losing a non-GIS-savvy audience by overwhelming them with information they can’t easily understand. I created this breakdown of the different types of visualization styles for different audiences.
Visual Language
More maps, less stock photos
Our research showed that cards with maps were getting clicked much more than cards with generic stock photos, so I pushed for the decision to prioritize using maps. The team hired multiple cartographic designers to support this effort.
The Impact
-
First site-wide style guide (ever)
I led the development of a comprehensive guide that impacts an entire department of 30+ web designers.
-
Improved scalability and velocity
The larger the project, the simpler the design, making large-scale efforts faster to execute.
-
A shift in design culture at Esri
Our design team has more trust, less push back, and a wider sphere of influence than ever before.
The Esri.com Art Direction Style Guide
Design philosophy
Typography
Color
Maps
Photography
Branding elements
Graphic elements
Visual language
Icons and illustration style
Product visualization and usage
Showcase of applications
-
Esri Store
Design: Amanda McKinley
-
New York Times Paid Post
Design: New York Times Brand Studio
2025 Webby Honoree -
Infrastructure Management
Design: Amanda McKinley
-
GIS for Good
Design: Amanda McKinley
The Process
Content Audits
How did we get here?
We migrated Esri.com to Adobe Experience Manager (AEM) in 2016, but there was no real centralized design system to ensure a cohesive look and feel. By 2021, much of the migration was complete, but the site’s visual design had become fragmented.
I conducted a comprehensive audit of major page types to catalog UI patterns, art direction styles, and evaluate the effectiveness of content communication across the site.
Audit of Esri.com
Major page types were visually inconsistent in the use of color, photography, and style
Stakeholder Interviews
Uncovering design and culture challenges
I conducted interviews with experts across business units to gather as many perspectives as possible and to plant seeds of the change to come. It became clear that we’d need to make some big changes to the visuals we create, how we work together, and how we think about design in our organization.
“The number one problem Esri’s been trying to solve is how do we get people to understand what we do? People should visit our pages and think, ‘I didn’t know that maps are works of art that give me amazing information’.
If we can change that, just that fundamental level, I think that would be success.”
“Designers are disconnected from actually
using our software.”
“One of our challenges is that we buy into a visual direction, but then we move on from it so quickly...We deal with the symptoms of leadership being attracted to the next shiny object.”
“If we are using stock imagery and there’s a person next to a map, how is that end user going to connect the two right off the bat? Can they understand the message right away?”
Mapping the Solution
Visual strategy based on the user journey
I wanted our visual language to be based on the user’s relationship to site content. New users in the Discover path on brand-level pages should be served more conceptual content, while current users will resonate more with technical details and workflows.
Design Operations
Empowering design at scale means better communication, clear roles and responsibilities
We wanted to improve how our designers were collaborating with cross-functional teams, so I created guidelines around how we work together to stay aligned, but also avoid creative by committee. We later hired a Design Ops specialist to help with this effort.