Pacific Science Center

Igniting curiosity

Project Type

New Website Design

My Role

UX Lead and UI Support

Technology

WordPress, TNEW for ticketing

Tools

Figma

Team Credits

  • Project Manager: Jess Furmanski

  • Account Manager: Christine Perlick

  • Solutions Architect: Kendall Sanchez Reonal

  • User Experience: Maddie Purcell

  • Visual Design: Kim Locraft, Christy Rosenlund

  • SEO & Digital Strategy: Steven Bond

  • Analytics: Ellen Hoffman

  • Tech Lead: Cody Pitts

  • Back-End Dev: Elvis Morales

  • Front-End Devs: Matt Humphrey, Jack Gold

  • Quality Assurance: George Marshall

Date launched: June 2022

The Client

The Pacific Science Center is an educational, independent, not-for-profit science and technology center that serves nearly 1 million people in Seattle and beyond each year. PacSci is also known for housing the largest IMAX screen in Washington state.

Target Users

Primary: Local Visitors (Families, Adults, Groups), Education Visitors (Teachers and school groups, Informal education groups), Tourists, and Donors (Individuals, families, corporations)

Secondary: Partners (STEAM Professionals, Companies and Institutions, Entrepreneurs), Media, Current and prospective staff, and Teens

Client’s Goals

Pacific Science Center’s mission is to ignite curiosity in every child and fuel a passion for discovery, experimentation, and critical thinking in all of us.

To sustain their mission, PacSci wanted to grow their membership base, offer new membership tiers to better align the value of membership to the cost, and increase profitability.

Project Goals

  • Create seamless purchase experiences for general admissions, theater tickets, memberships, and donations.

  • Connect audiences to digital programming, such as online events, virtual field trips, and science activities to do at home.

  • Support in-person visitors by setting expectations and answering visitor questions.

  • Be a welcoming place for BIPOC audiences and single adults (not just families).

  • Support PacSci’s brand.

Challenges

This project kicked off during COVID, a time in which the science center was closed to in-person visitors. This meant we did not know when the center would reopen, and whenever they would reopen, we did not know which exhibits the center would have. We were designing for an uncertain future - one that could have taken many different shapes.

Key Takeaways

During this project, I gained experience running design validation testing - interviewing users to gather feedback on visual designs.

The Process

Discover

  • Ecosystem Audit

  • Content & Analytics Audit

  • Market Research

  • CEO Stakeholder Interview

  • Discovery Workshops

  • Brand & Design Survey

Design

  • Site Map

  • Wireframes

  • Usability Testing

  • Visual Design

  • Design Validation Testing

  • Content Model

Deliver

  • Development & Quality Assurance

  • Content Loading & Testing

Launch

  • Go Live

  • Post-Launch Tweaks

Discovery Research

Ecosystem Audit

Our team reviewed the current technical ecosystem that Pacific Science Center exists across, including social media, donation platforms and editorial tools, to ensure we capture cross-platform requirements.

Brand & Design Survey

Our team reviewed PacSci’s brand guidelines; sent a web brand survey out to internal stakeholders to develop an understanding of brand cohesion and goals for look & feel.

CEO Stakeholder Interview

I joined an informational conversation with CEO Will Dougherty to gather an understanding of PacSci’s strategic direction from a high-level, including existing pain points, and blue-sky ideas.

Market Research

Our team reviewed the websites and digital offerings for comparators in order to understand the landscape to better advise PacSci’s strategy looking ahead.

Content & Analytics Audit

Our team pulled a content inventory detailing content relationships and content performance to better understand what is currently working and what isn’t in terms of content topics across the site.

Discovery Workshops

I ran an Audience Analysis and Goals workshop with internal stakeholders, gathering insights around their content needs, goals for interacting with PacSci, and barriers to achieving these goals.

Site Map

We kicked off the design phase with delivery of our site map. I created the site map using UX best practices, knowledge of which pages received the most and least traffic on the current site, and knowledge of how comparator sites were naming and organizing their pages. Our site map was also designed with audience needs in mind and included succinct and clear menu labels.

UX Best Practices

  • No more than 7 main menu items

  • No more than 4 levels deep

  • Succinct & clear labels

Wireframes

Next, I created wireframes in Figma for our main landing pages, key basic pages, and content type detail pages. During wireframes, I focused on the goals of each page, the content hierarchy, the main actions, and the user journeys. I added hotspots to create a clickable prototype, which made it easy to click around and experience the prototyped user journeys.

Usability Testing

After incorporating client feedback into the wireframes, I did a light round of moderated usability testing with five participants, recruited by PacSci. Our participants included 4 PacSci members and a potential member who had never been to PacSci.

What We Tested

  • Exhibits, IMAX Movies, Events

  • General Visitor Information - Hours, Health & Safety, Photography Policies

  • Visit Page

  • Educational Resources, Camps, and Virtual Field Trips

  • Home Page

What We Learned

All participants were able to complete every task asked of them, indicating that the labels of our menu items and organization of content performed well.

We also received really helpful feedback about the content, including the suggestion to add more details to what is included in the general admission ticket, and what costs extra.

Visual Design

Next, I coordinated with Kim and Christy, who led the visual design of this project. Together, we talked through the intent of each component and gave each other feedback on the designs that were created. Visually, our goals were to reflect the PacSci brand and create a website that is: Playful, Relevant, Curious, Inquisitive, and Inclusive.

Design Validation Testing

To get user input on our designs, we selected some of the wireframes and turned them into full page designs. We then tested these designs with users; I led some of the tests and took notes during others.

Purpose of Testing

  • Evaluate the effectiveness of the design with PacSci’s growth audiences, especially people who are Black, Indigenous, Hispanic/Latino, Asian and Non-Parents. We want to see if these audiences feel that this website is for them and if PacSci is a place for them.

  • Gain insights into content that will help PacSci engage its growth audience, such as what kinds of exhibits you pursue in the future, what types of events you host, and what kinds of resources your audiences are interested in.

  • Compare and contrast between reactions and interests of non-parents and parents.

What We Tested

A design prototype for the new PacSci website was shared with participants. The test consisted of tasks aimed at testing the following key areas of the website. We also asked a few follow up questions.

  • Tropical Butterfly House, Exhibits

  • Events Landing Page, Calendar

  • Visit, Home Page

  • Resources Listing Page, Resource Detail Page

Who We Tested With

We recruited participants from userinterviews.com. We tested with 7 non-parents and 4 parents, all of whom were BIPOC and lived within two hours of the Seattle Center. Participants also had varying knowledge of PacSci - some had never heard of the center, others had known of PacSci for a few years, and others had known of PacSci for over 10 years.

What We Learned

Our findings were overwhelmingly positive and we received great feedback on both the content, the images, and the visuals. Participants who saw people who looked like them in the photos were especially pleased and said they felt welcome at the science center. We found that the visual design supported users in being able to navigate the site and find the content we asked them about. We also got helpful suggestions on what new events and exhibits our participants would like to see at PacSci, as well as suggestions for additional content tweaks.

Content Model

To translate our wireframes into an editable content management system, I led and collaborated with our tech lead, Cody, to create our content model spreadsheet. We identified our content types and their fields and outlined the taxonomy categories and terms that we would have.

I also contributed to creating a “Design Elements Guide” in which we outlined all of the fields for each WordPress block that content editors would have in their library of components for building out pages. These fields were alongside the screenshot of the design, and we included notes around character count limits and image dimensions to help content editors.

Development & Quality Assurance

During development, I was less involved, but I did join review meetings occasionally and did design QA when necessary.

Content Loading & Testing

I was not involved in this phase of the project, but our project manager and the client did use a site map spreadsheet, the “Design Elements Guide,” and our wireframes and designs to help them plan and enter content.

Launch

The new website launched at the end of June 2022, with great success. At this time, covid restrictions were loosening up and PacSci was able to welcome visitors. They also hosted their summer after-hours 21+ events. Users bought tickets for these events through the website and its integration with TNEW, and many of the events even sold out!