User Research — Personas & Journey Maps

Events Discovery Page — User Research & Personas

Date: 2026-03-16 Author: UX Research (generated) Status: Draft for Review Scope: almaghrib.org standalone events discovery page

Table of Contents

1. Research Context
2. User Personas
3. User Journey Maps
4. Key Insights for Page Design
5. Content Hierarchy Recommendation
6. Competitive Analysis & Platform Patterns
7. Design Implications Summary

Research Context

About AlMaghrib Institute

AlMaghrib Institute is an Islamic education organization with 300,000+ students across 45+ cities globally. Their core offering is in-person weekend seminars — intensive 2-day Islamic studies courses taught by well-known scholars. They also run Ilm Nights (evening events), IlmFests (large gatherings), online courses (Faith Essentials), and travel programs (Blessed Voyage).

The Problem

The current /weekend-seminars/ page is essentially a marketing landing page — a hero video, benefit callouts, and generic messaging about the seminar experience. It contains no specific event information. Users who want to find an actual event must navigate to the mega menu dropdown, which surfaces rich data (dates, cities, instructors, descriptions, credits, pricing) but buries it behind hover interactions that are invisible on mobile and non-obvious on desktop.

Meanwhile, the mega menu API (mega-menu-events) already returns everything needed for a rich events page: 21 onsite events across 19 cities on 2 continents, complete with images, instructor data, pricing tiers, venue details, and registration counts.

Current Discovery Channels (Estimated by Priority)

1. WhatsApp messages from friends, family, or community groups — dominant channel
2. Email newsletters — AlMaghrib's email list is large and active
3. Social media (Instagram, Facebook, YouTube) — awareness and hype
4. Direct website visits — returning students who know the brand
5. Word of mouth at mosques — local community announcements
6. Google search — less common; people search for AlMaghrib by name, not by topic

Implications for Page Design

The events page must serve two fundamentally different entry points:

• Direct link traffic (WhatsApp, email, social) — users arrive with partial context ("my friend said there's a seminar in Houston") and need fast confirmation + details
• Browse traffic (direct visits, navigation) — users arrive with intent but no specific event in mind and need to explore what's available near them

User Personas

Persona 1: Amira — The Community Regular

Motivations:

• Deep personal commitment to Islamic knowledge — views seminars as investment in her deen
• The social experience: reconnects with her "AlMaghrib friends" each seminar
• Accumulating credits toward her AlMaghrib certificate/diploma
• Specific instructor loyalty — will attend anything taught by certain scholars

Discovery pattern:

• Already on AlMaghrib's email list — reads every newsletter
• Active in her city's AlMaghrib WhatsApp group
• Checks the website periodically to see what's coming up next
• Follows AlMaghrib and instructors on Instagram

Information needs (in priority order):

1. Which city/date is the next seminar near me?
2. Who is teaching it?
3. What's the topic? (She'll likely attend regardless, but still wants to know)
4. How many credits is it worth?
5. Is early-bird pricing still available?

Barriers to registration:

• Schedule conflicts with work (needs specific dates early)
• Price sensitivity is low but she does watch for early-bird deadlines
• Rarely a barrier — she's already sold on the concept

Key quote (archetype): "I just want to see what's next in my city and register before early-bird ends."

Design implication: Amira needs a fast, scannable page that lets her find her city instantly and see upcoming dates. She does not need to be sold on AlMaghrib — she needs logistics. The page should respect her time.

Persona 2: Omar — The Newcomer

Motivations:

• Felt a spiritual gap after becoming a father — wants to learn more about Islam
• His friend spoke highly of the experience and personally invited him
• Looking for structured learning (not random YouTube videos)
• Wants to meet other Muslim men in his area

Discovery pattern:

• Received a WhatsApp message with a direct link to an event or the events page
• Has never visited almaghrib.org before
• May Google "AlMaghrib Institute" to validate before registering
• Will check Instagram for social proof (photos, videos from past events)

Information needs (in priority order):

1. What exactly is this? (He needs the concept explained in 5 seconds)
2. Is there an event in my city?
3. What's the time commitment? (Weekend = both days? How many hours?)
4. How much does it cost?
5. Who teaches it? Are they credible?
6. What will I actually learn? (Topic/description)
7. Do I need any prerequisites or prior knowledge?

Barriers to registration:

• Uncertainty — doesn't know what to expect, worried he'll be out of place
• Family logistics — needs to coordinate childcare with wife for a full weekend
• Cost justification — needs to see value clearly to justify the expense
• Social anxiety — will he know anyone? Is it welcoming to newcomers?
• Information gaps — if the page doesn't answer his questions, he won't dig further

Key quote (archetype): "My buddy sent me a link — I need to figure out what this is and whether it's worth taking a whole weekend for."

Design implication: Omar is the highest-value persona to design for because converting newcomers drives growth. The page must instantly communicate what AlMaghrib events are, show social proof (attendee counts, photos), provide complete information without requiring clicks to other pages, and make the experience feel welcoming and accessible. He will not navigate a mega menu. He will not search for answers. If the landing page doesn't answer his questions in 30 seconds, he's gone.

Persona 3: Fatima — The Parent Decision-Maker

Motivations:

• Wants to get back into Islamic learning now that kids are older
• Concerned about her teenagers' Islamic identity — wants family-oriented resources
• Values the community aspect — wants to be around other practicing families
• Looking for events she can attend with her husband (joint experience)

Discovery pattern:

• Sees posts in her mosque's Facebook group or WhatsApp parent group
• Email newsletters (subscribed years ago, still reads occasionally)
• Word of mouth from other parents at weekend Islamic school
• Her older child may have mentioned AlMaghrib from social media

Information needs (in priority order):

1. Is there an event near me? (She won't travel far with kids)
2. What are the exact dates and times? (Needs to plan around family schedule)
3. What's the cost — for one person? For two? Any family pricing?
4. Is there childcare or kids' programming?
5. What's the topic? (Needs it to be relevant and engaging, not too academic)
6. Where exactly is the venue? (Parking? Accessibility?)

Barriers to registration:

• Logistics — childcare for younger kids, coordinating with husband's schedule
• Cost — two registrations plus potential childcare = significant expense
• Time commitment — giving up a whole weekend is a big ask for a busy parent
• Relevance uncertainty — "Is this going to be relevant to my life right now?"
• Guilt — spending time/money on herself vs. family needs

Key quote (archetype): "I'd love to go, but I need to figure out the kids situation and whether we can afford both of us going."

Design implication: Fatima needs pricing visible upfront (not hidden behind a click), clear schedule information (start time, end time, both days), and any family-friendly details prominently displayed. She is making a complex household decision, not an impulse purchase. The page should make it easy to share event details with her husband (share button, clean URLs) so they can decide together.

Persona 4: Yusuf — The Out-of-Towner

Motivations:

• Deeply passionate about Islamic knowledge — this is his field of study
• Specific instructor loyalty — will travel across state lines for the right scholar
• Collecting credits/completing AlMaghrib curriculum tracks
• Networking with other serious students of knowledge
• Content matters more than convenience — he optimizes for the best course, not the nearest

Discovery pattern:

• Follows every AlMaghrib instructor on social media
• Monitors the website actively for new course announcements
• Part of multiple AlMaghrib city WhatsApp groups (not just his own)
• Discusses upcoming courses with friends across different cities

Information needs (in priority order):

1. What courses are happening in the next 2-3 months ANYWHERE?
2. Who is teaching each one?
3. What's the topic/syllabus? (He evaluates course content seriously)
4. Which courses has he NOT taken yet? (Credit/curriculum tracking)
5. Date conflicts — which events overlap so he can choose?
6. Cost comparison — different cities may have different pricing

Barriers to registration:

• Budget — grad student income means travel costs are a real factor
• Schedule — needs to plan around academic calendar
• Choice paralysis — if multiple good options exist, he agonizes over which to pick
• Travel logistics — needs to estimate total cost (registration + flight/drive + hotel)

Key quote (archetype): "Show me everything that's coming up everywhere — I'll figure out which one is worth the road trip."

Design implication: Yusuf needs to see ALL events at once, easily compare across cities, and filter by instructor or topic. The "All" view (no city filter) is his default. He benefits from a sortable list or calendar view. Date visibility is critical so he can spot conflicts. He's the power user who will use every filter you build.

Persona 5: Sarah — The Browser

Motivations:

• Saw an AlMaghrib reel on Instagram that resonated emotionally
• Curious about structured Islamic learning but not committed
• Interested in the social/community aspect — "Is this where cool young Muslims go?"
• Exploring her identity and faith in her early 20s
• Looking for something more meaningful than another Netflix weekend

Discovery pattern:

• Instagram reel or TikTok → tapped through to website
• May have seen a friend's Instagram story from a past event
• Google search "AlMaghrib London" or "Islamic courses London"
• Browsing casually — not looking for a specific event

Information needs (in priority order):

1. Is this for someone like me? (Age, vibe, inclusivity signals)
2. Is there anything in my city?
3. What does it actually look like? (Photos, videos, social proof)
4. How much does it cost? (Immediate filter for a young professional)
5. What's the vibe — serious/academic or welcoming/fun?
6. Can I go alone or is it weird without knowing anyone?

Barriers to registration:

• Commitment anxiety — a full weekend feels like a lot for something unknown
• Social uncertainty — doesn't know anyone who's going
• Price sensitivity — early career, budget-conscious
• Analysis paralysis — too many options or too much text will cause her to bounce
• Mobile friction — if the page isn't perfectly mobile-optimized, she's gone instantly

Key quote (archetype): "This looks interesting... let me see if there's something in London and how much it costs."

Design implication: Sarah will spend less than 10 seconds deciding if this page is for her. Visual design quality signals credibility. She needs to see her city immediately (GeoIP auto-detection is critical for this persona). Photography from past events showing diverse, young attendees builds trust. Keep text minimal, let visuals do the work. The page must be flawless on mobile — she will never see a desktop version.

User Journey Maps

Journey 1: Amira — The Community Regular

TRIGGER          DISCOVERY              EXPLORATION           DECISION             ACTION               POST-REGISTRATION
─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
Email newsletter  Clicks link →         Scans for her city    Checks instructor    Clicks "Register"    Shares in WhatsApp
arrives with new  lands on events       (Houston) — finds     name — it's Sheikh   → taken to           group: "Just
course announce-  page                  it in 2 seconds       she wanted           almaghrib.org        registered for
ment                                    via city pill                              event page           [Course]! Who
                  OR                                          Confirms dates                            else is coming?"
                  Navigates directly    Notes the date —      don't conflict       Completes
                  from almaghrib.org    checks her calendar   with work            registration         Posts on Instagram
                  bookmark                                                         (familiar flow)      story tagging
                                        Glances at credits    Checks if early-                          @alloghrib
                                        (wants to track       bird price is
                                        progress)             still active                              Adds dates to
                                                                                                        calendar

Emotional arc: Anticipation → Scanning → Confirmation → Satisfaction → Social sharing

Pain points in current system:

• Has to hover over mega menu and hunt through dropdowns
• Can't quickly see all events in her city on one screen
• No way to link directly to "Houston events"

What the new page must deliver:

• City filter that remembers her preference (or GeoIP auto-selects Houston)
• Instructor name visible on card without expanding
• Early-bird pricing deadline visible
• Credits badge on card
• One-click path to registration

Journey 2: Omar — The Newcomer (WhatsApp Referral)

TRIGGER          DISCOVERY              EXPLORATION           DECISION             ACTION               POST-REGISTRATION
─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
Friend sends     Taps link on phone     Reads the brief       Sees 847 students    Taps "Register"      Tells friend
WhatsApp message → page loads           "What is this?"       have registered      → registration       "I signed up!"
"Bro you have    (mobile)               context above         — social proof       page loads
to come to this                         the fold              works                                     Nervous but
seminar in       First impression:                                                 Hesitates at         excited
Charlotte"       "This looks            Finds Charlotte       Sees the price —     payment — but
                 professional and       event — sees          $179 feels           friend reassures     Asks friend
                 legit"                 instructor photo,     reasonable for       him via WhatsApp     "What should I
                                        topic, full           a weekend of                              bring? What do
                 Scrolls to            weekend dates          learning             Completes            I wear?"
                 understand what                                                   registration
                 AlMaghrib is          Reads description —    Friend follows up:                        Adds dates to
                                       "I could actually      "Did you sign up                          calendar
                 Sees event cards      learn something        yet?" — this is
                 — scans for           useful here"           the real trigger
                 Charlotte

Emotional arc: Curiosity → Confusion ("what is this?") → Understanding → Social validation → Cautious commitment → Anticipation

Pain points in current system:

• Landing on /weekend-seminars/ gives zero event information
• Has to figure out the mega menu exists and how to use it
• Mobile mega menu experience is poor
• No context for what AlMaghrib seminars actually are

What the new page must deliver:

• Brief, clear explanation of what AlMaghrib events are (2-3 sentences max, above the fold or contextually near events)
• Social proof: attendee count, photos from past events
• Complete information on the card or one tap away: dates, price, instructor, description
• Mobile-first design — he's on his phone from WhatsApp
• Shareable URLs so he can send back to his friend ("Is this the one you meant?")
• Low-commitment CTA language: "Learn More" before "Register Now"

Journey 3: Fatima — The Parent Decision-Maker

TRIGGER          DISCOVERY              EXPLORATION           DECISION             ACTION               POST-REGISTRATION
─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
Sees post in     Taps link on phone     Filters to            Expands card —       Shares event link    Coordinates
mosque parents'  during kids'           Mississauga           reads full           with husband via     childcare with
WhatsApp group:  bedtime routine        immediately           description          WhatsApp:            her mother
"AlMaghrib is                                                                      "What do you
coming back to   Scans quickly —       Checks dates —         Checks pricing:      think about this?"   Registers both
Mississauga!"    "Can I find what      "Oct 18-19,           "$179 each...                             herself and
                 I need before the     Saturday 10am -        $358 total"          Husband says yes     husband
                 baby wakes up?"       Sunday 6pm"                                 — discusses
                                                              Looks for child-     logistics            Tells WhatsApp
                                       "Hmm, that's a lot    care info —                               group "We're in!"
                                       of hours. Can I go    doesn't find it      Registers on
                                       just one day?"        easily — texts       iPad at home         Asks group about
                                                             the WhatsApp         during evening       childcare
                                       Notes the instructor  group to ask                              arrangements
                                       — recognizes the
                                       name from a podcast

Emotional arc: Interest → Time pressure ("I have 2 minutes") → Logistics evaluation → Cost calculation → Delegation (shares with spouse) → Joint decision → Commitment

Pain points in current system:

• Can't quickly get the specific details she needs (dates, times, price)
• No easy way to share a clean event link with her husband
• No information about family logistics (childcare, venue details)
• Price only visible after multiple clicks

What the new page must deliver:

• Pricing visible on card (not hidden in expanded view) — or at minimum one tap to see it
• Full schedule with times (not just dates)
• Venue information accessible
• Clean share functionality (share button that generates a nice preview)
• Fast load time — she's browsing in stolen moments

Journey 4: Yusuf — The Out-of-Towner

TRIGGER          DISCOVERY              EXPLORATION           DECISION             ACTION               POST-REGISTRATION
─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
Sees Instagram   Goes to events page    Selects "All" —       Narrows to 2-3      Picks the course     Starts planning
post from        (bookmarked)           views every           options: best        with the best        travel logistics
instructor                              upcoming event        instructor +         instructor +         (bus tickets,
announcing new   Scans the full list    across all cities     topic combo          reasonable           friend's couch
course                                                                             travel cost          to crash on)
                                        Compares dates —      Checks if he's
                                        "Dallas is same       already taken        Registers early      Messages friends
                                        weekend as Houston,   this course          for early-bird       in that city:
                                        can't do both"        (credits/code)       pricing              "I'm coming for
                                                                                                        [Course]!"
                                        Notes instructors     Estimates total      Completes
                                        for each event        cost: $179 +         registration         Coordinates
                                                              $60 bus +                                 accommodation
                                        Opens 2-3 events      friend's couch
                                        to read descriptions  = doable

Emotional arc: Excitement → Analysis mode → Comparison → Optimization → Commitment → Logistics planning

Pain points in current system:

• Can't see all events across all cities on one screen
• Mega menu only shows one city at a time
• No way to compare dates across cities
• Can't sort by instructor

What the new page must deliver:

• "All" view as a first-class experience (not just unfiltered chaos)
• Sortable by date, instructor, or city
• Date prominently displayed for conflict checking
• Instructor name and photo on every card
• Course code/credits visible (for curriculum tracking)

Journey 5: Sarah — The Browser

TRIGGER          DISCOVERY              EXPLORATION           DECISION             ACTION               POST-REGISTRATION
─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
Sees a moving    Taps link in bio →     Page auto-detects     Sees "342 students   Considers it but     Maybe registers
AlMaghrib reel   events page loads      London — shows        registered" —        doesn't register     a week later
on Instagram     on mobile              London events         "This is actually    today                after seeing
                                        first                 popular"                                  another prompt
                 First 3 seconds:                                                  Screenshots the
                 "Is this legit?        Sees an event in      Sees photos of       event details        OR sends the
                 Is this for me?"       3 weeks — "I          young, diverse       and sends to         link to a friend:
                                        could actually go"    attendees            group chat:          "Should we go
                 Scans visual                                                      "Have you guys       to this?"
                 design, photos,        Checks price:         Reads a few          heard of this?"
                 overall vibe           "$149 — not bad"      lines of the                              Follows
                                                              description —                             @almaghrib on
                                        Looks at instructor   "This actually                            Instagram
                                        — Googles the name    sounds relevant
                                        quickly               to my life"

Emotional arc: Curiosity → Snap judgment ("Is this for me?") → Tentative interest → Social validation seeking → Bookmarking/sharing → Delayed conversion

Pain points in current system:

• /weekend-seminars/ page has zero specific event info
• No visual social proof (past event photos with real attendees)
• Page doesn't look "modern" enough for Gen Z expectations
• Mobile experience is not optimized for casual browsing
• No GeoIP — she has to manually find London

What the new page must deliver:

• Instant visual credibility (modern design, photography, clean layout)
• GeoIP auto-detection to show London events immediately
• Attendee count as social proof
• Price visible without extra taps
• Easy sharing to group chats (rich link preview when shared on WhatsApp/iMessage)
• The page itself must be the sales pitch — she won't click through to learn more

Key Insights for Page Design

1. What Information Should Be Visible Above the Fold?

On mobile (the primary viewport):

• A brief contextual header: "Upcoming AlMaghrib Events" with one line of context for newcomers
• Continent/city filter bar (sticky)
• The first 1-2 event cards showing: course image, title, instructor, city, date, price indicator

On desktop:

• Same as mobile but with 2-3 cards visible in a grid
• Filter bar with continent tabs and city pills

What should NOT be above the fold:

• Marketing copy about what AlMaghrib is (this isn't a landing page)
• Video embeds
• Long descriptions
• Navigation to other parts of the site

2. What's the #1 Thing Users Need to See Within 3 Seconds?

"There is an event near me, and here's when it is."

This single insight drives every design decision. Within 3 seconds, the user must:

1. See an event card for their city (via GeoIP auto-detection or prominent city filter)
2. See the date of that event
3. Know it's an AlMaghrib event (brand trust for returning users, credibility signals for newcomers)

If a user's city has no upcoming events, the fallback must be graceful: "No upcoming events in [City] — here's what's happening nearest to you" with distance indicators.

3. How Should We Handle the WhatsApp Referral Flow?

WhatsApp referrals are the dominant discovery channel. The flow is:

Friend sends link → User taps on phone → Page loads in mobile browser

Critical design requirements for this flow:

1. Deep-linkable URLs: almaghrib.org/events?city=charlotte or almaghrib.org/events#charlotte so the shared link pre-filters to the relevant city. When a friend says "check out the Charlotte seminar," the link should land on Charlotte events, not a generic page requiring manual filtering.

2. Rich link previews (Open Graph tags): When the URL is pasted in WhatsApp, it should show a compelling preview — event image, title, and brief description. This is the first impression before the user even taps.

3. Mobile-first load performance: The page must load fully within 2 seconds on a mid-range phone on LTE. WhatsApp users tap a link expecting instant results. A slow page or loading spinner will be abandoned.

4. Zero-orientation design: The user who arrives from WhatsApp has partial context ("my friend told me about a seminar"). The page should not require them to understand AlMaghrib's navigation, product taxonomy, or site structure. Events should be immediately visible and self-explanatory.

5. Share-back affordance: After viewing, the user should be able to easily share the event back to WhatsApp (share button that copies a clean URL or opens the native share sheet). This enables the common pattern: friend shares link → user checks it → user shares back in group chat asking "who's going?"

4. What Drives Urgency/Conversion in This Context?

What does NOT drive urgency (avoid these):

• Fake countdown timers
• "Only X spots left" if not true
• Aggressive pop-ups or interstitials
• Pressure language ("Don't miss out!" "Last chance!")

AlMaghrib's audience values sincerity (ikhlas). The urgency should be factual, not manipulative. "342 students registered" is honest social proof. "HURRY! SELLING OUT FAST!" is tonally wrong for this community.

5. Key Differences: Mobile vs. Desktop Behavior

Design implication: Design mobile as the primary experience. Desktop is a wider version of the same page, not a different experience. The card must work at phone width first.

6. What Emotional Needs Does the Page Address?

Universal emotional needs across all personas:

• Trust: "This organization is legitimate and professional"
• Clarity: "I understand exactly what I'm getting"
• Agency: "I have the information I need to make my own decision"
• Welcome: "This is for people like me"

Content Hierarchy Recommendation

Tier 1: Hero / Header Area

Purpose: Orient the user, enable filtering, establish trust

What NOT to put here:

• Marketing copy, value propositions, or mission statements
• Video embeds (the current page's mistake)
• Search bar (add in Phase 2 — not needed with <25 events)

Tier 2: Event Summary Cards

Purpose: Enable scanning, comparison, and quick decisions

Each card must show (without expanding/clicking):

Card layout recommendation (mobile):

┌──────────────────────────────────┐
│  [Course Image — full width]     │
│                                  │
│  ┌──────────────────────────────┐│
│  │ Weekend Seminar  •  3 credits││
│  │                              ││
│  │ COURSE TITLE                 ││
│  │ Subtitle / tagline           ││
│  │                              ││
│  │ 👤 Sheikh Name               ││
│  │ 📍 Houston, TX              ││
│  │ 📅 Sat-Sun, Oct 18-19       ││
│  │     (In 3 weeks)            ││
│  │                              ││
│  │ From $149  •  312 registered ││
│  │                              ││
│  │ [Learn More]  [Register →]  ││
│  └──────────────────────────────┘│
└──────────────────────────────────┘

Tier 3: Expanded / Detail View

Purpose: Provide everything needed to commit to registration

Triggered by tapping "Learn More" or the card itself. Shows additional details inline (accordion) or in a slide-up panel (mobile):

Tier 4: Footer / Secondary Areas

Purpose: Supporting information, navigation, trust signals

Competitive Analysis & Platform Patterns

Eventbrite — Event Discovery

What they do well:

• Urgency badges: "Almost full," "Sales end soon," "Just added" — prominent badges above event titles that drive action without being manipulative
• Location hierarchy: Continent > Country > Region > City — breadcrumb navigation makes geographic filtering intuitive
• Consistent card format: Every card has the same structure (image, title, date, location, badge), making scanning effortless
• Image-forward design: Event images are the largest element on each card, creating visual variety and anchoring attention

What to adopt for AlMaghrib:

• Urgency badge pattern (adapt as "Early bird," "X registered," "Starting soon")
• Consistent card structure across all event types
• Geographic breadcrumb/filter hierarchy

What to avoid:

• Eventbrite's cards hide pricing — users must click through. AlMaghrib should show price on the card since it's a key decision factor
• Their category filtering is overwhelming (20+ categories). AlMaghrib only needs event type (Weekend Seminar, Ilm Night) and location

Meetup — Community Event Discovery

What they do well:

• Social proof via attendees: Member photos and counts displayed directly on cards — "127 going" with actual profile pictures
• Frequency indicators: "Every Tue," "Every two weeks on Wed" — natural language date formatting
• Location badges: Clear "Online" vs "In person" vs specific venue tags
• Ratings: 4.7-star ratings visible on cards — instant quality signal
• Distance-based default: Automatically shows events near you with "Within 18 miles" radius

What to adopt for AlMaghrib:

• Attendee count with social proof framing (AlMaghrib already has event_attendees data)
• Natural language date formatting ("This Saturday," "In 2 weeks")
• GeoIP-based auto-filtering (AlMaghrib API already supports this via distance calculation)
• In-person badge to differentiate from online offerings

What to avoid:

• Meetup's "Join group first" friction before RSVP. AlMaghrib should allow direct event discovery without account creation
• Their search-heavy interface. AlMaghrib's event count (~21) doesn't need search — just filters

Luma — Modern Event Platform

What they do well:

• Community-curated discovery: Events organized by communities/calendars, not just algorithms — creates human trust
• Geographic organization by continent: Cities listed under continental headers — very similar to what AlMaghrib needs
• Clean, minimal card design: Title, date, location, image — no clutter
• Featured/promoted events: Larger cards for highlight events, standard cards for the rest
• Mobile-first scroll patterns: Horizontal scroll-snap for card carousels on mobile

What to adopt for AlMaghrib:

• Continent-level geographic organization (already planned)
• Featured event treatment for IlmFests or special events (larger card, hero position)
• Clean, minimal card aesthetic — Luma's restraint is a strength
• City-based calendar subscriptions (future feature: "Subscribe to Houston events")

What to avoid:

• Luma's reliance on community/calendar subscription model — AlMaghrib is a single organization, not a marketplace
• Their discovery page can feel overwhelming with too many community cards

Coursera / Course Listing Patterns

What they do well:

• Trust signals on cards: Partner institution logos, instructor credentials, enrollment counts
• Progressive disclosure: Card shows essential info, click reveals syllabus, reviews, schedule
• Difficulty/level indicators: "Beginner," "Intermediate," "Advanced" — sets expectations
• Duration estimate: "Approx. 12 hours" — helps users assess time commitment

What to adopt for AlMaghrib:

• Instructor credential/title display (Sheikh, Dr., etc.) — builds credibility especially for newcomers
• Time commitment indicator ("Full weekend: Sat 10am - Sun 6pm, ~16 hours")
• Credits/progress tracking as a card badge
• Progressive disclosure model: essential info on card, details one interaction away

What to avoid:

• Coursera's heavy use of ratings/reviews. AlMaghrib courses aren't reviewed this way
• Their recommendation algorithms. AlMaghrib's catalog is small enough that curation > algorithms

SeekersGuidance — Islamic Education Platform

What they do well:

• Curriculum tracks: Clear learning pathways (Islamic Studies, Quranic Studies, Arabic)
• Content-first approach: Courses introduced through accessible articles/content marketing
• Trusted instructor branding: Scholar names carry weight in the Islamic education community

What to adopt for AlMaghrib:

• Curriculum track awareness on event cards (which track does this course belong to?)
• Instructor-as-brand approach — instructor name and face should be prominent, not secondary
• Clear topic categorization (Fiqh, Aqeedah, Seerah, etc.) for returning students

Pattern Summary: What Works for Religious/Community Education Events

Design Implications Summary

The Five Non-Negotiable Requirements

Based on all persona research, journey mapping, and competitive analysis, these are the requirements that will make or break the page:

1. GeoIP auto-detection must work on first load. The #1 user need across all personas is "Is there an event near me?" If the page answers this in 3 seconds, it succeeds. If the user has to manually find their city, we've already lost Sarah and made it harder for everyone else. The API already supports this via the distance field — use it.

2. Event cards must show price, date, instructor, and city without any interaction. Every persona needs at least 3 of these 4 data points to make their initial assessment. Hiding any of them behind a click or expand action creates friction at the exact moment the user is deciding whether to engage further. This is the single biggest improvement over the mega menu.

3. The page must be flawless on mobile. Conservatively, 70%+ of traffic will be mobile (WhatsApp referrals, social media links, email opens on phone). The page should be designed mobile-first and scaled up to desktop, not the reverse. Cards must be full-width on mobile. Filters must be thumb-friendly. Load time must be under 2 seconds.

4. Deep-linkable city filtering with rich Open Graph previews. WhatsApp sharing is the primary discovery channel. When someone shares almaghrib.org/events?city=houston, the WhatsApp preview must show something compelling (event image, title, "3 upcoming events in Houston"). And the landing page must pre-filter to Houston. Without this, the social sharing flywheel breaks.

5. The page must serve both returning students AND complete newcomers. This means the default view should be clean and scannable (for regulars who just need logistics) with contextual help available but not forced (for newcomers who need orientation). A brief "What is this?" explainer should exist but not dominate. Social proof (attendee counts, past event photos) serves both audiences: regulars see community validation, newcomers see legitimacy.

Secondary Recommendations

Metrics to Track Post-Launch

This document should be reviewed alongside the Implementation Plan, Research Findings, and Design Decisions in this directory.