xPage — Mobile App

xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot
xPage — Mobile App screenshot

Description

This project involved building the frontend of the xPage mobile application using Flutter, aiming for a clean, professional UI mirroring its web counterpart. It supports complex state management for features like authentication and dynamic store switching, where each store maintains unique data including analytics, orders, settings, and currency. The app ensures a seamless user experience across both iOS and Android platforms.

Features

  • Secure user authentication and dynamic store switching.
  • Manages store-specific data: analytics, orders, settings.
  • Dashboard with summary analytics and hosting switcher.
  • Comprehensive analytics with line, bar, and pie charts.
  • Date picker with presets, custom ranges, and comparison.
  • Configurable analytics (hide/show, reorder, compare).
  • Intuitive order list UI with detailed card views.
  • Full order filtering, sorting, and preset options.
  • User profile management: avatar and personal info editing.
  • Smart notifications with deep linking and auto store switch.
  • Clean dark/light mode with intuitive bottom drawers for UX.
  • Cross-platform compatibility for iOS and Android devices.
  • Robust Firebase push notifications (all app states).
  • Seamless Apple OAuth integration for authentication.
  • New user onboarding flow with a skip option.
  • Custom notification sounds for new paid orders.

Tech Stack

  • Flutter for cross-platform mobile UI development.
  • Dart for type-safe and performant application logic.
  • Riverpod for robust and scalable state management.
  • Dio for efficient and type-safe HTTP network calls.
  • Go_router for declarative and deep linkable navigation.
  • Fl_chart for dynamic and customizable data charts.
  • Firebase for reliable push notification services.
  • Apple OAuth for secure native authentication flow.

Key Learnings

  • Mastered complex state management with Riverpod.
  • Implemented deep linking with dynamic store context.
  • Handled cross-platform Firebase push notifications.
  • Integrated secure Apple OAuth for mobile platforms.
  • Designed intuitive and responsive Flutter UIs.

Future Improvements

  • Introduce advanced custom reporting features.
  • Implement multi-language and localization support.
  • Add user-customizable dashboard widgets.
  • Integrate biometric authentication options.
  • Expand third-party service integrations.

Project Links