Smart Waste Management System

SWMS · Arabic product framing «نظيف» · Cross-platform Flutter

Cross-platform smart waste operations app that connects citizens, field workers, supervisors, and administrators on a single map-first experience—prioritizing urgent bins, guiding crews with real road routes, and turning citizen reports into actionable work.

Alternate tagline: From full bins to fixed routes—one Flutter app for the whole sanitation chain.

My role: End-to-end Flutter client—architecture, multi-role UX, maps, routing, and domain modeling

Material 3 RTL-first (ar-SA) Server-ready repositories

Overview

Urban waste infrastructure is spread out and opaque: people do not always know where the nearest bin is, whether it is safe to use, or how to escalate odor, leaks, or overflow. Operations teams lack a shared picture of container health (fill, gas risk, power) and clear priorities for who goes where first.

SWMS is a digital operations layer for a municipality or private waste company: one mobile client with role-based experiences so the same codebase serves the public (discovery and reporting) and the workforce (execution and oversight). Ideation centered on the map as the primary surface, sensor-style bin intelligence, and Arabic-first UX for real deployment in MENA contexts.

Map-first

Citizens and workers live on Google Maps with OSRM-backed road geometry where possible.

Four roles

Citizen, worker, supervisor, and admin—strict route separation via go_router.

Clean boundaries

Repository contracts so mock or SharedPreferences data swaps for REST without rewriting UI.

Problem

  • Citizens waste time searching for bins, may encounter full or hazardous containers, and have no structured channel to report issues with evidence.
  • Field workers need ordered worklists, context (what is wrong, where, how severe), and navigation that respects roads—not only straight-line distance.
  • Supervisors must coordinate people, not just dots on a map: assignments, open work, and blocked items.
  • Administration needs organization-wide visibility—workforce scale, geography, and demand—for capacity and accountability.

Solution

A Flutter application branded in-app as Smart Waste Management System (SWMS) with Material 3, RTL Arabic default (Locale('ar', 'SA')) and English in supported locales, responsive layout (flutter_screenutil and adaptive containers), and a green-forward visual system (Cairo via Google Fonts, seeded sustainability palette in app theme).

Bins are modeled as intelligent assets: fill percentage, gas level, battery and health, maintenance flag, timestamps, priority from operational rules (BinEntity / calculatePriority), and history readings—so the UI explains why something is urgent, not only where it is.

  • Citizens: map home (Google Maps), markers, road-following navigation via OSRM over HTTP (UserRouteService) with haversine fallback when routing fails.
  • Reporting: structured issues (forms, image_picker, severity) through ReportBloc and repository pattern, plus history so users see follow-through.
  • Workers: assigned jobs (e.g. cleaning vs fixing), status, locations, jobs + map with BinBloc for spatial context; accept/complete workflows at the repository boundary.
  • Supervisors: dashboard with nested routes—profile, worker management (including add worker), operational overview, tasks.
  • Admins: KPI-style cards (supervisors, workers, users, regions) and quick actions for supervisors, workers, and areas—the control tower view of the same ecosystem crews execute in the field.

Roles: who does what

How to phrase it for stakeholders: Admin sets the system; supervisors run the teams; workers close the loop on the ground; citizens supply ground truth through reports.

Role In the product In the app
Citizen Public stakeholder Map of bins, bin details/history, OSRM-backed navigation where possible, report issues with media, report history.
Worker Execution Dashboard and profile; jobs list with types and locations; map co-loaded with bins; accept/complete assignments.
Supervisor Middle management Dashboard sub-routes: overview, tasks, worker roster, add worker—coordination between strategy and crews.
Admin Org owner Org-wide statistics and quick actions for supervisors, workers, and geographic areas.

Design and UX

  • Information hierarchy: map-first for citizens and workers; cards and sections for dashboards; primary green app bars and readable Arabic typography (Cairo).
  • RTL-native: conceived RTL-first for labels, navigation, and layout—not a translated LTR shell.
  • Polish: custom onboarding visuals, shared decorative surfaces, adaptive layouts (e.g. admin stats stack vs two-column on wider screens).
  • Trust and resilience: global error surfaces in main.dart; documented map degradation (placeholder/list fallback when Maps API key is missing) so demos do not hard-crash on misconfiguration.
  • Operations UX: explicit loading and error states on job loads for workers; shortcuts from home toward report and history for citizens.

Case study deep dive

Ideation Architecture Implementation Challenges Outcome

  • Stack: Flutter (Dart ^3.10), flutter_bloc, go_router (including nested supervisor routes), get_it (ServiceLocator), shared_preferences on auth/reports paths, google_maps_flutter, geolocator, http (OSRM), image_picker, intl, equatable.
  • Structure: feature-oriented modules under Features/ (auth, user, Worker, Superviser, Admin) plus shared core for bin domain and presentation.
  • Clean boundaries: repository interfaces in domain layers, implementations in data—AuthRepository, ReportRepository, WorkerJobRepository, BinRepository—so BLoCs depend on contracts, not concrete APIs.
  • Routing: role-specific entry paths (login/register/company password flows per UserType in app_router.dart).
  • Product title in UI: MaterialApp.router title “Smart Waste Management System”—SWMS used consistently in portfolio and demos.

The graduation notes in the repo describe current bin lists and some flows as local/mock or SharedPreferences-backed while the architecture is server-ready—the same screens and state machines can call REST or GraphQL once repository implementations point at your API.

  • End-to-end Flutter client for a multi-role waste operations platform (citizen, worker, supervisor, admin).
  • RTL-first Arabic UX with Material 3, responsive layout, and map-centric flows.
  • Domain-driven bin modeling (fill, gas, battery, priority, history) and BLoC state management.
  • Google Maps + GPS + OSRM road routing with resilient fallbacks.
  • Clean Architecture–style repositories for auth, reports, jobs, and bins aligned with backend integration.
  • Hardening against misconfiguration and runtime errors (permissions, error handlers, map placeholder path).

  • Multi-audience, one codebase: strict route separation, role-specific dashboards, and shared bin domain without duplicating map logic—go_router plus feature folders.
  • Maps, permissions, stability: Android permissions, global error handling, graceful map fallback so the app stays usable when keys or GPS are imperfect.
  • Arabic RTL + responsive density: RTL and ScreenUtil-based scaling for regional deployment, not a shrunk English layout.
  • Realistic navigation without routing vendor lock-in: OSRM over HTTP with timeout and null-safe haversine fallback—demonstrable and cost-aware.
  • Modeling urgency: priority from fill, gas, and time since last service so the map is actionable for operations storytelling, not decorative.

  • One Flutter app that reads as four products: citizen map and reporting, worker job execution, supervisor coordination, admin KPI shell.
  • Operational story: bins as living entities with trends; jobs as work orders; reports as closed-loop feedback from the city.
  • Technical story: BLoC + repositories + DI + typed domain entities—the vocabulary expected for maintainable mobile work.

Quick details

  • Also known as: Swims / SWMS / «نظيف»
  • Role: Flutter client architecture + multi-role UX
  • Type: Smart waste operations (municipality or private operator)
  • Architecture: Features + BLoC + GetIt + go_router
  • Maps & routing: Google Maps, Geolocator, OSRM (HTTP)
  • Localization: Arabic (SA) default, English supported, RTL

Card-ready blurbs

Subtitle (60–90 chars):

Flutter SWMS: maps, citizen reports, worker jobs, supervisor ops, admin KPIs—RTL-first.

One-line pitch: Cross-platform smart waste operations app connecting citizens, crews, supervisors, and admins on one map-first experience.

Arabic summary

الفكرة: تطبيق نظام إدارة نفايات ذكي يربط المواطن بخريطة الحاويات والإبلاغ عن المشاكل، ويربط العامل بمهام مرتبة ومكانية، والمشرف بإدارة الفريق والمهام، والمدير بنظرة إحصائية وتشغيلية على المنظومة.

التقنية: Flutter مع فصل الطبقات (Domain / Data / Presentation) وإدارة الحالة BLoC وتوجيه go_router، وخرائط Google مع مسارات طرق عبر OSRM، وتجربة عربية كاملة اتجاه RTL.

Tech stack

FlutterDartBLoCgo_routerget_it Google MapsGeolocatorOSRMClean Architecture Repository patternMaterial 3RTLi18n Responsive UIimage_pickershared_preferencesequatable