Indogrosir Supply Chain System Case Study - Project

Bridging Efficiency and Accessibility

Indogrosir is a major wholesale network, but their digital presence had a gap. Their partners (small minimarkets and resellers) struggled with manual inventory tracking, while their public website presented an opportunity to improve the customer experience.

In this project, I act as a Fullstack Developer building a logic-heavy Supply Chain Management system, and as a UI Designer executing a complete visual overhaul of their public identity.

Manual Supply Chains

Through interviews Indogrosir's partners, we uncovered a critical inefficiency. Partners had to manually count their stock and phone in orders. This analog process led to:

Human Error - Forgot to count stock -> Stockouts -> Lost sales.
Delay - Manual order entry took time on both ends.

Automated Reorder Points (ROP)

We built a dedicated SCM portal to digitize this workflow. The core innovation was the Automated Draft Order system.

Instead of waiting for a partner to call, the system tracks inventory usage. When stock hits the ROP threshold, the system automatically generates a draft order. The partner simply logs in, reviews the draft, and clicks "Confirm."

System Architecture & Roles

We built the backend using ASP.NET MVC with C# to ensure robust type safety and structure. The system handles three distinct tiers of access:

Superadmin - Global oversight of all branches.
Branch Admin - Manages inventory flow for their specific location.
Partners - The end-users who view product availability and confirm automated orders.

Technical Challenge

Standard ASP.NET MVC projects often rely on older styling methods (Bootstrap/raw CSS). I wanted to bring the speed of modern frontend development to this traditional framework.

I successfully integrated Tailwind CSS with a custom Node.js Hot Reload configuration.

It allowed me to iterate on the UI instantly without restarting the .NET server for every CSS change. This hybrid workflow significantly accelerated our development speed.

The Public Redesign

Beyond the internal system, I redesigned the public-facing website to improve brand perception.

Visual Refresh - Replaced cluttered layouts with a clean, responsive design.
Branch Locator - Integrated the Google Maps API with map markers to help customers find the nearest Indogrosir branch dynamically.
Product Highlights - A showcase section for current promos, helping convert site visitors into potential partners.

This project bridged the gap between Enterprise Architecture and Modern Frontend Experience.

Business Logic - I learned how to translate real-world SCM concepts (like ROP) into functional code.
Framework Integration - Configuring Tailwind and Node.js to play nicely with a .NET backend taught me a lot about build tools and asset pipelines.
User-Centric Design - By interviewing actual partners, we ensured the Auto-Order feature solved their actual pain (forgetting to order) rather than just being a cool tech feature.

Bridging Efficiency and Accessibility

In this project, I act as a Fullstack Developer building a logic-heavy Supply Chain Management system, and as a UI Designer executing a complete visual overhaul of their public identity.

Automated Reorder Points (ROP)

We built a dedicated SCM portal to digitize this workflow. The core innovation was the Automated Draft Order system.

System Architecture & Roles

We built the backend using ASP.NET MVC with C# to ensure robust type safety and structure. The system handles three distinct tiers of access:

Superadmin - Global oversight of all branches.

Branch Admin - Manages inventory flow for their specific location.

Partners - The end-users who view product availability and confirm automated orders.

Technical Challenge

Standard ASP.NET MVC projects often rely on older styling methods (Bootstrap/raw CSS). I wanted to bring the speed of modern frontend development to this traditional framework.

I successfully integrated Tailwind CSS with a custom Node.js Hot Reload configuration.

It allowed me to iterate on the UI instantly without restarting the .NET server for every CSS change. This hybrid workflow significantly accelerated our development speed.

The Public Redesign

Beyond the internal system, I redesigned the public-facing website to improve brand perception.

Visual Refresh - Replaced cluttered layouts with a clean, responsive design.

Branch Locator - Integrated the Google Maps API with map markers to help customers find the nearest Indogrosir branch dynamically.

Product Highlights - A showcase section for current promos, helping convert site visitors into potential partners.

This project bridged the gap between Enterprise Architecture and Modern Frontend Experience.

Business Logic - I learned how to translate real-world SCM concepts (like ROP) into functional code.

Framework Integration - Configuring Tailwind and Node.js to play nicely with a .NET backend taught me a lot about build tools and asset pipelines.

User-Centric Design - By interviewing actual partners, we ensured the Auto-Order feature solved their actual pain (forgetting to order) rather than just being a cool tech feature.