Designing an App to Connect and Empower Muslim Youth

Tawhid (originally known as Taqwa) | Product Design Lead | 2022 - 2024

5 Minute Read


Problem: Many Muslim youth today struggle to carry out religious obligations consistently, as well as connect with their spirituality on a deeper level. During initial interviews with our target audience, some of the main challenges commonly brought up included: a lack of knowledge or understanding, trouble prioritizing religion into their schedules, feeling disconnected from the community, and a lack of motivation/social accountability.

Goals: • Provide a space for Muslims where they will feel understood, motivated, and connected while working on their spiritual journeys.• Empower what is, right now, an underrepresented group within the current technology ecosystem.

My Role: UI/UX Design, User Research, User Testing, Branding

“Growth in mindfulness of Allah, for every Muslim.”


Research

Personas

While we had an understanding of the general problems; we were also aware not every Muslim was the same and that many different factors can lead to the challenges brought up during the first set of interviews. Based on the information we have had so far, I grouped and compared common points to create our initial personas. This helped form the basis on how we designed the tasks in the app.

As an example: One of our personas was a University student named Imran whose main struggle was finding time to pray, as well as balance religious responsibilities with worldly ones. One design decision implemented based on this was that while other Islamic apps would only notify users when the period for prayer began (sunset prayer would be from around 9:00 - 10:30, for example) we wanted individuals to select a time within that period that worked best for them. This then could also be synched with their calendars.

Market research was also conducted to validate our ideas. We wanted to make sure that we could tackle these common problems in a fresh and engaging way. This research also led us to eventually rename the app from Taqwa (an Islamic concept for being conscious of God, of truth, “piety, fear of God”) to Tawhid (the oneness of God, in the sense that He is one and there is no god but He). This decision was made after finding other applications on the market already names Taqwa. The new name still captured the essence of what we wanted users to achieve with the app, a meaningful connection with God.

Design

Prototype

After agreeing on some early aesthetic choices, the next big step was to create a prototype for the app on Figma. This served as a way to test features and functionality with potential users, as well as a proof of concept for stakeholders. This prototype was also used to communicate to developers the intended flow of the app as well as animations and other visuals.

User Testing

We then invited potential users to test the app and provide feedback on its features and functionality. After leading these sessions, I gathered and analyzed the data; comparing results to see what was universally liked, but also what pain points were recurring.

One big change that had to be made was clarifying and simplifying the categories we used to group information. I attempted remedying this by breaking down larger sections to be more easily digestible. An example being separating a category called Essentials into individual elements. This allowed users to easily find what they are looking for without having to dig through menus.

Renaming Morality to Reflection is another example. Users were confused what Morality meant until they actually interacted with the category. The new name was decided via a team brainstorming session.

On the topic of Reflection, this section of the app allowed users to reflect on their actions for the day according to Islamic guidelines. Another small change that was implemented here was renaming the copy to have a more positive tone (Did I avoid evil? -> Did I do what is right?). This felt more uplifting and allowed users to focus on what went right instead of wrong.

This section was ultimately placed into a new space on the navigation bar. We felt it differed too greatly from the other tasks and keeping it on the home screen would only confuse users or cause them to overlook it entirely.

Design System

The wide variety of tasks and goals one could set, and the emphasis we wanted to place on personalized journeys, meant we needed to work with a lot of screens. To ensure a consistent visual language and to simplify things for our developers and other designers, I created a design system based on templates and reusable components.

Learnings

Challenges

Technical feasibility was one challenge that I came across. I had to make sure that the features present were within the company budget as well as could be easily implemented by our developers. This was remedied by agreeing as a team on a Minimum Viable Product; then expanding the potential of the app once we were certain the basics could be delivered in a satisfying way. Having a clear vision of what we wanted the app to be from the beginning prevented the scope from expanding unexpectedly. Another smaller, yet related challenge was ensuring developers had access to the same fonts, visual elements that I used.

Results

Tawhid launched back in March of 2024, exceeding our estimated downloads by 180% and sitting at a 4.8 on the App Store. Tawhid has also been featured on CBC, Yahoo News, and Calgary Tech among others.

Launching the application is just the beginning though! Next steps to be considered include tracking and analyzing metrics. This would allow us to gauge the impact of the product, understand what went right and what needs work and prioritize future updates.

There is still so much to be done though, and I am excited to see how the project evolves in the coming months.

In the meantime, please visit tawhid.app for more info.

Next
Next

MSN Website