@2025 Chandeshwari All Rights Reserved , Inc.
Copy email
ACCOUNT
ABOUT
9:41
Machiel Jhon
jhonmachiel
Edit profile
Notifications
Change Password
Price Plan
Privacy & Security
Help
About
Settings
Log out
9:41
Scanner
Search
My Scans
See All
Recent Scans
Documents
2 items
Health Insurance
02/12/2017
17:14 p.m
Receipt
04/09/2017
10:20 p.m
Passport Copy
02/12/2017
19:10 p.m
Scanner App Redesign Faster, Smarter, OCR-
Powered
Mobile App
UX/UI Design
Mobile App
|
Overview
As part of an internal competition, we were challenged to design a mobile app using our existing OCR capture framework. I aimed to turn this backend feature into a seamless, user-friendly scanner that simplifies capturing and managing text from documents.
Team
UI Designer (Me)
Software Engineer
Manager
Challenge
The requirements mentioned
Create document capture application.
Should capture the document.
Store the document optimally and securely.
Email the document and save it to the gallery.
My Role
User research and analysis
UX and UI design
Design Library Kit
Usability teat
Impact
The app streamlined workflows by reducing manual data entry and extending the value of our existing OCR framework.
Timeline
1 Week
Tools
Adobe Xd, Figma
Research
Utilize the existing OCR mobile capture framework to create a meaningful, user-friendly scanner app.
Increase the practical value of the framework by identifying and solving real-world pain points.
Demonstrate innovation and user empathy within a constrained development window.
Business Goals
Due to time constraints, I conducted rapid competitive research by analyzing user reviews of popular scanner apps on the App Store. This helped surface high-friction pain points that aligned with user frustrations beyond the original challenge scope:
Missed contact capture from business cards — users often forget to save details immediately, leading to lost connections.
Limited access for students — paywalls restrict essential features for users who need them the most.
Disruptive ads — frequent and intrusive ads break the workflow, especially for users trying to scan on-the-go.
These insights became the foundation for prioritizing real-world problems that the scanner app could address.
User Goals
How Might We...
How might we help users capture contact details instantly to avoid losing important business information?
How might we make scanning tools more accessible for students or users with limited resources?
How might we create a focused scanning experience free from interruptions like ads?
User Goals
Designing
Challenge #1
Business Card Capture Feature
During discovery, I noticed many users lose business cards or delay saving contacts due to manual entry being slow and error-prone. This problem affected a broad audience—professionals, students, and event-goers alike.
Recognizing the strength of our OCR technology, I saw an opportunity to automate this process. The goal became clear: make saving contact info fast, effortless, and accurate.
User Flow
Landing
Onboarding
Register / Login
Home
Folders
Camera
Document
Business Card
Document
Share
Capture
Edit
Save Contact
Capture
Settings
Profile
Price Plan
Logout
Wireframes | Iterations
Home
Camera
Save as
Home screen
Documents
Document share
Mail Document
Menu screen
Visual Design
Use the camera to scan any document and instantly save it to an organized folder.
After selecting the document or business card type, capture it - your scan will instantly appear in edit screen.
Scan, edit, save, and manage documents effortlessly. Every scan is instantly accessible from the Home screen for sharing or saving.
From capture to sharing - In just few taps
UI Design
Breakdown
9:41
Cancel
Auto
DOCUMENT
BUSINESS CARD
Scanning
Save
9:41
Scanner
Search
My Scans
See All
Recent Scans
Documents
2 items
Health Insurance
02/12/2017
17:14 p.m
Receipt
04/09/2017
10:20 p.m
Passport Copy
02/12/2017
19:10 p.m
9:41
Scanner
Search
My Scans
See All
Recent Scans
Documents
2 items
Health Insurance
02/12/2017
17:14 p.m
Receipt
04/09/2017
10:20 p.m
Passport Copy
02/12/2017
19:10 p.m
Figma Prototype
Challenge #2
Accessibility + Ad-Free Workflow
While analyzing app store reviews and competitor models, I noticed two recurring frustrations:
Intrusive ads in free plans disrupt workflow and reduce app reliability, especially during busy moments.
Essential features like exporting or saving scans are often locked behind high paywalls, limiting access for students and budget-conscious users.
These issues created friction, especially for users who needed quick, consistent access but couldn’t or didn’t want to pay upfront.
Problem Insights
“If I just want to email one scanned page quickly, I don’t want to sit through multiple ads or be forced into a subscription.”
This behavior showed a clear gap between basic needs and available models — pushing users either into frustration or out of the app entirely.
User Reviews
User Research
Wireframes | Iterations
Reflection
Thoughtful monetization is part of good UX — it's about aligning business needs with real user pain points.
Visual Design
We places settings in
bottom navigation for quick access to essential controls.
Scan, edit, save, and manage documents effortlessly. Every scan is instantly accessible from the Home screen for sharing or saving.
From capture to sharing - In just few taps
UI Design
Breakdown
Figma Prototype
ACCOUNT
ABOUT
9:41
Machiel Jhon
jhonmachiel
Edit profile
Notifications
Change Password
Price Plan
Privacy & Security
Help
About
Settings
Log out
ACCOUNT
ABOUT
9:41
Machiel Jhon
jhonmachiel
Edit profile
Notifications
Change Password
Price Plan
Privacy & Security
Help
About
Settings
Log out
Price Plan
9:41
9:41
Simple, transparent pricing
Save from 16% with yearly
Monthly
Yearly
For one person
Scanner Free
Scan any document for free, No cost
US$0
/year for one person
Get Started
Key features
For one person
Scanner Pro
Unlock premium content, more powerful
design tools, and features
US$0
/year for one person
Start a free trail
Free users get core features with minimal ads, while paid users enjoy an ad-free, enhanced experience. The model balances user choice with monetization.
Impact
Balanced user accessibility with business sustainability.
Reduced app abandonment caused by ad fatigue or lack of core features.
Encouraged user upgrades through value, not frustration.
Design System
Typography & Color
Inter
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789...()”:....’[].....:
Regular
Medium
Semi-Bold
#FFFFFF
#E3E8E9
Type Style
Heading 01
48 px
Type
Semi-Bold
Body
16 px
Type
Regular
Heading 02
32 px
Type
Medium
Neutral
(Black)
Primary
Neutral
(Black)
Grey
#7B61FF
Won the competition
The business card scanning feature, built within just a week, was well-received and led us to win the competition. Post-competition, the team suggested expanding the app to include contact syncing, LinkedIn integration, and batch scanning to enhance usability.
My Learnings
The importance of quick user research to identify relatable pain points.
Collaborating closely with the team helped refine the concept and move quickly.
Designing for a seamless user experience is key to keeping users engaged.
Time management and prioritizing features are essential when working under tight deadlines.
Testing ideas quickly and iterating based on feedback led to a successful outcome.
If you're interested in learning more or would like to discuss my design process in greater detail, feel free to reach out!
Next project
From Browsing to Buying
UX/UI Design
Fashion website
2023
Back to Home