PageAI — Designing an Intelligent Document Processor for Automation

1. Overview

When I joined SKAEL, my first major project as Lead UX/UI Designer was to bring intelligence and simplicity to one of the most tedious business processes — document handling. PageAI is an Intelligent Document Processor (IDP) that extracts data from files like invoices, PDFs, images, and spreadsheets, and seamlessly integrates with SKAEL’s automation platform.
The vision was clear: empower non-technical users to automate document-heavy workflows with confidence and speed while giving SKAEL a stronger competitive edge in the automation space.

2. Objectives

From Core to Control

V1 – Building the Core
Our initial focus was invoices, the most common and high-value use case. We wanted to help customers process hundreds of invoices at once without manual data entry or technical setup.

‍V1.1 – Evolving with Feedback
Once V1 went live, we noticed users needed more control during the Document Validation phase, especially when PageAI failed to recognize certain data fields. The goal of V1.1 was to make manual corrections faster and more intuitive, while maintaining the overall automation flow.

3. Role & Team

Leading with Versatility

My Role: Lead UX/UI Designer
‍I led the end-to-end design, defining constraints, conducting competitive research, mapping user flows, wireframing, creating high-fidelity mockups, and iterating based on real customer feedback.

Team Composition:
• 1 UX/UI Designer (me)
• 1 Product Manager
• 10+ Engineers (Front-End & Back-End)

4. Why PageAI Mattered

A Pillar for Growth

PageAI wasn’t just another feature, it was a strategic pillar in SKAEL’s vision to scale automation.

‍• It gave non-technical users the power to process documents effortlessly.
• It expanded the automation platform’s capabilities with new use cases like invoice processing and validation checks.
• It directly improved productivity for enterprise clients, while positioning SKAEL as a stronger competitor to IDP (Intelligent Document Processor) leaders like UiPath, Automation Anywhere, and Vic.ai.

‍In short, PageAI made automation more human, accessible, and efficient.

5. Design Process

From Insight to Interface

Competitive Research

To define what “great” looked like, I collaborated with our Product Manager to study leading IDP products such as IQBot (Automation Anywhere), UiPath Data Extraction, and Vic.ai.

Our research focused on:

  • How these tools balanced accuracy, flexibility, and usability.
  • The UX patterns that made them successful, and where they fell short.
  • Opportunities to design something more intuitive and integrated for SKAEL users.

This research became the foundation for PageAI’s architecture and interaction model.

Mapping the Experience

We outlined three key user flows:

  • General IDP Flow — a high-level blueprint of how users interact with any document processor.
  • PageAI Setup Flow — how users configure extraction rules, data models, and document types.
  • Run-Time Flow — how PageAI integrates with SKAEL’s automation platform during execution.

These flows helped the entire team: product, engineering, and QA to stay aligned on user touchpoints and system dependencies before any design work began.

General IDP User Flow
PageAI Setup Flow
PageAI Run-Time Flow

Wireframes

I created mid-fidelity wireframes to visualize how users would upload documents, review extracted data, and validate results. The goal was to spark early discussions about technical feasibility and interaction patterns.

During these sessions, we identified layout constraints, potential API dependencies, and time estimates, which helped the engineering team plan efficiently.

Field Expanded
Document Hovered
Field Queued

Designing PageAI V1

For the first release, we focused on clarity and speed.

I designed the interface to feel structured yet approachable, and showing key document data alongside extraction results in real time. The right-hand column displayed extracted fields, while the document viewer on the left allowed quick verification.

To keep development on track, we opted for mid-fidelity mockups so engineers could start building early while we refined details in parallel.
View Full PageAI V1 Design‍

The beta was showcased to major clients like San Diego Housing Commission and Asurion, receiving positive feedback for simplicity and potential scalability.

V1.1 Iterations — Refining the Validation Experience

After gathering customer feedback, we prioritized three key improvements:

  • Reducing Clutter in Dense Documents
    ‍    Users struggled when documents contained many fields, making the right column overwhelming.
    Solution: Allow users to click directly on values within the document to auto-expand the corresponding field in the validation panel.
  • Manual Input for Unrecognized Data
    When PageAI couldn’t extract certain values, users were stuck.
    Solution: Introduced a “Type-in” feature, allowing users to manually enter missing data. The system now validates input types to prevent errors and improve model accuracy.

    ‍

    • Table Extraction Capability
      ‍      Customers often requested support for invoices containing tables.
      Solution: Collaborated with engineers to define the technical path for table-format recognition, aligning with the roadmap for advanced data extraction.
    6. Impact & Results

    Shaping SKAEL’s Edge

    Despite limited resources and startup constraints, PageAI launched successfully in beta, becoming a core differentiator in SKAEL’s product suite.

    • Positive stakeholder and customer feedback: clients praised its ease of use and automation speed.
    • Adoption by GTM teams: used in demos to attract new enterprise leads.
    • Foundation for scalability: architecture and UI patterns are now reused across other automation modules.

    In short, PageAI helped SKAEL shift from “automation platform” to intelligent workflow ecosystem.

    6. Reflection & Learnings

    Growth Through Constraint

    Winning Moments

    Shifted from Waterfall to Agile Collaboration
    Partnered with PMs and tech leads to create more fluid communication, enabling faster iteration cycles.
    ‍
    Defined Clear Scopes and Constraints
    Improved cross-functional alignment by translating design vision into actionable, technically feasible requirements.

    Bridged Design and Technology
    Learned to think like engineers, designing within machine learning and data extraction limits while still advocating for user clarity.

    Lessons Learned

    Big Picture Thinking Matters
    Every design decision affects scalability and alignment across Product, Marketing, and GTM teams.

    Empathy + System Thinking = Strong Design
    Understanding both user goals and technical realities helped craft experiences that were usable and buildable.

    Leading PageAI taught me how to balance innovation with practicality, and turning an abstract AI concept into something users could understand, trust, and rely on daily. It reminded me that in automation design, success isn’t just about accuracy — it’s about creating experiences that make complex systems feel effortless.

    Back to Home