14

Click here to load reader

Smrt ticketing machine

Embed Size (px)

Citation preview

Page 1: Smrt ticketing machine

SMRT Ticketing Machine

Page 2: Smrt ticketing machine

• Buy Standard Card• Deposit Card• Top-Up Ezlink• Check Ezlink• Other service

– Check your past destination, Expiry date of concession

Page 3: Smrt ticketing machine

• My main focus is on the Purchasing of Standard Ticket.

• From what I observed, foreigners and some Singaporeans have difficulties in buying them.

• Or depositing it.

Page 4: Smrt ticketing machine

• So with that as a problem trigger, I set myself to find a way where the user interface(UI) is easily understood when using the UI.

• These are some of the screen shots that I’ve made using MUSE software.

Page 5: Smrt ticketing machine

Main Page

I’ve decided to go with a simple yet obvious layout to prevent any confusion. Using the color red and white is an indication that this UI is in relation to SMRT.

Page 6: Smrt ticketing machine

Buying Standard Ticket (con’t)

My idea was when the user clicked on the “Buy Standard Card” button, it will bring them to this page. As you can see a SMRT train map.

Page 7: Smrt ticketing machine

• When on that page, the user only has to click on the location where they want to go to.

• By clicking on the station name located in the SMRT map of Singapore, it will automatically show the cost of the Standard Ticket (Based on their location)

• Research shows that we tend to have a more clearer understanding of things with visuals.

• By showing them the Map of Singapore, the user have a more clearer view on where the location is.

Page 8: Smrt ticketing machine

• To add on, I will be adding an option on the top right the different colored lines.

Yellow Line

Red Line

Green Line

Purple Line

All Lines

Page 9: Smrt ticketing machine

• This buttons will be there to allow better visuals.

• When every the user clicks on either color, only the selected color will be clear. The rest will fade in the background.

• Allowing more focus on that particular line the user is interested in.

Page 10: Smrt ticketing machine

Example

Yellow Line

Red Line

Green Line

Purple Line

All Lines

Page 11: Smrt ticketing machine

After selecting destination, the interface below will appear

Page 12: Smrt ticketing machine

Color is used to indicate

Indication by color. So that the user can know and how to differentiate the tickets their buying and where they are at.

Page 13: Smrt ticketing machine

Colors Mean?

Blue in color to indicate confirmation

Red in color to indicate termination

Page 14: Smrt ticketing machine

Testing It Out.

• With this design Layout, I want to try and test it out and see if people know/ understand how to use this interface.

• Con’t