Smart SCM

Project Overview

SmartSCM is a centralised supply chain management platform developed for mid-to-large-scale enterprises struggling with fragmented workflows and manual processes. The product streamlines the end-to-end procurement cycle—from Business Order (BO) generation to payment reconciliation—by replacing outdated systems like spreadsheets and fragmented emails.

Problem Statement

Processes were scattered across emails, Excel, & disjointed systems. Vendor delays, poor inventory visibility, & misaligned finance tracking led to missed deliveries & budget issues, lack of seamless end-to-end flow & miss use of the time and funds. Multiple access for approval of the PO create redundancy of the orders and miss communication with vendors and having issues in inventory management like filling the unnecessary items.

Design Process

Based on the research findings, we started addressing the main issues and focused on the solutions for it firstly, Second of all after fixing the issues we started to stream line the flow of the application to create the final product

• Here we breakdown all the application into bits and pieces and started understanding each of the application individually.
• We created few modules based on the requirement and started to ideate how to navigate with all the modules for the best use-case to solve.
• We started doing R&D for each of the module and create one stop application call SmartSCM.
• We did Stakeholder Interviews for modules and details of their expectation of Procurement, Finance, Vendors, etc..

Research Data says

• Role-Based Access – Ensures each user sees only what's relevant and actionable to them.
• User Insight: Users wanted visibility over automation. Dashboards & alerts were prioritised over background rules.
• We initiated ideation with cross-functional groups. Each activity was focused on pain point resolution:
  • Crazy 8s: Generated 50+ raw ideas in 15 minutes—top concepts included predictive PO and chatbot-based finance ticketing.
  • Journey Mapping: For three core users—Procurement Head, Vendor, and Finance Officer—highlighting drop-off points. Captured workflows and friction points across Procurement, Finance, and Vendor Management teams.
  • Card Sorting: Procurement staff grouped navigation terms; results formed our primary menu (PO, Quotes, DOs, Payments, Reports).
  • Dot Voting: 20 participants selected top UX features. The "Real-Time DO Tracker" emerged as the most critical need.
  • Competitive Benchmarking: Studied SAP Ariba, Coupa, Oracle for better understanding & limitations to use.

Research Finding

Workflow

We created a lo-level workflow for our understanding based on the artefacts we collected and had a brainstorming session with our customer for enhancing the application with all necessary modules and navigation to it. This is just the 1st level draft can't show final consolidated Information architecture due to NDA.

Module fixing

• We did competitor analysis for more value adding to the application, How others are selling, what is USP?, What modules they are using?, How they can customise the application based on the requirement and came up with this points

Design Implementation

While started working on the lo-fed we implement a few design insights that we covered while gathering the data or analysis points which need to communicate the actual usage of the application.

1. Progressive Disclosure
   • Complex functions (quote filtering, delivery logs) shown only when relevant.
   • Example: Finance team sees payment info only after PO is marked as delivered.
2. Contextual Alerts
   • Status indicators for each PO, DO, and payment avoid manual checks.
   • Example: A yellow alert shows "Quote Deadline Missed" for escalations.
3. Role-Based Dashboards
   • Each role sees KPIs and data tailored to their function.
   • Example: Vendor sees “Active Quotes” and “Pending DOs”, not internal finances.
4. Edge Case Resilience
   • Cancelled POs, offline payments, and partial deliveries are built-in with exception logs.
   • Smart Alerts — notifications for overdue quotes, pending approvals, or stock mismatches. Example: "You already have 300 units in stock. Are you sure you want to raise a PO for 500?"

Progressive disclosure

Visual Design

Started working on the mockups after both paper work and Lo-fed wireframes, Here started working on the components and variables. The aim is to provide the clear navigation and maintain the consistency across the application. Here some of the mockups are modified and displaying the very first version of the iteration.

The dashboard details

• Created a welcome note with the updates for every day, This will shown on very first time login to the day, this is to make sure the updates should be read compulsory if the user wants to remove it we provided the remove on the top of the panel.
• We are displaying the major updates like the quotes received to the order, the list of ongoing shipments to the users and this can be customised as per the user needs based on the user need
• All of these are customisable widgets that makes user to keep his activity updated all the time.
• Navigation through the side (left nav) will help user to navigate from the module to module without any deviation and the data user changed will be kept saved for some time in the cache.

The Invoicing

• Once after the PO is created with the vendor quotation then our system will raise dummy invoice with the final amount which need to be paid to the vendor.
• Here based on the invoice user can send it to the inventory module admin so that he will start monitoring the order as well because the inventory will be filled this order.
• Here User can add the details or item to it so that the actual order will be updated based upon the approvals
• This can be searched by the order Id and also the quotation raised by the vendor as well. Here we implemented Federated search concept to retrieve the data

The Order preview

• The order preview consists of full order details and the summary of the order.
• Here in the preview we used wizard kind of pattern to go forward and backward to see the data and the current stage of the order.
• The flow was, Once the partner approved the order id, it will go to next step for procuring from the vendors to the logistics for delivering the order to the company.
• Once the Logistics team received the order they will assign the fleet to delivery the order, once assigned owner will be notified.
• There after the tracking id will be generated and will shared, and user can track the order here in same portal.
• All these can be displayed in the left panel in the order preview screen, in such a way we designed the application.

New Application

To problems faced in the creating the order was solved by using all the insights and implementing in the design, here the design goes for 5+ Iterations and multiple discussion with stakeholder and finally the product was ready and how it helps was listed below:

• Increased Efficiency: Automation reduces manual errors and repetitive tasks, allowing users to focus on higher-value activities like strategic decision-making and vendor relationship management.
• Faster Decision-Making: Real-time insights and notifications help users stay informed and act quickly, improving operational speed across departments.
• Better Visibility: Dashboards and real-time tracking give users a clear, centralised view of the procurement process, from PO creation to payment reconciliation, allowing them to anticipate issues and make data-driven decisions.
• Cost Savings: The application reduces procurement cycle times, minimises errors, and ensures timely payments, all of which contribute to significant cost savings over time.
• Faster PO Creation: Smart templates and auto-fill functionality reduce PO creation time by up to 78%, allowing procurement officers to generate and send POs in minutes, rather than hours.
• Vendor Selection Made Easy: With real-time quote comparison, officers can assess pricing, delivery timelines, and vendor reliability at a glance, streamlining the vendor selection process.
• Reduced Errors & Delays: Automated status updates and real-time tracking prevent errors like missed deliveries or incorrect orders, ensuring that the procurement process is seamless and timely.

Appreciation Received✨

We received appreciation for the effort we did and for research we conducted, Putting the extra efforts to delivering the application within the tight timelines and making it extremely efficient.

Project Learnings

• Design for Clarity, Not Just Efficiency: Even if automation saves time, users need to feel in control. Clear UI elements like real-time trackers, progress bars, and status tags build trust and reduce anxiety—especially in high-stakes processes like procurement and finance.
• Role-based UX is essential. Procurement officers need quick PO actions, finance needs reconciliation tools, and vendors want simplicity. Tailoring the experience per persona drove better engagement and satisfaction.
• Building detailed journey maps early helped align user needs with business flows. It ensured we were solving real friction points, not just designing pretty screens.
• Initial discovery was just the beginning. Post-launch usability testing, analytics tracking, and contextual interviews revealed new opportunities and blind spots we couldn't foresee in phase one.