# Order AI By Munawar Khel / Envase Technologies / Lead UI/UX Designer / 2020–23 / 7 min read Published at https://munawarkhel.com/work/envase-technologies/order-ai/ Order AI turned a manual, error-prone order-entry process into an automated, scalable pipeline, and gave operations teams a way to verify the automation instead of doing the work by hand. - Company: Envase Technologies - My role: Lead UI/UX Designer - Timeline: November 2020 – March 2023 - Platform: Web (Enterprise SaaS), centralized AI document-processing and order-entry hub for drayage and intermodal operations - Category: Enterprise SaaS Product Design - Status: New design, delivered - Tools: Figma, Figma Prototyping, Material UI (MUI) - Team: Cross-functional, collaborating with product management, engineering, and QA ## Context Order AI is an enterprise SaaS platform that eliminates manual order entry for the drayage and intermodal logistics sector. It sits between a drayage company's clients and their Transportation Management System as a centralized hub that takes in shipping documents in many formats, PDFs, tabular files, and multi-page batches, then automatically classifies each type, extracts structured order data, and routes verified orders into the TMS. The product existed to solve a problem specific to this corner of logistics: document diversity at scale. Drayage companies receive orders from dozens of clients, each sending documents in their own format, layout, and data structure. Before Order AI, the only way to turn those documents into TMS orders was for a trained operator to read each one and re-key the data by hand. Traditional OCR could not keep up, because it cannot adapt to format variation without extensive per-client configuration. This project was the end-to-end design of that platform: an automated order entry pipeline, multi-format document handling, machine-assisted document classification, a 4-eyes review workflow, audit and logging systems, an accounting dashboard, user and company management, scheduling, notifications, an onboarding tour, and role-based access across three subscription tiers (Basic, Medium, Advanced). All of it was built on Material UI as a single component system. ## The problem Drayage companies receive hundreds of shipping orders daily from multiple clients, each sending documents in different formats, layouts, and structures. The core challenge was twofold, and both halves compounded as order volume grew. First, manual order entry. Operations staff spent the majority of their time reading incoming documents and typing order data (container numbers, addresses, billing templates, equipment requirements, reference codes) into their TMS. It was time-consuming, since every document needed a trained operator to interpret and transcribe. It was error-prone, since human transcription introduced costly mistakes that cascaded into shipping delays, missed pickups, and billing disputes. And it was unscalable, since growing volume demanded proportionally more data-entry staff, directly cutting into margins. Second, document diversity and format fragmentation. Every client sent orders differently, some as single-page PDFs, others as multi-order batch documents, others as tabular exports, and even within PDFs the layouts varied widely between companies. No single template worked, so operators had to mentally adapt to each client's format. Training was expensive, since new hires needed weeks to learn how to read different document types. And automation was difficult, because traditional OCR failed when it met format variation it had not been configured for. ## What I did The approach was to combine intelligent document classification with automated data extraction, and to wrap both in a human review layer that operators could trust. Instead of forcing every client onto one template, the platform learns to recognize each client's document variants, matches an incoming document to a known variant with a confidence score, and adapts as new formats appear. Once a document is classified, Order AI extracts the structured order fields automatically, so the operator's job shifts from re-keying data to verifying it. That verification is a first-class part of the design rather than an afterthought. A built-in 4-eyes review workflow lets a reviewer validate extracted data against the original document side by side, through Compare and Switch Preview modes, before anything is dispatched. Verified orders flow directly into the client's TMS with real-time status tracking (Processed, Sent to TMS, Accepted by TMS, or TMS Warning), and incoming work is queued in a Request Inbox grouped by company and variant, supporting single-order and multi-order documents in one workflow. Around that core pipeline, the platform provides the systems an enterprise buyer needs: a comprehensive audit trail across three dimensions (audit logs of who did what and when, comment logs for collaborative notes, and property logs of field-level change history), an accounting dashboard that tracks billable metrics by company and date range, multi-tenant company management with role-based access and plan-level feature control, recurring trip scheduling, and Slipview, a split-panel interface for reviewing order details alongside equipment and shipment specifics. The whole system runs on a tiered subscription model, with feature access scaled to each client's plan. ## Outcomes - Shifted the operator's role from transcription to verification, cutting the document processing time per order and reducing the transcription errors that cascaded into shipping delays and billing disputes. - Unified diverse client formats (single and multi-order PDFs, batch documents, tabular exports) into one processing workflow, so operations teams no longer needed a different manual routine for every client. - Kept human oversight in place through the 4-eyes review workflow while still removing the re-keying burden, so accuracy and speed improved together rather than trading off. - Let teams handle higher order volume without adding data-entry staff in proportion, supporting growth from small carriers to enterprise logistics operations. - Supported the business model directly, with a tiered subscription structure and a transparent accounting dashboard that tracked billable activity by company. ## Decisions ### Make document comparison a first-class pattern What: Built the 4-eyes review workflow around side-by-side validation, with Compare and Switch Preview modes that put the AI-extracted data next to the original document, rather than a plain data-entry form. Alternatives: A conventional review form where operators re-check or re-type fields against a document opened separately. Why: The platform's value depended on operators trusting the automation enough to stop re-keying. Putting the extraction and the source document side by side turned verification into fast visual scanning, which kept human oversight in the loop without giving back the time the automation saved. ### Surface classification confidence in the UI What: Designed a variant-aware classifier that shows confidence scores and top matching variants visually (for example an 80% match), letting operators confirm or correct the system's read. Alternatives: Hiding the model's uncertainty and presenting a single classification as a finished result. Why: Document diversity meant the system would sometimes be unsure, and pretending otherwise would erode trust the first time it was wrong. Showing confidence and alternatives let operators calibrate when to accept the AI and when to intervene, and it made the system's continuous improvement visible rather than opaque. ### Design a data-dense, table-first interface What: Made the order list the primary workspace, with inline status indicators, filtering, and batch actions, and expanded detail through side panels and modals instead of full-page navigation. Alternatives: A lighter, more spacious interface that pushed detail onto separate pages. Why: Operations staff process high volumes and need to see and act on many orders at once. A scannable, information-rich table with progressive disclosure kept the throughput the job requires while protecting operators from being buried by the density. ### Adapt the interface to role and subscription tier What: Built role-based access (superadmin, order-review) and plan-level feature control (Basic, Medium, Advanced) so different users and tiers see tailored interfaces with the right features and document-handling capacity, paired with an onboarding tour for new users. Alternatives: One uniform interface for every user and plan, with features simply enabled or disabled behind the scenes. Why: A multi-tenant platform serving small carriers through enterprise operations cannot show everyone the same surface. Matching the interface to role and plan kept each user focused on what they could actually do, supported the tiered business model, and the onboarding tour helped new users find their footing in a complex data environment. ## What I learned Designing an AI-assisted workflow taught me that the interface has to earn trust before it can save time. Operators would only stop re-keying data if they could see the system's confidence and check its work quickly, so the confidence scores and the side-by-side review were not polish on top of the automation, they were what made the automation usable. Treating document diversity as the normal case, rather than an edge case, reshaped the whole design. Once I stopped assuming clean, uniform input and built the classifier, the review flow, and the inbox around variation, the messy reality of dozens of client formats became something the platform absorbed instead of something operators had to fight. In a data-dense enterprise tool, progressive disclosure did more work than any single screen. Layering detail through panels, modals, and Slipview let the order list stay fast and scannable for high-volume work while still giving operators the full context of any order when they needed it. Tags: Information Architecture, Interaction Design, Web, Enterprise SaaS, Dashboard, Logistics, AI Product Design