BOOSTER-UX&UI

DESIGN CHALLENGE( A weekend )

On-demand gas delivered while you work. Low prices. High quality. No catch.​

ORIGINAL DESIGN-Returned User Order Process​​

Image uploaded from iOS (4)
Image uploaded from iOS (3)
Image uploaded from iOS
Image uploaded from iOS (1)
Nexus Mock-ups copy 3
Nexus Mock-ups copy
mock up1_3x
BOOSTER1
BOOSTER3
BOOSTER2
BOOSTER4

1. PRODUCT ANALYSES

  • ​​User Benefit-Save time and money.

  • Organize and group information and process.​

2. RETURNED USER SCENARIO

A: The user parked the car before leaving the car to make an order.​

3. PRODUCT POSITIONING -DESIGN DIRECTIONAl PRINCIPLES

  • Tools: Design an information structure that makes it fast and easy to get to content. Organize your information structure in a way that requires a minimum number of taps, swipes, and screens.

  • Content heavy- News/Airbnb

  • Complex serious-Email/Office

  • Light entertainment-Music

  • Immerse-Game

mock up2_3x
Boost Tab
Image uploaded from iOS (4)
Image uploaded from iOS (3)
MAP-Concept_3x

OPTIMIZE POINT-1

 

 

Returned User Scenario

A: The user parked the car before leaving the vehicle to make an order.

 

Action &  Information Priority

Input where is my parked. [Must]

The price of gas. [Must]

See gas station price. [Delighter]

 

SO

I combine these analyses and user needs, depending on their priority, addressed on this screen with elegant visual language and manipulator.

mock up3_3x
ORDER- Concept-one page-check_3x

OPTIMIZE POINT-2

 

PRODUCT POSITIONING -DESIGN DIRECTIONAl PRINCIPLES

Tools: Design an information structure that makes it fast and easy to get to content. Organize your information structure in a way that requires a minimum number of taps, swipes, and screens. — iOS Design Guidelines

 

so

1. The idea was to not break down the process into multiple, then show a confirmation at the end to allow changing each piece individually. The goal is to show everything on 1 screen, and without scrolling.

2. I try to address the manipulators with their own hierarchy.

Image uploaded from iOS (4)
Image uploaded from iOS
Image uploaded from iOS (1)
Nexus Mock-ups copy 3
Nexus Mock-ups copy
mock up4_3x
Iphone_color-Recovered-copy
MAP-Concept_3x
ORDER- Concept-one page-check_3x
button-2
ORDER- Concept-one page-oval_3x
MAP-Concept

My Gallery :)

To play, press and hold the enter key. To stop, release the enter key.