I redesigned the way people pay for goods and services at a petrol station. This was a rapid design scenario aimed at speed, agility, and UI.

 

UX/ UI Design | 1 week | Professional development

CHAPTER 1

Design Scenario and Research

“The owner of a petrol station is considering enabling new ways for people to pay for their goods/services without visiting the cashier and has come to you for help to solve this problem.”

User Experience research collage

Opportunity

 How might we create an experience that makes paying for goods and services faster, minimize dangers for vulnerable people, especially at night, make buying goods and services fun and convenient, and help users pay less on their purchases in an automatic and painless way?

 

CHAPTER 2

User interface specifications

Kiosk Style

(self-checkout)

  1. System status visibility
  2. System matches real world
  3. User freedom and control
  4. Standards and consistency
  5. Error prevention
  6. Recognition over recall
  7. Flexibility and efficiency
  8. Minimalist aesthetic
  9. Error recognition, diagnosis, and recovery
  10. Assistance and documentation

CHAPTER 3

Final Sketches and Flow

CHAPTER 4

Brandless Prototype

CHAPTER 5

Ui Style Guide

Typography: Roboto

Header 1

Size: 64px

    Buttons styles

    Header 2

    Size 36px

      Header 2

      Size: 20px

        Buttons styles

        Graphics and illustrations

        Promotional Illustrations

          Categories illustrations

            Example items from menu

              CHAPTER 6

              High Fidelity Prototyping

              1. Fun starting page with the different categories for goods and services.  

              2. Customisable items and preferences that are added to the total payment summary.

              3. Add your collection method, and rewards and pay for your order.

              CHAPTER 9

              What I’d like to do next

              1. I would like to know if it is possible to add a kiosk to the fuel pump and if it would be safe. If not that will effect the design of the platform, especially when it comes to calculating and paying for fuel from various pumps. I would add a feature that allows you to find your pump number and license plate, and then the fuel gets added to your docket. 

              2. The next step I would do is to think about how the user might feel about using the gas pump and paying/browsing on the kiosk at the same time. The Kiosk was designed to be one-handed, however, I would be curious to see if the users can actually manage pumping at the same time. 

              3. I would like to show a group of users the platforms and perform a number of preference tests (both with the UI and the placements of the Kiosks). 

                Pretty impressive right? We should talk about it!

                 

                Up next…

                Space power systems