The Providence Zen Center

The Providence Zen Center is a 501(c)3 nonprofit that focuses on promoting well-being through Zen practice. My job is to design and build a new website.

PZC_Meditation_Screenshot

USER NEEDS

BUSINESS NEEDS

How might we ensure that future and current students of Zen can use the site to sign up for retreats/guest stays/rentals and to give donations to help keep the Providence Zen Center open and operating?

In this case study, I’ll walk you through my process, and how I designed a new information architecture, created new pages with new content, and modernized the site.

Research & Interviews

What was the challenge?

I interviewed the director of the Providence Zen Center in formal and informal settings to learn more about what he desired as a final product.

sitting1

So, what did I do? Stakeholder Interviews!

I conducted stakeholder interviews, where I asked questions about the business, operations, goals, and what the director hoped to improve with the redesign. There were three main takeaways.

Modernization

The new site needs to work and feel like a site from 2023. That meant speeding up the loading times on the site and creating updated designs.

Ease of Use

The new site needs to be easy to use for everyone – the director, current users, future users, and organizations they would want to partner with. 

Accessibility

The site needs to be easier to navigate, as well as make the Zen practice easily understood by newcomers. Right now, it all seems too complex.

User Interviews

I conducted user interviews and then created archetypes based on the users I spoke with. I interviewed 15 people in total: 6 long time members, 5 first time visitors, and 4 college students. I utilized a flexible script and impromptu and scheduled (Zoom) interviews. Three major themes emerged.

Authenticity

Users want to feel like the site is really Zen, that it does not feel too corporate. It should convey the feelings of tranquility and peace.

Trust

Users need to feel like they can trust the Providence Zen Center, and that would require more information, which the current site is lacking.

Accessibility

The new site needs to use language that explains and presents info in a way that makes it feel more accessible to everyone, as well as needing designs that are easy to use.

New Information Architecture

What was the challenge?

I needed to take stock of what currently exists on the site, so that I could know what was already there, and what was missing when creating my new information architecture (IA).

So what did I do? Conducted a Content Inventory & Audit.

The organization’s SEO was severely diluted due to having many low-utilization and outdated pages and by having 958 event pages. There were 30 core pages in total.

This is a high level overview of the FigJam board that was used to determine the information architecture of the new Providence Zen Center site. The blue square represents the home page, the orange squares represent the menu items, the purple squares are the submenu items, the green squares are the headers on each page, and pink squares represent the content.

Initial Information Architecture: This image shows the first iteration of the new information architecture in a FigJam board. 

Audit Takeaway #1: Removing Unnecessary Pages

There were many pages that currently are not needed on the site, so I decided they would not be in the new IA. I also decided to use a different plugin for creating events, and using Google Forms for accepting retreat and rentals applications to keep track of payments better.

Audit Takeaway #2: Addressing Business Needs

The business needs (including: receiving more donations, getting more rentals, outreach with other organizations) need to be addressed in the new IA, meaning that there has to be an emphasis on having the user consider supporting the Zen Center.

Audit Takeaway #3: Identified Gaps

In my content inventory and audit, I saw there was no information for new visitors to understand what to expect when visiting the Zen Center, and there are no descriptions of what the Zen Center teaches on the site. Based on my user interviews, this was shown to be important for users.

The blue card stands for the Homepage, which then branch down to six orange cards: About Us, Meditation Schedule, Programs, Rentals & Stays, Get Involved, and Contact Us. The purple pages below About Us are: Who We Are, Our History, What We Teach, and Info For Newcomers. Under the Meditation Schedule are the pages: In-Person Meditation Schedule, Online Meditation Schedule, and Daily Calendar. Under Programs are the pages: Retreats, Kyol Che, Workshops & Classes, & Events Calendar. Under Rentals & Stays, there are the pages: Rental Spaces, Guest Stays & Guest Residency, and Residency. Under Get Involved, there are the pages: Donate, Volunteer, and Membership. There are no pages below Contact Us.

The final information architecture that I decided upon was a culmination of the results from the user interviews and usability testing.

Wireframes

What was the challenge?

I had to use the new information architecture and create the new designs for new and old pages.

Screenshot-2023-07-07-at-4.23.48-PM
Screenshot-2023-06-12-at-10.33.01-AM

So, what did I do? Wireframes!

While creating wireframes, I was keeping the three types of users in mind at all times, especially focusing on the fact that many new and familiar faces at the Zen Center are coming from older generations.

While creating these wireframes, I focused on...

Accessibility

The main issues that I worried about were: How would users from older generations be able to use the site? How would someone landing on the site for the first time understand Zen?

User Needs

I kept the user needs and the user archetypes at the forefront of my mind at all times – who was I designing for? What would they need to know? What don’t they know already?

Business Goals

The purpose of the site is to not only bring new people to the Providence Zen Center, but to help the Providence Zen Center to be able to afford various repairs, such as for the roof.

Usability Tests

What was the challenge?

I needed to see if my wireframes were actually going to be received well by users, so it was time to show these designs to actual users.

So, what did I do? Usability tests!

I created a script and interviewed users who were actual users of the site, as well as users who have never seen or heard of the the Providence Zen Center before, which gave me a great range of responses.

Screenshot-2023-07-07-at-11.03.19-AM

From the usability tests, I discovered the designs...

Needed Some Content Improvements

The majority of issues came from people feeling that there still was not enough information, a need for more clarity in labels and copy, and less use of passive voice.

Still Needed Some Work on Ease of Use

The wireframes were still somewhat difficult for users to navigate – some users ended up getting stuck in certain loops and could not find their way to where they wanted to go.

Still Were Better Than the Current Site!

Overall, the users considered the new designs as better than what has been the current site. The users found the content and information presented to be far more understandable and easier to use.

Branding Concepts

What was the challenge?

I had to create a new design system for the website and for all branded materials.

PZC_Logo_Organic_Final

This logo is based on the "Organic" branding concept. The inspiration of this logo came from the apple trees that bloom yearly at the PZC, and the three flowers and three buds represent different groups of three that have significant meaning in Zen. 

PZC_Logo_Lotus_Alone

This logo is also based on the "Organic" branding concept. There are three Zen circles below the lotus flower. The lotus is a frequently used symbol in Buddhism. The imperfect symmetry of this flower is meant to reflect the way that reality is - it is not perfect, but it is complete as it is.

A logo with a black circle around a meditating figure that is combined with the shape of a lotus flower. Two Zen circles are placed next to the meditating figure and one Zen circle is placed strategically to make it appear like the meditator's hands at their naval. Beneath the figure are the letters PZC.

This logo is based on the "Peacefulness" branding concept. The logo has a meditating figure in the middle, embedded with a lotus flower. The fact that the figure is meditating demonstrates a major part of what the Providence Zen Center offers - meditation in a tranquil setting.

An Unexpected Twist

What was the challenge?

I presented my work to the stakeholder. I needed to take the data gathered from usability tests, user interviews, and stakeholder interviews, and synthesize these for my final designs.

So, what did I do? Leaned on my Agile skills!

After I presented my work and findings from the usability tests to the stakeholder and received feedback that was unexpected, I made sure to take that information, pivot, and iterate on my previous designs to improve.

Color-Scheme

Embracing The Suck

Sometimes, the feedback is not always positive. To quote the stakeholder directly, “I don’t like blue.” So that meant that I had to find colors that still reflected the Providence Zen Center and the concept of Zen (even though blue was in every branding option I had offered).

New Competitive Analysis

The stakeholder also wanted to use a new organization’s website as inspiration for the site, which meant drastically changing the layout of my designs. However, I was already prepared for his change of mind, and was ready to take on anything.

New Business Strategy

I was working on a different project for the Global Justice Ecology Project, and when conducting a competitive analysis for that organization, I discovered that there were ways that users could donate to the Zen Center that had not been considered or used before.

Final User Interface Designs

What was the challenge?

I needed to ensure that the final user interface (UI) designs were going to improve upon the wireframes, meet the stakeholder's needs, meet the users' needs, and use the new branding.

Screenshot-2023-09-11-at-1.45.24-PM

So, what did I do? Synthesized everything!

I made sure that my final user interface designs integrated everything I had learned from the user interviews, usability tests, and stakeholder feedback. I discovered that there were components that the organization whose website the stakeholder wanted to emulate the "feel" of that I could create and make into my own. I also made sure that my new UI factored in the final information architecture and the finalized copy that I wrote based on the fact that users wanted more information.

Screenshot-2023-07-11-at-2.28.22-PM
Screenshot-2023-07-11-at-11.07.34-AM

Next Steps

The site is going to be developed in Wordpress starting from scratch. It will be optimized to be as fast and lightweight as possible, with as few plugins as possible. I will be building the frontend using HTML, CSS, and JavaScript.

Like what you've seen? Then please reach out to let me know!

Selected Works

The Providence Zen CenterUX Research & Design

FanFindrUX Design

ChurchSpaceUX Research & Design

Global Justice Ecology ProjectUX Research & Design

Contact

© Serena Entezary 2023
UX Researcher & Designer

"Let yourself be silently drawn by the strange pull of what you really love. It will not lead you astray."

– Molana Rumi