YEBBO MOBILE APP

export default function YebboPhotoMobileAppUI() { const topActions = [ { label: 'New Session', icon: '📸' }, { label: 'Clients', icon: '👥' }, { label: 'Orders', icon: '🧾' }, { label: 'Settings', icon: '⚙️' }, ]; const countries = [ { code: 'US', size: '2 x 2 in', flag: '🇺🇸' }, { code: 'CA', size: '50 x 70 mm', flag: '🇨🇦' }, { code: 'UK', size: '35 x 45 mm', flag: '🇬🇧' }, { code: 'ET', size: 'Custom', flag: '🇪🇹' }, ]; const quickStats = [ { title: 'Today', value: '28', sub: 'photo sessions' }, { title: 'Pending', value: '6', sub: 'prints to deliver' }, { title: 'Revenue', value: '$640', sub: 'today so far' }, ]; const recentJobs = [ { name: 'M. Tesfaye', type: 'US Passport', status: 'Ready to print', time: '2 min ago' }, { name: 'S. Ahmed', type: 'Canadian Visa', status: 'Awaiting approval', time: '8 min ago' }, { name: 'R. Johnson', type: 'Digital Copy', status: 'Delivered', time: '15 min ago' }, ]; return (

YebboPhoto™

Mobile App UI Prototype

Passport and visa photo workflow for office and mobile van operations.

Status

Camera Connected

Global Passport & Visa Photo Center

YebboPhoto

Live

3-Min Service

{topActions.map((item) => ( ))}

Camera Preview

Sony A6400 • USB Tethered

Ready

Face alignment guide

Exposure

Balanced

Background

Compliant

Focus

Locked

Document Type

Select Country & Format

{countries.map((country) => ( ))}

Client Details

Client Name

Phone Number

Email for Digital Copy

{quickStats.map((stat) => (

{stat.title}

{stat.value}

{stat.sub}

))}

Flow

Operator Workflow

Fast lane

{[ ['1', 'Open New Session', 'Choose country, print type, and client profile.'], ['2', 'Live Framing', 'Use overlay guides for face position and background compliance.'], ['3', 'Mouse Capture', 'Take photo directly from tablet or computer control panel.'], ['4', 'Approve & Print', 'Preview, retake if needed, then print or send digital copy.'], ].map(([step, title, desc]) => (

{step}

{title}

{desc}

))}

Recent Jobs

Queue & Status

{recentJobs.map((job) => (

{job.name}

{job.type}

{job.time}

{job.status}

))}

Phase 2

Recommended Next Screens

Add payment, print queue, reprints, and email delivery screens.

{['Capture Screen', 'Client Database', 'Print Queue', 'Delivery & History'].map((screen) => (

{screen}

))}

); }