Graphical User Interface for Unified Payment Gateway for Electronic Devices

Abstract

1. Name of the product in this design: Graphical User Interface for a Unified Payment Gateway for Electronic Devices. 2. Purpose of this design: An electronic device. 3. The key design feature of this product is its graphical user interface. 4. The picture or photo that best illustrates the key design points: Design 1 front view. 5. Design 1 is designated as the basic design. 6. Purpose of the graphical user interface: To provide users with a unified payment gateway page that can simultaneously support the display and interaction of payment functions in multiple scenarios. 7. Human-Computer Interaction Method of Graphical User Interface: The main view of Design 1 displays the initial interface of the unified payment gateway. The interface defaults to card payment and displays detailed order information, card payment user information input area, and payment confirmation button. Clicking the "Card Payment >" button in the main view of Design 1 triggers a pop-up window, and the main view of Design 1 changes to the interface change state diagram 1. The pop-up window displays all selectable payment methods. At this time, the selected method in the option box defaults to card payment. Checking the option box to the right of "QR code payment" changes the interface change state diagram 1 to the interface change state diagram 2. Then the interface will continue to jump to the interface change state diagram 3, displaying the QR code payment display interface. After the QR code payment display exceeds the preset time limit, the interface change state diagram 3 automatically jumps to the interface change state diagram 4, displaying the interface for QR code to be refreshed. Design 2's main view displays the initial interface of the unified payment gateway. The interface defaults to card payment and displays detailed order information, a card payment user information input area, and a payment confirmation button. Clicking the "Card Payment >" button in Design 2's main view triggers a pop-up window, changing the Design 2 main view to Design 2 Interface Change State Figure 1. The pop-up window displays all selectable payment methods, with card payment being the default selected method. Checking the option boxes on the right side of other payment channels besides card payment and QR code payment changes the Design 2 Interface Change State Figure 1 to Design 2 Interface Change State Figure 2. The interface then continues to jump to Design 2 Interface Change State Figure 3, displaying the interface for payment via that other payment channel. 8. Other situations requiring explanation: Other explanation: "X" in the interface represents a text, number or symbol content area. The gray areas in the interface represent variable content.

Images