Software Solutions Company
Designing with AI as a Teammate: A Fingerprint MVP in 5 Days
Designing with AI as a Teammate: A Fingerprint MVP in 5 Days
2025 | PH
MY ROLE
Full-Stack Designer
TEAM
1 Project Manager,
2 Developers.
DELIVERABLES
User Research & interview,
Design System,
Microcopy & UI Content,
Motion Graphics
Mid & High Fidelity Design,
Interactive MVP Prototype,
Accessible Design Considerations
TIMELINE
5 days
My coffee was still warm when the message came in.
Client
typing
Message client
Monday, 9:19 AM
SCALING SMARTER, INSIDE AND OUT.
Growth brought new challenges—like realizing manual attendance wasn’t sustainable.
This client — an established SaaS provider — had built robust platforms for external clients but relied on manual attendance behind the scenes. While it worked well enough at first, they knew modernizing it would boost efficiency and free up time for what really matters.
EMPATHIZE
Hearing the Everyday Voices
I didn’t just read requirements. I listened to the people living with the process every day.
Human Resource
spoke about the constant balancing act—keeping attendance accurate without adding piles of paperwork.
Receptionist
laughed about switching pens every week—a small ritual that revealed how fragile and personal manual tracking really was.
IT
worried about knowing they’d be blamed if the manual process broke down or records went missing.
Junior dev
“If I have to sign in every day, it better not feel like I’m clocking into the FBI.”
That single comment summed up the frustration of rigid, outdated manual systems.
The bigger truth surfaced:
This wasn’t just about tracking attendance — it was about removing the burden of manual routines and replacing them with something seamless, secure, and human.
REFRAMING THE PROBLEM
This wasn’t just about going paperless.
At first, I thought it was just about paper—outdated, messy, and prone to errors. But I observed and talked to some people around, something deeper surfaced. In those small, overlooked moments, I saw friction in the process—
Inaccuracy & Errors
Manual entry is prone to mistakes—missed signatures, illegible handwriting, or duplicate records—that lead to unreliable attendance data.
Psychological safety
Handling attendance data manually created privacy concerns, leading to a lack of confidence in how personal information was treated.
Time-Consuming
Employees and HR spend unnecessary time managing, verifying, and correcting attendance sheets instead of focusing on more valuable work.
Security Risks
Paper records can be lost, damaged, or accessed by unauthorized people, putting sensitive employee information at risk.
I reframed their ask into a single compass question:
How might we make tracking attendance fast, safe, and easy?
DESIGN PRINCIPLE
To steer the design process, I distilled our team’s brainstorming into four core design principles that shaped every decision moving forward.
Efficiency First
Optimize operational efficiency by minimizing time spent on daily attendance tasks.
Privacy by Design
Ensure users understand what data is collected, how it's used, and who can access it—while giving them meaningful control over their personal information.
Error-Resistant
Minimize human error by limiting manual data entry and leveraging smart system checks for accuracy and consistency.
Secure & Accessible
Built to protect, designed to disappear. We made data security feel invisible so users could focus on what matters.
before moving to wireframing phase, I first mapped out project requirements, branding inputs, user data needs, and tech specs. That groundwork ensured the UI aligned with user, client expectations and developer realities.
Design system
Design system
Composed of foundation, UI Kit, auto-layout and assets.
SMARTER, FASTER MID-FI DESIGN
How I leverage AI to speed-up my wireframing phase.
Instead of starting from scratch, I used Google Stitch to rapidly generate High Fidelity wireframes. This let me visualize ideas instantly and gather early feedback without slowing down momentum.
These early drafts were conversations in visual form. I tested messaging, screen logic, and interaction patterns that could make a biometric system feel less like surveillance and more like a welcome mat.
Every iteration brought us closer to a design that felt clear, respectful, and seamless—from registration to daily check-in.
Fingerprint Registration - Personal Info
DESIGNING THE FIRST HANDSHAKE
Making biometric registration feel simple,
safe, and human
Moving beyond static screens, I built an interactive prototype that reflected not just functionality—but emotion. With Figma Make tool, I refined the flow to be simple, reassuring, and human-centered. Each screen guided users with clarity. Each interaction respected their identity. From consent to confirmation, the prototype brought our design principles into motion—efficient, secure, and thoughtfully personal.
Privacy, not as a setting— but as a standard.
Privacy, not as a setting— but as a standard.
Every detail is safeguarded—kept private, never shared, and always under your control.
Start without the start.
Start without the start.
With BambooHR, your details are ready the moment you are.
Know exactly what to do.
Know exactly what to do.
Straightforward instructions guide every step, so nothing feels complicated.
The data shown in this video is for placeholder purposes only and is intended for prototype demonstration.
Clarity isn’t just written—it’s experienced
Clarity isn’t just written—it’s experienced
watch how they shape the flow in motion.
CHECK-IN THAT DISAPPEARS
Check-in designed Invisibility with intent.
With trust established at registration, it was time to design what employees would experience every day: Check-In.
And my goal was simple but ambitious:
Make it so seamless, so effortless, that it felt like nothing at all.
Like placing your hand on the door—and it just opens.
The data shown in this video is for placeholder purposes only and is intended for prototype demonstration.
THE DEMO
From Prototype to Approval
I presented the MVP to client and key stakeholders.
Walked them through registration.
Let them experience the check-in.
When it ended, they leaned back and said:
“This looks and feels like something we could actually sell.”
They approved the rollout immediately.
WHAT CHANGE
Impact in Action: Before Meets After
While the designs are yet to be fully implemented, we benchmarked the prototype against the manual attendance and defined clear KPIs for success:
Scan Accuracy
Business
System reliability and entry validation
before
Unverified
entries
After
99% scan accuracy
99% accuracy achieved
By integrating biometric scanning, the system ensured precise identity validation and reduced manual errors.
Record Management
Business
Transition from paper to digital logging
before
400+ sheets/mnth
After
100% digital
Fully paperless operations
All attendance records are now stored digitally, eliminating manual logs and improving traceability.
Check-in Time
Business
Speed of employee verification
before
20–30 sec/person
After
5–7 sec/person
75% faster check-ins
Optimized biometric workflows reduced average check-in time, minimizing queues during peak hours.
HR Clean-up Time
Business
Time spent reconciling attendance data
before
6–8 hrs/week
After
<30 mins/week
Saved 7+ hours weekly
Automated reporting eliminated manual data cleanup, allowing HR to focus on strategic tasks.
The biggest takeaway wasn’t in numbers—it was in feedback.
A front-end engineer shared, “I actually liked registering. It was smooth. Didn’t feel weird.”
That’s the impact of thoughtful UX.
WHAT NEXT?
Refining & Expanding the Experience.
Admin System
Validation States
Manual Attendance
PIN/Manual
Biometric Ethics & Lifecycle Enhancement
REFLECTION
Beyond the scanner and registration.
When I was tasked with designing a biometric system in just five days, I expected a sprint. What I didn’t expect was a shift—from building a tool to rebuilding trust.
I noticed it in the awkward pauses at check-in, the nervous questions about data. This wasn’t just about fingerprints. It was about feeling seen without being exposed.
So I listened, observed, and reframed the problem—not as a tech upgrade, but a culture shift.
To move fast without cutting corners, I leaned on AI.
By the end, what we built wasn’t just efficient—it was thoughtful. A system that quietly said, “We see you. And we respect you.”
FINAL THOUGHT
Where Technology Meets Humanity.
Behind every scan is a story.
And if we design with care, even the most technical moments—like biometric registration—can become rituals of belonging.
This project proved that speed, security, and humanity don’t have to compete. With the right tools, they can coexist.
Let's be friends!
Let's be friends!
Made with coffee after gym.
© 2025