The California chapter of The Nature Conservancy was redesigning its website, conserveca.org, from the ground-up with a new look and feel and needed to ensure that user experience was a key component of the redesign strategy.
I served as user experience lead of the chapter’s web team and created resources to help strategize the site redesign and provide the design agency we hired with critical information about the site’s audiences as well as the desired direction of the updated look and feel.
I spearheaded the user experience effort by conducting design research and creating personas, user journey maps, and an “ideal web experience” framework to serve as foundational materials for the website redesign.
Once the website’s design system was created by the agency, the California chapter needed fresh stories that employed the design language of its updated look and feel. I created mockups for these new story layouts, selecting photos, pull quotes, and other elements that would provide readers with a rich online experience.
Production Design & Photo Selection
As the trusted eye for on-brand photo selection and the internal UX lead, I implemented the updated look and feel in story layouts on the new website.
I selected photos to entice users and help tell a compelling conservation story. Some of the criteria I used to select photos were appropriateness for the story’s content; interesting composition; natural and vibrant colors; distinctiveness (different from photos used in other web stories); and specific composition areas (that would accommodate the fixed placement of the story’s title and subtitle, as well as the color gradient along the bottom edge of the hero image).
Working with copy from the content leads, I chose details to illustrate with inline and sidebar images (and slideshows) and selected content to feature as pull-quotes. By thoughtful laying out imagery, quotes, and copy with a UX perspective, I increased the story’s readability and offered users a variety of ways to consume the content.
In addition to creating production-ready mockups, I improved the marketing team’s web production process by creating a system to hand off all final materials and specifications (copy, images, credits, captions, graphics, etc.) to the developer, moderating the review-and-approval process, and conducting QA for design and functionality. I instituted a new design tool for the team (Sketch), and taught myself it to create mockups for the developer.
Here are a links to a few stories that have been published:
Personas and User Journeys
I created ten user journeys to illustrate the paths of different audiences’ engagement with the planned marketing campaign. Creating personas based on existing and desired audiences and conducting stakeholder interviews, I created journey maps to illustrate the stages of each persona’s engagement with the California chapter of the Nature Conservancy, indicating highlights and pain points along their journey and featuring snippets of what the persona would think, feel, and do at each stage. For example, one journey depicted how someone new to the organization could engage with media content (planned as part of the marketing campaign) and eventually sign up for email on the chapter’s website. These materials served as agreed-upon documents for the marketing and web team to strategize and garner buy-in for the website redesign project.
Ideal Web Experience Framework
I conceptualized and created an ideal web experience framework to provide a basis for discussion about the development of an updated look and feel for the marketing campaign. Working closely with the creative director, I conducted extensive design research and selected UI/UX elements, interactivity, features, and styling that would (and would not) be appropriate for the new site. This document served as a centralized design strategy document for our web team and helped onboard the design agency we hired to design the website and updated look and feel.
The user journey maps and ideal web experience document served as foundational materials for the ground-up redesign of the California chapter’s website, conserveca.org. The design agency remarked that the documents were very helpful and were part of the best onboarding packet they had ever received from a client; the materials saved them costly research time and provided context for the thought that had already been done about the website strategy.
The process of creating these materials enabled our web team to create a shared vision for the website redesign, enabled input and garnered buy-in from internal stakeholders, and helped ensure that the ultimate design of the new site was in line with the goals we set out to achieve.
As a result of my work on the website stories, the stories featured photos that strongly represented the Conservancy’s photography-centric brand and were designed with a UX perspective that had previously not been part of the process. I contributed new design and UX support to the production process, allowing the creative director to focus on other projects, and making the production process more efficient by providing clear design direction and a system for handing off final materials for development.