Project Overview
A cross-platform e-commerce app developed for a well-known retail brand using the Flutter framework, with a single codebase supporting both iOS and Android. The app integrates a complete shopping flow, membership system, store navigation, push notifications, and seamless integration with the existing ERP system.
After launch, the app achieved 50,000+ downloads, 15,000+ monthly active users, and online orders grew to 25% of total sales.
Core Features
1. Product Browsing and Search
- Category browsing with tag filtering
- Smart search (supports pinyin and keyword input)
- Product recommendation algorithm
- Efficient image loading and caching
// Product list widget (with infinite scrolling)
class ProductListView extends StatelessWidget {
final ProductController controller = Get.find();
@override
Widget build(BuildContext context) {
return Obx(() => NotificationListener<ScrollNotification>(
onNotification: (notification) {
if (notification is ScrollEndNotification &&
notification.metrics.extentAfter < 200) {
controller.loadMore();
}
return false;
},
child: GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
childAspectRatio: 0.7,
crossAxisSpacing: 12,
mainAxisSpacing: 12,
),
itemCount: controller.products.length,
itemBuilder: (context, index) {
final product = controller.products[index];
return ProductCard(product: product);
},
),
));
}
}
2. Shopping Cart and Checkout
- Real-time shopping cart synchronization
- Multiple payment methods (credit card, Apple Pay, Line Pay)
- Coupons and discount codes
- Order tracking
3. Membership System
- Social login (Google, Apple, Facebook)
- Membership tiers and reward points
- Wishlist
- Order history
4. Store Navigation
Integrated Google Maps for nearby store search and navigation:
// Nearby store search
class StoreLocatorService {
final GoogleMapsService _mapsService;
Future<List<Store>> findNearbyStores(LatLng userLocation) async {
final stores = await _storeRepository.getAll();
// Calculate distances and sort
final storesWithDistance = stores.map((store) {
final distance = _calculateDistance(
userLocation,
LatLng(store.latitude, store.longitude),
);
return StoreWithDistance(store: store, distance: distance);
}).toList();
storesWithDistance.sort((a, b) => a.distance.compareTo(b.distance));
return storesWithDistance.take(10).map((s) => s.store).toList();
}
}
Technical Architecture
+----------------------------------------------------------+
| Flutter App |
| +-------------+ +-------------+ +-------------+ |
| | Product | | Shopping | | Membership | |
| | Module | | Cart Module | | Module | |
| +-------------+ +-------------+ +-------------+ |
| +-------------+ +-------------+ +-------------+ |
| | Order | | Store | | Push | |
| | Module | | Module | | Module | |
| +-------------+ +-------------+ +-------------+ |
+----------------------------------------------------------+
| GetX State Management |
+----------------------------------------------------------+
| +-------------+ +-------------+ +-------------+ |
| | REST API | | Firebase | | Stripe | |
| | Client | | FCM/Auth | | Payment | |
| +-------------+ +-------------+ +-------------+ |
+----------------------------------------------------------+
|
v
+----------------------------------------------------------+
| Backend Services |
| +-------------+ +-------------+ +-------------+ |
| | Product API | | Order API | | Member API | |
| +-------------+ +-------------+ +-------------+ |
| | |
| +----+----+ |
| | ERP | |
| | Integ. | |
| +---------+ |
+----------------------------------------------------------+
Project Results
- Development efficiency: Single codebase, dual-platform deployment
- Performance: Launch time < 2 seconds, smooth page transitions
- User ratings: App Store 4.7, Google Play 4.5
- Conversion rate: App order conversion rate 40% higher than web
Client Testimonial
"Flutter allows us to iterate on new features quickly while maintaining a consistent experience across both platforms. The team's technical expertise and communication efficiency were excellent." — Product Manager