cbcop cover.png


CBCOP, Chinese Bible Church of Oak Park, are:

Chinese based







As CBCOP plan to grow and move to another location, we targeted the website as a tool to attract new potential members.

My Role

  • Research Synthesis
  • Ideation
  • Digital Wireframing
  • Prototype
  • User Testing
  • Front-end Development
  • Project Visuals


  • Axure RP
  • Photoshop
  • Illustrator
  • HTML & CSS


  • Personas
  • User journey
  • Site map
  • Wireframe
  • Prototype
  • Final website


The Approach

Since September 2016, I developed a temporary website for CBCOP as a placeholder during the transition time. I conducted interviews with church members to understand the strength of CBCOP and their experience of finding a church. I also tested the temporary website and talked with my non-member, Chinese immigrant friends to understand their needs and pain points when finding a new church.

Interview with Church Members

Church member persona

It's like a family

The current church members are proud of being in the CBCOP community. It is one of the most fundamental reasons that people stay. They state that the CBCOP community is small, well-connected and has a family-liked relationship. 



Interview with potential new members

non-member persona

People is the Key

When testing the existing website, the non-members reflected that they want to know more about the people in the church. Non-members expressed that the most significant value for deciding to attend a church continually is the people there. They value whether or not the church members are friendly, welcoming and have similar life experience with them.



Both church members and non-members reveal that community in the church is a critical factor, yet, people are often the least illustrated characteristic among the church websites.
In order to know God, the church seekers must know the church community well first. And it is the most prioritized element when people are looking for attending a new church.

I concluded the research into the insights below:



Need statement

The Church seekers are looking for a welcoming and relatable community.


Design Principles

THE Design


Solution 1:

Share the experience

Testimony is a powerful tool. A strong testimony along with photos could draw users' attention quickly and tell the story in a compelling and relatable way. 

I put church member's stories on the hero image carousel on the homepage to introduce the church people to church seekers. And provide a link to a dedicated page to view the stories. 

Testimonies are the first element that user see on the website. It conveys the message that "we care about people in the church" and provide personal and relatable connection between users and church members.


Solution 2:

Customized the contents for church seekers

We customized a page for critical information that church seekers need, including brief information about the church, service time, pastors' messages and FAQ that explain what to expect. The goal is to let users feel being cared and welcomed. The language is written in a welcoming tone, and the has invitation throughout the page to encourage the user to visit the church.


Solution 3:

Visualize the information

Text information is transformed into icons, images, and titles to improve the scannability and readabilities. Photos are also being placed in different locations to communicate the church culture.


Information Architecture

The revised information architecture focused on to reveal the church community experience and convey the welcoming atmosphere to the church seekers. Church member's stories are distributed to varies places on the website to allow church seekers learn about how church people interact with each other and how does church help individual growth.

CBCOP site map

Responsive Design

I created responsive webpages by using Bootstrap grid and media query in CSS.

Final Website


User testing is the fundamental of website redesign

This is the second website redesign project I've done. And for both projects, I got the most insightful information from user testing the existing site. By testing the current site, users have a more concrete platform to interact with and could provide in-time and precise feedbacks.