Here is the breakdown of the design requirements and checklist for your graphic designer to build out the **PayGo Merchant App** mockups: ### **1. Target Layouts & Accessibility** * **Mobile & Tablet Adaptability**: Layouts must scale across standard smartphone and tablet screens to support both retail counter stations and mobile delivery drivers. * **Instant Entry Keypad**: Because the merchant app opens directly without requiring login or biometric verification, the primary screen must feature a prominent, clear numeric keypad for rapid amount entry. ### **2. Payment Mode Hierarchy & Actions** * **Primary Payment Actions**: Display **Tap & Pay** and **Dynamic QR Code** generation as the two main primary visual buttons on the transaction entry screen. * **Secondary Payment Link**: Place the **Send Payment Link** option below the main buttons with lower visual priority for remote sales or customer-service interactions. * **Business QR Formatting**: Design the QR code presentation screen to display business account QR codes clearly so customers can scan and pay instantly. ### **3. Secondary Display & Standby Visuals** * **Customer-Facing Output**: Ensure layout components can scale to secondary customer-facing screens connected to a PC or secondary mobile device. * **Idle Screen Saver**: Design a standby mode screen featuring an animated PayGo logo screen saver when the app enters sleep mode between transactions. ### **4. Outcome Screens & Receipt Actions** * **Transaction Status Feedback**: Create high-visibility confirmation screens for both **Payment Successful** and **Payment Declined** outcomes. * **Digital Receipt Actions**: Include immediate action buttons on the success screen to view and share a transaction receipt or return to the main entry screen. ### **5. Device Provisioning & App Settings** * **Audio Notification Toggle**: Include an app setting interface featuring a toggle switch to enable or disable audible payment success confirmations. * **Device Pairing Screen**: Design a device setup screen where merchants enter a **Device Key** and **Device ID** provisioned from the main PayWise portal to bind new devices. * **Read-Only Profile View**: Provide a read-only settings view displaying the business name, assigned device name, and store location. 🎨 Would you like me to help draft specific UI copy and micro-text for each screen label before your designer begins drafting mockups? The core screens for the **PayGo Merchant App** focus on quick transaction processing and lightweight management: ### **1. Amount Entry Screen (Home)** * **Numeric Keypad**: The primary screen opens directly without requiring login or biometric steps, allowing merchants to enter the purchase amount immediately. * **Primary Payment Buttons**: Features **Tap & Pay** and **QR Code** generation as the two main action buttons. * **Secondary Link Option**: Includes a **Send Payment Link** option positioned below the main buttons with lower visual priority for remote or customer-service sales. ### **2. Dynamic QR Code Presentation Screen** * **Business QR Code Display**: Displays a business QR code generated specifically for the entered transaction amount so customers can scan and pay using their phone. * **Dual-Screen Compatibility**: Supports output to secondary customer-facing mobile or desktop screens if the main station screen cannot be turned toward the customer. ### **3. Transaction Outcome & Feedback Screen** * **Status Confirmation**: Displays clear visual feedback indicating whether the transaction was **Payment Successful** or **Payment Declined**. * **Audio Notification**: Accompanied by an audible payment confirmation sound so merchants can verify payment hands-free. * **Post-Payment Actions**: Offers quick-action buttons to **Show/Share Receipt** or **Return Home**. ### **4. Transaction History & Receipts Log** * **Transaction Log**: Provides a searchable list of all past successful and failed payment attempts. * **Digital Receipt Actions**: Allows merchants to pull up past transactions to view, generate, and share digital receipts with customers or business managers. ### **5. Merchant Settings & Profile Screen** * **Read-Only Profile**: Displays basic business info (Business Name, Device Name, Location) in a read-only format managed from the main portal. * **Audio Toggle**: Includes a setting to enable or disable audio transaction notifications. * **Device Pairing**: Displays the bound **Device ID** and **Device Key** provisioned through the PayWise management portal. ### **6. Idle Standby State** * **Screen Saver**: Features an animated **PayGo logo screen saver** that activates when the app enters sleep mode between transactions. 📱 Would you like to review the corresponding screens for the customer app next? The **PayWise Pay (PayGo) Customer App** is designed for fast, frictionless payments and smart receipt tracking. ### **Core Customer Features (Version 1)** * **Multiple Payment Options**: Customers can complete payments using **Tap & Pay**, scanning dynamic **QR codes**, or opening **payment links**. * **Biometric Authorization**: Transactions are authorized instantly using the device's native **biometric authentication** (such as fingerprint scanning), eliminating the need for slow passwords or OTPs at checkout. * **Tokenized Card Storage**: Securely saves payment card credentials via tokenization during the first transaction. For subsequent purchases, customers can quickly select from their saved cards without re-entering card details. * **Receipt Collection & Tracking**: Allows customers to automatically retain digital receipts linked to app transactions, as well as record non-app purchases (cash, physical card, or mixed payments) using **text or voice notes**. * **Streamlined Registration**: Features a fast, low-friction sign-up process that captures basic profile details (**name, email address, phone number, and date joined**) without requiring upfront KYC burdens. * **Transaction History Log**: Provides a clean activity log where customers can review all past successful payments and view digital receipts. --- ### **Future Planned Features** * **AI Receipt Data Processing**: Automatic extraction and categorization of receipt line items using AI to give customers detailed spending analytics. * **Promotional Cashback**: Introductory cashback rewards (e.g., \$5 cashback on initial purchases or within the first month). * **Points-Based Rewards Program**: Earnable reward points on customer purchases. * **Business Announcement Feed**: An interactive channel where customers can view business promotions, special offers, and pinned merchant announcements. --- 📱 Would you like me to outline a UI screen specification for the **Customer App** similar to what we built for the Merchant App so your graphic designer can visualize both flows side-by-side?