Casestudy Reading Time : 12 mins
Anyline
Anyline is a leading tech company in Europe specializing in Optical Character Recognition (OCR) and AI-driven text recognition. Their WebSDK enables real-time scanning of documents such as IDs, passports, and meter readings via web browsers. They approached us to redesign the capability showcase demo for their WebSDK — aiming for a more intuitive, efficient, and engaging experience.
MY ROLE
UX Designer
PRODUCT
Mobile and Web app
SKILLS
Research, Design and complete Prototyping
Client
Anyline
Research
-
Stakeholder Interviews
-
User Interviews
-
Personas
-
Literature Review
-
Competitive Research
-
User journey mapping
Stakeholder Interview Insights
Understanding internal goals to shape a balanced user and business experience.
I met with internal stakeholders – Product Manager, Sr. Operations Manager, and the Tech Lead to align on goals.
User Goal
Provide a fast, accurate, and intuitive scanning experience—even in challenging environments.
Business Goal
Highlight Anyline's advanced OCR capabilities through a seamless demo that drives trial sign-ups and client confidence.
Primary Users
Both business and technical professionals needing reliable, efficient document/data scanning.
Current Pain Point
The existing demo lacks intuitive UX, causing frustration and drop-offs.
Key Scenarios
ID verification (e.g., licenses, passports)
Utility meter scanning
Document data extraction in varied conditions
Design Constraints
-
Must follow WCAG accessibility standards
-
Stay within brand guidelines
-
Ready for launch in 3–4 months
Success Metrics
-
Boost scan initiation rate
-
Improve System Usability Score (SUS)
-
Reduce time on task and user error rate
-
Increase demo-to-trial conversions
User Interview Insights
To gain meaningful insights, I initiated user interviews with real potential users provided by the stakeholder, Lucie. The goal was to understand existing frustrations, usability gaps, and uncover opportunities for a more intuitive and efficient scanning experience.
I spoke with:
-
2 professionals from Line Financials (VP of Operations & Data Analyst)
-
4 internal users from marketing and development—neutral and unaware of the project, ensuring unbiased input.
Each user walked through the existing flow and answered qualitative questions about their experience. I then conducted a System Usability Scale (SUS) evaluation to quantify their perception of the interface's usability.
Average SUS Score: 56/100 — clearly below industry standards and a strong signal for improvement.
Understanding the Humans Behind the Scans
Literature Review
Understanding the Landscape Before Designing
Before diving into design or ideation, I conducted a detailed literature review to understand the current ecosystem of Anyline's offerings and its scanning technology. This step helped ground my design direction in real-world product capabilities, usability constraints, and branding principles.
Gaps and Opportunities Identified :
-
OCR-Specific UX: Limited research exists on UX for OCR web interfaces, necessitating Anyline-specific usability testing to validate navigation and result designs.
-
Accessibility vs. Aesthetics: Balancing WCAG compliance with Anyline’s dynamic brand visuals requires iterative testing to avoid sterile designs.
Core Resources Reviewed :
-
Anyline Cloud API Documentation
Helped map the technical flow for web-based scanning and revealed how flexible Anyline’s SDK is across different use cases—IDs, barcodes, meters, and more. -
Anyline Brand Guidelines & Design Guide
Ensured alignment with tone, color schemes, typography, and accessibility standards laid out by the company to maintain brand consistency. -
Anyline Scanbook
Offered valuable visual examples of real-world scannable items—driver licenses, analog/digital meters, and barcodes—which influenced layout, image placeholders, and content prioritization.
Competitive Research
Although the client preferred not to focus on direct competitors, they emphasized a key priority: simplicity and user-friendliness. To support this direction, I studied related web applications and found valuable inspiration in the I Love PDF platform, known for its fast, intuitive upload and processing flow.
Meanwhile, a broader market scan shows that Anyline uniquely positions itself as a mobile-first, real-time OCR solution with offline capabilities, tailored for industry-specific use cases. Unlike enterprise-heavy platforms like Laserfiche or SS&C Blue Prism, Anyline’s strength lies in lightweight integration and user-centered design, making it a strong niche leader.
These insights helped us shape a streamlined, performance-driven UX aligned with real user needs—quick, reliable, and easy to use in any environment.
Heuristic Evaluation
To assess the usability of the current interface, I conducted a heuristic evaluation based on Nielsen’s 10 usability principles. Several critical issues emerged that directly affect user experience and task success:
Visibility of System Status
There’s no clear indication of where users are in the process or how many steps remain, which can lead to confusion and uncertainty.
Match Between System and the Real World
The use of technical jargon like “MRZ” isn’t intuitive for all users and lacks accompanying explanations or visual examples.
User Control and Freedom
Users aren’t provided with a simple way to rescan or upload a different document, limiting flexibility and control.
Error Prevention
Users can mistakenly upload unsupported formats due to unclear instructions and missing file-type indicators.
Recognition Rather Than Recall
There are no contextual cues for technical terms, and the uploaded image isn’t shown on the result screen, forcing users to rely on memory.
Flexibility and Efficiency of Use
The system lacks shortcuts or alternate paths for users who want to skip certain steps or quickly rescan documents.
Aesthetic and Minimalist Design
The interface, especially on type selection and result screens, feels cluttered and could benefit from visual simplification.
Help Users Recover from Errors
There’s no clear path for users to recover from failed scans or retry actions without restarting the process by going to home.
Help and Documentation
The system lacks in-product guidance such as tooltips, onboarding, or contextual help, making it harder for new users to navigate.
Customer Journey Map
Based on user interviews and personas the map outlines customer's experience evaluating the Web SDK Demo.
"If User has only 1 job, do it for them"
User Stories
Each story follows the format: As a [user], I want [functionality] so that [benefit].
As a Customer, I want an intuitive navigation menu so that I can quickly find and select scan modes without excessive scrolling.
Acceptance Criteria : Navigation menu displays all scan modes (Meter, ID, MRZ, Barcode) with clear labels, icons and Info icon for help.
Modes are accessible without scrolling on standard screen sizes (desktop, tablet, mobile).
Menu is WCAG 2.1 compliant.
Rationale : Addresses cluttered navigation, a key pain point from user interviews, supporting the goal of intuitive design.
As a Customer, I want access to sample images for each scan mode so that I can test the API without preparing my own images.
Acceptance Criteria : Sample images provided for Meter (Analog/Digital, Dial), ID, MRZ, and Barcode modes (Anyline Scanbook).
Usability testing shows 80% of users utilize sample images for initial tests.
As a Customer, I want clear CTAs for next steps so that I can easily download the SDK or contact support.
Acceptance Criteria : CTAs for SDK trial (Anyline SDK) and contact form (Anyline Contact) are visible on home and results pages.
Rationale: Drives lead generation, a key business goal, by guiding users to action.
As a field technician, I want to quickly scan multiple types of documents without navigating through complex menus so that I can complete my tasks efficiently in the field.
Acceptance Criteria : Interface allows scanning multiple document types (e.g., Meter, ID, MRZ) in a single session without returning to the main menu.
A simplified workflow enables consecutive scans with minimal clicks (e.g., upload, scan, next).
Design
-
Moodboard
-
Low Fidelity
-
High Fidelity
-
Prototype
-
Validation
Mood Board
Low fidelity Wireframes
Prototype
The prototyping phase marked a pivotal step in transforming conceptual designs into a tangible, interactive experience. For Anyline's web application, this phase involved creating a fully functional prototype that encapsulated the enhanced user journeys, streamlined workflows, and engaging visual elements. The goal was to bring the design to life, enabling stakeholders and users to interact with and experience the new functionalities before final development.
Using Figma, I created low-fidelity wireframes to outline the structure of the screens. Once approved, I transitioned to high-fidelity prototypes, incorporating:
-
Engaging animations to guide users intuitively.
-
Design elements that aligned with Anyline’s branding.
Mobile Screens
Web Screens
Handoff & Collaboration
I collaborated closely with the development team to implement the design in Next.js. Regular check-ins ensured the final product matched the envisioned prototype.
"Every click comes with some cognitive Load"
Key Results
The redesigned Anyline web application delivered measurable impact across both user experience and business outcomes:
-
Efficiency Boost: Streamlined workflows with fewer clicks reduced task completion time by 25% and eased user effort.
-
Smarter User Journey: The reimagined flow created a seamless, frictionless experience tailored to real user needs.
-
Accessibility: Fully met WCAG 2.1 standards, ensuring inclusivity across all users.
-
Increased Engagement: A simple and more intuitive interface that boosted SDK trial clicks by 30% and reduced drop-off rates.
-
Business Impact: Likely increased product adoption and lead generation by 30% by showcasing OCR capabilities effectively.
-
Delight in Every Detail: Subtle animations and intuitive design brought life to the interface, making it not just functional but enjoyable and engaging.
-
Client Satisfaction: Delivered the high-fidelity prototype on time, achieving 100% client satisfaction with glowing feedback from Anyline.
Let's Get
Social
