Projects using Mapbox in LahoreProjects using Mapbox in Lahore
Cover image for ๐€๐ˆ-๐๐จ๐ฐ๐ž๐ซ๐ž๐ ๐‘๐ž๐š๐ฅ-๐“๐ข๐ฆ๐ž ๐€๐ง๐š๐ฅ๐ฒ๐ญ๐ข๐œ๐ฌ & ๐ƒ๐ž๐œ๐ข๐ฌ๐ข๐จ๐ง
๐€๐ˆ-๐๐จ๐ฐ๐ž๐ซ๐ž๐ ๐‘๐ž๐š๐ฅ-๐“๐ข๐ฆ๐ž ๐€๐ง๐š๐ฅ๐ฒ๐ญ๐ข๐œ๐ฌ & ๐ƒ๐ž๐œ๐ข๐ฌ๐ข๐จ๐ง ๐ˆ๐ง๐ญ๐ž๐ซ๐Ÿ๐š๐œ๐ž I designed a modern real-time analytics platform focused on making live data easier to understand, explore, and act on. Instead of simply refreshing dashboards, the experience combines interactive visualizations, AI-assisted insights, natural-language queries, and responsive data panels so users can understand what is changing and why it matters. The interface includes dynamic dashboards, live metrics, geographic insights, trend visualizations, AI recommendations, and conversational data exploration, all within a clean, focused user experience. ๐Š๐ž๐ฒ ๐…๐ž๐š๐ญ๐ฎ๐ซ๐ž๐ฌ: โ€ข Real-time dashboards and live metrics โ€ข AI-powered recommendations and insights โ€ข Natural-language data queries โ€ข Interactive charts, maps, and visualizations โ€ข Context-aware responses based on changing data โ€ข Clean visual hierarchy for complex information โ€ข Responsive and fluid interface interactions The goal was simple: turn fast-moving data into a clear, intelligent, and actionable experience rather than just another dashboard full of numbers.
1
2
243
Cover image for ๐–๐ก๐š๐ญ ๐ข๐Ÿ ๐Ÿ๐ข๐ง๐๐ข๐ง๐ , ๐ฎ๐ง๐ฅ๐จ๐œ๐ค๐ข๐ง๐ , ๐ง๐š๐ฏ๐ข๐ ๐š๐ญ๐ข๐ง๐ ,
๐–๐ก๐š๐ญ ๐ข๐Ÿ ๐Ÿ๐ข๐ง๐๐ข๐ง๐ , ๐ฎ๐ง๐ฅ๐จ๐œ๐ค๐ข๐ง๐ , ๐ง๐š๐ฏ๐ข๐ ๐š๐ญ๐ข๐ง๐ , ๐š๐ง๐ ๐ญ๐ซ๐š๐œ๐ค๐ข๐ง๐  ๐š๐ง ๐ž-๐›๐ข๐ค๐ž ๐œ๐จ๐ฎ๐ฅ๐ ๐š๐ฅ๐ฅ ๐ก๐š๐ฉ๐ฉ๐ž๐ง ๐ญ๐ก๐ซ๐จ๐ฎ๐ ๐ก ๐จ๐ง๐ž ๐ฌ๐ž๐š๐ฆ๐ฅ๐ž๐ฌ๐ฌ ๐ž๐ฑ๐ฉ๐ž๐ซ๐ข๐ž๐ง๐œ๐ž? I designed a modern smart e-bike mobility platform that brings the complete ride journey into one connected product across mobile and web. Users can discover nearby bikes, check availability and condition, monitor battery health, follow live navigation, track ride performance, and review previous journeys through a clean and intuitive interface. The focus was to make a data-rich mobility product feel simple, visual, and effortless for the rider while keeping the experience scalable across both mobile and desktop. Key Features Nearby bike discovery Real-time map navigation Bike availability & condition status Battery health monitoring Ride distance, speed & time analytics Journey history Desktop mobility dashboard Responsive web experience Tools & Technologies Figma ยท React ยท Next.js ยท Tailwind CSS ยท Mapbox ยท REST APIs ยท Node.js ยท PostgreSQL ยท Framer Motion ยท WebSockets ยท Responsive Web Design Skills UI/UX Design ยท Product Design ยท Frontend Development ยท Dashboard Design ยท Mobile App Design ยท Interaction Design ยท Web Application Development
2
3
252
Cover image for ๐‹๐จ๐ฅ๐จ โ€“ ๐“๐ž๐œ๐ก๐ง๐ข๐œ๐š๐ฅ ๐š๐ง๐ ๐…๐ฎ๐ง๐œ๐ญ๐ข๐จ๐ง๐š๐ฅ
๐‹๐จ๐ฅ๐จ โ€“ ๐“๐ž๐œ๐ก๐ง๐ข๐œ๐š๐ฅ ๐š๐ง๐ ๐…๐ฎ๐ง๐œ๐ญ๐ข๐จ๐ง๐š๐ฅ ๐Ž๐ฏ๐ž๐ซ๐ฏ๐ข๐ž๐ฐ Lolo is a location-based discovery platform built to connect users with nearby services, businesses, and community events. The platform combines an interactive map, visual feed, business profiles, and live local activity to create a real-time local exploration experience. ๐Š๐ž๐ฒ ๐…๐ž๐š๐ญ๐ฎ๐ซ๐ž๐ฌ ๐‹๐จ๐œ๐š๐ญ๐ข๐จ๐ง-๐๐š๐ฌ๐ž๐ ๐ƒ๐ข๐ฌ๐œ๐จ๐ฏ๐ž๐ซ๐ฒ Users can find nearby services, businesses, and events instantly based on their current location for a truly local experience. ๐ˆ๐ง๐ญ๐ž๐ซ๐š๐œ๐ญ๐ข๐ฏ๐ž ๐Œ๐š๐ฉ ๐„๐ฑ๐ฉ๐ž๐ซ๐ข๐ž๐ง๐œ๐ž A visual map interface allows users to explore local places and activities in real time with intuitive and engaging navigation. ๐๐ฎ๐ฌ๐ข๐ง๐ž๐ฌ๐ฌ ๐๐ซ๐จ๐Ÿ๐ข๐ฅ๐ž๐ฌ Detailed business listings include key information, media, and engagement details to help users make informed local decisions. ๐‹๐ข๐ฏ๐ž ๐‹๐จ๐œ๐š๐ฅ ๐€๐œ๐ญ๐ข๐ฏ๐ข๐ญ๐ฒ ๐…๐ž๐ž๐ Real-time updates on what is happening around the user keep the discovery experience fresh, relevant, and always current. ๐‚๐ซ๐จ๐ฌ๐ฌ-๐๐ฅ๐š๐ญ๐Ÿ๐จ๐ซ๐ฆ ๐Œ๐จ๐›๐ข๐ฅ๐ž ๐€๐œ๐œ๐ž๐ฌ๐ฌ A seamless and consistent experience is delivered across both iOS and Android devices without compromise. ๐‚๐จ๐ฆ๐ฆ๐ฎ๐ง๐ข๐ญ๐ฒ ๐„๐ง๐ ๐š๐ ๐ž๐ฆ๐ž๐ง๐ญ ๐‹๐š๐ฒ๐ž๐ซ Users can discover and interact with local community-driven content, fostering genuine connection with their surrounding area. ๐“๐ž๐œ๐ก ๐’๐ญ๐š๐œ๐ค ๐Ž๐ฏ๐ž๐ซ๐ฏ๐ข๐ž๐ฐ ๐๐š๐œ๐ค๐ž๐ง๐ ๐€๐๐ˆ Node.js with Express powers all core platform logic, data handling, and service integrations reliably and at scale. ๐ƒ๐š๐ญ๐š๐›๐š๐ฌ๐ž ๐š๐ง๐ ๐’๐ญ๐จ๐ซ๐š๐ ๐ž PostgreSQL manages all structured relational data including users, businesses, locations, and activity logs with efficiency and precision. ๐Œ๐จ๐›๐ข๐ฅ๐ž ๐€๐ฉ๐ฉ๐ฅ๐ข๐œ๐š๐ญ๐ข๐จ๐ง A React Native-based cross-platform app supports both iOS and Android through a single unified codebase for streamlined development and consistency. ๐”๐ˆ ๐‹๐š๐ฒ๐ž๐ซ An interactive map, feed-based discovery interface, and business profile screens combine to create a seamless and engaging user exploration experience. ๐Œ๐ž๐๐ข๐š ๐’๐ญ๐จ๐ซ๐š๐ ๐ž AWS S3 or Firebase Storage handles all images, business media, and user-generated content securely and at scale. ๐‚๐จ๐ง๐ญ๐ž๐ง๐ญ ๐ƒ๐ž๐ฅ๐ข๐ฏ๐ž๐ซ๐ฒ Optimized media rendering ensures fast loading of visual feeds and business profiles for a smooth and responsive user experience. ๐’๐ž๐œ๐ฎ๐ซ๐ข๐ญ๐ฒ ๐š๐ง๐ ๐๐ž๐ซ๐Ÿ๐จ๐ซ๐ฆ๐š๐ง๐œ๐ž ๐’๐ž๐œ๐ฎ๐ซ๐ž ๐ƒ๐š๐ญ๐š ๐‡๐š๐ง๐๐ฅ๐ข๐ง๐  Encrypted communication and secure storage protect all user and business data across every interaction on the platform. ๐’๐œ๐š๐ฅ๐š๐›๐ฅ๐ž ๐€๐ซ๐œ๐ก๐ข๐ญ๐ž๐œ๐ญ๐ฎ๐ซ๐ž The backend is designed to support a continuously growing user base and handle real-time location queries without performance degradation. ๐„๐Ÿ๐Ÿ๐ข๐œ๐ข๐ž๐ง๐ญ ๐ƒ๐š๐ญ๐š ๐ƒ๐ž๐ฅ๐ข๐ฏ๐ž๐ซ๐ฒ Optimized APIs ensure fast loading of map data, activity feeds, and business profiles for a consistently smooth experience. ๐‘๐ž๐ฅ๐ข๐š๐›๐ข๐ฅ๐ข๐ญ๐ฒ The platform is built for consistent performance across live location-based interactions and real-time updates at all times. ๐’๐ฎ๐ฆ๐ฆ๐š๐ซ๐ฒ Lolo modernizes local discovery by combining real-time location intelligence, interactive mapping, and community-driven content into a single mobile platform. It enables users to seamlessly explore nearby businesses and events while giving businesses a dynamic way to reach local audiences through a unified, scalable, and performance-focused system.
0
73
Cover image for ๐Ÿš—๐ŸŒ Can a navigation system
๐Ÿš—๐ŸŒ Can a navigation system recommend the most fuel-efficient route instead of simply the shortest one? This project was developed as part of my MPhil Remote Sensing & GIS thesis. I designed and developed an intelligent Web GIS routing system that generates and compares four alternative routes between an origin and destination and recommends the most suitable route using a Multi-Criteria Decision-Making (MCDM) approach. Instead of considering only distance, the system evaluates multiple factors such as: โ€ข ๐ŸŒฑ Fuel-efficiency / environmental suitability โ€ข โฑ Travel duration โ€ข ๐Ÿšง Road hurdles and route conditions โ€ข ๐Ÿ“ Travel distance The alternatives are evaluated using a TOPSIS-based decision model, allowing the system to identify the route with the best overall balance rather than simply choosing the shortest path. I also integrated an AI assistant that explains route recommendations in natural language, helping users understand why one route is preferable to the alternatives. Key features: โ€ข Interactive Web GIS navigation โ€ข Four-route generation and comparison โ€ข MCDM/TOPSIS route ranking โ€ข Fuel-efficient route recommendation โ€ข Route distance and travel-time analysis โ€ข Road-condition / hurdle consideration โ€ข AI-generated route explanations โ€ข Interactive route visualization โ€ข Decision-support interface for sustainable mobility Built with Python, Django, GIS, Leaflet/OpenStreetMap, MCDM and AI integration. This research explores how GIS + decision science + AI can support smarter and more sustainable urban mobility.
1
150