Open World Map | Branding & UI Showcase

Brand Color Palette

#3D9A8B

Teal (Primary)

Primary brand color, buttons, links, active states

#E85D3B

Coral (Accent)

CTAs, alerts, SOS features, highlights

#F5A623

Amber (Warning)

Traffic alerts, warnings, notifications

#1E2A38

Dark (Background)

Dark mode background, headers

Gradient

Brand Gradient

Avatars, featured elements, CTAs

#f1f5f9

Muted (Light)

Backgrounds, cards, secondary elements

Typography

Heading 1 / 2.5rem / Inter 900

Open World Map

Heading 2 / 1.5rem / Inter 700

Community Feed

Body / 1rem / Inter 400

Join the community to post, interact, and stay safe together. Share traffic updates, safety alerts, and local recommendations with people nearby.

Small / 0.875rem / Muted

Posted 5 minutes ago in Valletta, Malta

UI Components

Buttons

Category Pills

Amenities Safety Traffic

Avatars

J

JP

M

Input Fields

App Screen Previews

Community Feed - Light Mode Live

Welcome back!

Here's what's happening in your community today.

M

Maria Santos

Valletta, Malta - 5 min ago

TRAFFIC

Heavy traffic on Republic Street near St. John's Co-Cathedral. Consider taking the bypass via Merchant Street.

12 Helpful 3 Comments Share

Community Feed - Dark Mode Live

Welcome back!

Here's what's happening in your community today.

K

Kevin Ochieng

Westlands, Nairobi - 2 min ago

SAFETY

Power outage affecting the entire Westlands area. Kenya Power says restoration expected within 2 hours.

28 Helpful 7 Comments Share

Note: These mockups represent the actual implemented UI components. The app supports both light and dark modes with full system preference detection.

Development Progress

Authentication Ready for Testing

Login, Signup, Firebase Auth, Profile Management

Community Feed Ready for Testing

Posts, Categories, Helpful Votes, Comments

Interactive Map Ready for Testing

Mapbox Integration, Pins, Clustering, Search

User Profiles Ready for Testing

View Profiles, User Posts, Settings

Search & Discovery Ready for Testing

Search Users, Posts, Locations

Notifications Ready for Testing

In-App Notifications, Activity Feed

Messaging In Progress

Direct Messages, Conversations

SOS Feature Ready for Testing

Emergency Alerts, Trusted Contacts

Leaderboard Ready for Testing

Top Contributors, Points System

Dark Mode Ready for Testing

System Preference, Manual Toggle

Responsive Design Ready for Testing

Mobile, Tablet, Desktop Optimized

Push Notifications Planned

Firebase Cloud Messaging Integration

Feature Summary

Feature	Status	Description
Authentication	Ready for Testing	Firebase Auth with email/password and social login
Community Feed	Ready for Testing	Location-based posts with categories and voting
Interactive Map	Ready for Testing	Mapbox with pins, clustering, and search
User Profiles	Ready for Testing	Profile pages, post history, settings
Search	Ready for Testing	Search users, posts, and locations
Notifications	Ready for Testing	In-app activity notifications
Messaging	In Progress	Direct messaging between users
SOS	Ready for Testing	Emergency alerts to trusted contacts
Leaderboard	Ready for Testing	Community contributors ranking
Dark Mode	Ready for Testing	Full dark theme support
Push Notifications	Planned	Firebase Cloud Messaging