World Community for Christian Meditation (Singapore)
UX/UI Design
Web Development
The church’s current website was outdated by at least ten years, non-mobile-responsive, and difficult to navigate and update, and lacked important information needed for members of the community to support their meditation practice and engage with community activities.
Redesign and rebuild the website to:
Modernise the visual design and rework it to better evoke an appropriate mood/feel for a church community.
Make it mobile-friendly, as required by modern internet browsing behaviour.
Accommodate more information about meditation and community activities/events.
Include a simple web-based app to aid users in timed meditation sessions, with selected audio files to play at certain points during the session.
To begin, I conducted an in-person stakeholder meeting and survey where I asked members of the church committee what they would like the website to be able to do for the community, the style/personality they were after (aided by example moodboards I created), and their benchmarks for success.
Some of the points summarised from the survey were:
I designed the website in Figma and built it from scratch in Webflow (a visual coding platform used to build websites). I ensured an intuitive CMS structure so that laypeople (committee members) could easily update the website with events, news, newsletters, etc. without my help. To this day, it continues to be updated by my non-designer clients, without my help and without any risk of breaking the visual design framework.
I developed the web-based app from scratch using Javascript and jQuery. I previously had little knowledge of how to code using Javascript, and picked up the skill on the job as quickly as I could using a mix of Udemy courses, frantic Googling and Stack Overflow.
The app enables selection of a short audio talk to start a meditation practice session, how long the session should last, and whether to play an opening prayer between the talk and silent meditation time. The app should be able to play the audio of the user’s choice, as well as audio cues (chimes) signalling the start and beginning of their silent meditation period.
I handed over the project to the client committee after an in-person meeting where I coached those who would be responsible for updating the website in the use of the content management system (CMS) I had built in as part of the website.
Barring small page design additions that I have done over the years, it presently continues to be updated by the client with no need for my assistance. It is currently active at https://wccmsingapore.org
This was my first freelance project where I had to independently carry out all steps of the product design process - stakeholder research, user experience design, user interface design, and development. I exercised and improved my existing skills with Webflow, HTML, and CSS to make my designs a reality.
I learned to be the only point of contact with stakeholders, working with them to understand their product vision and translate their needs into a real design. I also refined my skills in independently establishing a design direction for a web project, both visual/UI and in terms of the wider UX vision.
Finally, I had to learn Javascript and jQuery from scratch, and did so well enough to develop a functioning, albeit simple, web-based app.
I had to carefully consider how to incorporate CMS elements into the designs in a way that non-designers/developers could easily update their website content without compromising the quality of design, and limiting opportunities for them to accidentally break the design
Overall, I learned a lot, not only about building a website that fulfilled stakeholder needs, but was sustainable in terms of being easily manageable by people who were neither designers nor developers.
If you’d like to work with me, or even just ask some questions, let me know!
Contact me