Overview

Project Type: Mobile App Design

Goal: Create a seamless, modern Islamic app to support daily prayers, provide authentic duas, and integrate smart features for a better spiritual experience.

Target Users:

• Muslims (15–65 years old): Seeking accurate prayer times, easy access to duas, and distraction-free prayer experiences.

• Mosque-goers: Benefiting from automatic silent mode and alerts when entering the mosque.

Research & Discovery

I collaborated with the client to refine the vision and understand user expectations.

Key insights from discovery:

• Users wanted a distraction-free prayer experience without manual phone adjustments.

• Prayer time accuracy and localization were crucial.

• Authenticity and accessibility of duas needed to be clear, with references to Quran and Hadith.

• A personal feed could engage users by providing insights and reminders tied to Islamic dates/events.

Competitor analysis:

• Existing apps provided prayer times but lacked innovation and personalization.

• Few apps integrated mosque-based silent mode or customizable dua collections.

Personas

Persona 1: Ayesha (25, University Student)

• Wants: Accurate prayer alerts, dua references, and a distraction-free mosque experience.

• Preferences: Clean, modern interface with easy navigation.

• Motivations: Staying consistent with prayers while balancing student life.

Persona 2: Karim (45, Business Professional)

• Wants: Automatic silent mode in mosques and a personalized dua collection.

• Preferences: Reliable app with minimal effort required.

• Motivations: Integrating faith into a busy work schedule.

User Flows

I identified four critical user flows:

1. Prayer Times & Alerts: Launch app → Enable location → Prayer times displayed → Notifications/alerts set.

2. Mosque Silent Mode: User enters mosque → App detects location → Phone switches to silent automatically.

3. Browse Duas: Homepage → Dua collection → Select dua → View reference/translation → Save to personal list.

4. Explore Feed: Homepage → Feed section → Weekly/Monthly/Yearly Islamic insights → Engage with content.

Wireframes

• Designed low-fidelity wireframes for prayer time screens, dua collection, and feed.

• Focused on reducing clutter and emphasizing readability.

• Progressed into high-fidelity designs with a consistent Islamic visual style.

Final Design

Visual Direction:

• Minimal, spiritual, and modern.

• Calm colors, clean typography, and intuitive iconography.

• Focused on accessibility and easy navigation for a wide age range.

Key Screens:

• Prayer Times Screen: Accurate, location-based times with alerts.

• Dua Collection: Indexed library with references, translations, and editable options.

• Feed: Weekly/monthly/yearly insights tied to Islamic events.

• Silent Mode Feature: Automatic detection of mosque entry with toggle control.

• Settings: Multiple methods for calculating prayer times, customizable alerts, and personalization.

Outcomes

The expected outcomes of the app include:

• Distraction-free prayers: Automatic silent mode enhances user experience in mosques.

• Authenticity: Verified duas with references increase trust.

• Personalization: Users can adjust translations and settings to their needs.

• Engagement: Feed section fosters long-term interaction with the app.

• Scalability: Future updates can expand features (e.g., community or event integrations).