Amaterasu Za is a New York City-based nonprofit performing arts organization that offers bilingual Japanese-English performances, classes, workshops, and online events promoting cultural exchange. They have an extremely passionate, captive audience for their unique offerings, but information on the website is difficult to find. Since this organization is close to my heart, I worked on a pro-bono proposal to transform their basic website into a beautiful showcase that more accurately effects the quality and cultural richness of their projects.
Skip to prototype
Client:
Amaterasu Za
ROLE:
Sole UX & visual designer, interfacing directly with stakeholders
YEAR:
2021
Amaterasu Za has a very niche audience of theater and Japanese culture enthusiasts, but they are also very passionate, and their excitement upon finding something that perfectly caters to their interests leads to high conversion. As such, the biggest challenges of this redesign are:
With the aforementioned goals in mind, I sought to answer the following questions via user research and competitive analysis:
What entices someone to participate in a local or online theater event?
What information does a site user need in order to feel comfortable donating?
What are some of the pain points of the current Amaterasu Za website?
What are comparable organizations doing successfully in their online presence to attract interest and donations?
I recruited 5 research participants via social media who are interested in theater, particularly Japanese theater forms; fluent in English, and either fluent in or currently studying Japanese; and have donated to the arts. Via video conference, I asked some general questions, and we walked through the current Amaterasu Za website together while I collected their impressions.
To bring some clarity and organization to the insights gleaned from the user interviews, I summarized the feedback into user stories.
I also synthesized the insights from the interviews into a typical user persona for easy visual reference.
I then further visualized the insights into an empathy map to share with the client.
At this point I wanted to be able to demonstrate to the client the emotional factors involved in making a decision to donate to a nonprofit, especially to the arts. I illustrated the typical participant's emotional journey from discovery to donation with a user journey map.
As my research continually highlighted the importance of discoverability, and the challenges/frustrations experienced by both performing arts organizations and fans during the pandemic, I investigated the web presences of some comparable organizations to see how they were handling not only their websites, but their social media and pandemic programming as well.
The main CTAs for the website are enticing donations, class sign-ups, and, post-pandemic, purchasing tickets to performances. Donations are handled via a third-party website, so my goal was simply to provide as clear and direct a path to donation as possible. For the current project scope, I also designed a user flow for a calendar-based class sign-up.
The most common feedback from the interviews, other than more pictures, was that information was difficult to find. I made sure to develop information architecture that both followed expected patterns and worked for the existing content on Amaterasu Za's site.
The insights I gained from the interview process indicated that when it comes to theater, an organization's social media accounts are as important if not more important than its website. Nearly all participants interviewed said they get their performing arts news and updates via social media, and will check an organization's profiles for additional photos and videos.
I thus determined that it would be prudent to include a social media proposal as part of the user experience design process. I collaborated with a social media specialist to come up with a presentation.
Amaterasu Za's founder already had a logo that she was eager to continue using, but no other brand guidelines had been established. We began the UI design process by working together to solidify Amaterasu Za's brand voice via both verbal discussion and a collaborative mood board.
Next, I roughly sketched out some layout ideas for the home page, class and project pages, and an events calendar.
Then, I mocked up a home page in two possible color schemes based on our mood board. The client preferred the green/gold option.
With the chosen color scheme, I established comprehensive brand rules and created a style guide.
Before
After
Using the desktop prototype, I conducted both unmoderated and moderated testing of the website redesign. Participants included all interview subjects from the user research phase plus two new volunteers. Participants were tasked with learning about Amaterasu Za and signing up for a class. The prototype yielded a 100% success rate, and received a great deal of positive feedback, especially from those who had also tested the previous website.
"It's really elegant and lots of information is conveyed (through words & pictures) without having to search hard for it. I really get the impression that their mission is to create a space to share/promote/celebrate Japanese theatre and culture in New York. While the words are what explains this, the design/pictures is what emphasizes the Japanese focus of the company"
"It looks great and everything was where I expected to find it. The typography is amazing—love the clean look. Overall very well done, the calendar scheduling was easy and I only saw the dates that were relevant- not a full month calendar, so that was nice. I was going to comment on an 'add to calendar' link but I guess it is redundant since the zoom link will come with that information. Nicely done!"
"Really love the branding direction. Looks artistic, fun, and welcoming. The visual hierarchy is great as well. I didn't read everything written but it was easily scannable. Overall, I think this is great work!"
"Very easy to navigate and the pictures really help the viewer to understand what Amaterasu Za is all about!"
