Website Design & Branding at the Grace Chinese Christian Church

Crafting website experience for church members and visitors.

December 30, 2024

2 min read

cover

Remodeling a Legacy Website

Grace Chinese Christian Church (GCCC), located in Northwest Arkansas, serves a congregation of about 100 members, primarily of Chinese heritage. Their legacy website was poorly maintained and not in active use.

In 2024, the pastor reached out to me to remodel the website as an online information portal. The project had three main goals:

  • Rebranding: Align the website's design with the church's identity and values
  • Information Layout: Simplify how visitors find information and how admins update content
  • Multi-language Support: Add English as a secondary language to engage non-Chinese-speaking community members

Timeline

As the sole designer and developer, I completed the entire remodeling in 3 months, covering research, design, development, and testing. project timeline [fig 1] Roadmap and checkpoints.


Rebranding

The brand colors reflect GCCC's welcoming spirit: an elegant emerald green and warm copper, complemented by earthy neutral tones. I kept the Chinese serif font from the legacy website for its human touch, pairing it with clean sans-serif typefaces in both Chinese and English.

logo [fig 2] New Logo design.

color [fig 3] Color palettes.

type [fig 4] Text styles for display.

text [fig 5] Text styles for website design.

[video 1] New home page design.


For Visitors: Keyword-Driven Navigation

Since this is a read-only website, my research focused on identifying the most frequent questions visitors have and the keywords they use. I then matched those keywords with the website's content.

keywords for church members [fig 6] Keywords for church members.

keywords for new visitors [fig 7] Keywords for new visitors.

Based on this research, I reorganized the site content to highlight the most important information. The layout is straightforward — all pages are accessible from the home page navigation within 2 steps.

sitemap [fig 8] High-level sitemap.

high-fidelity prototype [fig 9] High-fidelity design prototype for home page, comparing before and after redesign.

For Admins: Streamlined Content Management

To simplify content updates, I used Wix's CMS (Content Management System), which allows creation of databases similar to Excel spreadsheets. By linking these databases to the front-end, admins can easily update content in the backend without touching the front-end setup.

wix backend [fig 10] Example databases in the Wix CMS system.


Language Support

Using Wix's multi-language support and AI translation, I translated all Chinese content into English, allowing visitors to switch seamlessly between languages.

[video 2] Switching between languages.


Testing & Result

Upon completing the design and development of the website, I conducted informal testing sessions with five users, including both Chinese-speaking and English-speaking individuals. Users were satisfied with the new design and navigation ease, with most finding needed information within 15 seconds.

A satisfaction survey was sent to all church members. Out of approximately 100 active members, 10 responded:

  • Visual design: 90% "Very Satisfied," 10% "Satisfied"
  • Navigation: 100% found the website "Very Easy" to navigate