Project Name
What is GIS?

Making complex technology accessible to new audiences

Client
Esri

Role
Creative and Art Direction, UX UI Design, Content Strategy

Skills
Visual Storytelling & Storyboarding, Wireframing, Motion Design


The Goal

Create an easy-to-understand explanation of GIS

As the leader in GIS (Geographic Information System) software, Esri needed to reimagine What is GIS?, a brand-level marketing website, to help executive audiences understand the potential of GIS in their organization, increasing awareness and understanding of geospatial tech.

The work behind the work

This wasn’t just a website. It was a chance to reframe how a 50-year-old tech company tells the story of its core technology.

In addition to leading the design, I facilitated cross-functional workshops, delivered executive pitches, and kept the team aligned and energized through a complex, months-long effort.

Here’s how I led the team.

    • Facilitated cross-functional workshops and brainstorms to clarify the abstract problem space.

    • Created pitch decks and storyboards to gather executive buy-in early, setting a clear direction before production began.

    • Challenged legacy beliefs about how GIS “should” be explained by proposing a simpler approach, even though it went against internal norms

    • Led the concepting phase with early moodboards, wireframes, and storyboards that determined the visual direction and tone.

    • Defined the visual strategy and stories for all animations and illustrations, partnering with internal motion designers and UK-based studio 422 South.

    • Oversaw design consistency across every touchpoint–web, animation, and post-launch advertising.

    • Set a new tone for brand storytelling within Esri’s digital ecosystem.

    • Gently (and sometimes not-so-gently) redirected the team away from reused solutions and back toward user-centered thinking.

    • Used research as a guidepost to keep pushing toward better, clearer outcomes, especially as the going got tough.

    • Leaned on my teaching experience and applied knowledge about how people learn new ideas to inform content and design decisions.

Scroll-activated storytelling puts learning in the hands of the user.

To introduce GIS concepts intuitively, I proposed a progressive disclosure model, structuring the introduction as an interactive story that builds understanding in stages.

Simplifying the visual message using color

I removed all visual detail that wasn’t critical to the main idea. All maps and backgrounds are muted, monochromatic, and dark, making GIS data vibrant—the visual hero.

The Outcome

  • Higher engagement

    In the first 90 days, bounce rate decreased by 23%. The amount of time spent per page increased by 45%.

  • Increased traffic 97%

    Site visits increased by 97% in 90 days, adding hundreds of thousands of visitors.

  • #1 Search Result

    SEO-optimized to maintain the #1 search result for ‘What is GIS?‘.

The Process

User research drove every design decision


Before and After

Both user groups struggled with jargon, content density and complexity. GIS in their organization, increasing awareness and understanding of geospatial tech.

Defining the Problem

A UX analysis of the old What is GIS? site revealed that the order and detail of information left users confused. The information wasn’t clearly communicated, verbally or visually.

If I had no awareness of what GIS was, this (definition) gives me a high level understanding . Would I understand it right out of the gate from reading that? Probably not. Until I actually did something with the product that light bulb moment would never happen for me.
— User research participant
First thing I saw was this little picture up here which to me doesn’t describe anything. Looks pretty but it doesn’t give me any more information.
— User research participant

Motion Strategy

We distilled the definition of GIS into a three-part explanation that would be effective for an broad audience. To make sure the visuals were as effective as possible, I created the framework below that defines the visual language based on using symbols that had the most clear and universal meaning.

Progression of Fidelity

Storyboards

Along with the initial animation defining GIS, we also created 5 animations to showcase its use cases. I storyboarded the animations and 422 South brought these animations to life using real GIS data.

Next
Next

Esri.com Art Direction