SlideShare a Scribd company logo
1 of 33
GET & GO!
    A touch screen kiosk to get Uni mates going

                                        By Inez Ang


1
USER INTERFACE
    -- Introduction
    Toggles between on-
    campus/off-campus
    mode

    Default toolbar (back,
    forward, bookmark, print,
    email, phone, help,
    search bar)

    Sub menu navigation
    buttons

    Touch QWERTY
    keyboard, automatically
    launches when keyboard
    input is needed.




2
USER INTERFACE
    -- Buttons 1
    Each button has semi-
    opaque text describing
    details of the selection,
    allowing users more
    information at a glance.

    These buttons animate
    one at a time in an anti-
    clockwise order during
    inactivity, acting as a
    demo.

    Once activity is detected,
    the descriptive elements
    are static.




3
USER INTERFACE
    -- Buttons 2
    Clicking on a button with
    a triangle icon launches a
    pull out menu with further
    options.

    A button with a pencil
    icon launches the
    QWERTY keyboard.




4
USER DEMO
    On Campus - Map
    Semi-opaque instructions
    will appear every time a
    new screen is loaded. It
    will disappear once the
    user begins interacting
    with the screen.

    Multiple search terms
    allow the user to input
    one or multiple criteria.

    Zoom bar allows user to
    minimize or maximum
    their view of the map.




5
USER DEMO
    On Campus - Map
    Selecting a search button
    displays a scrollable
    window with various
    search terms.

    Once a search term is
    selected, it is displayed in
    the search button.




6
USER DEMO
    On Campus - Map
    In this example, the user
    has chosen “Finance
    Office” from the “service”
    button.

    The map updates to
    highlight various buildings
    with finance offices and
    also displays the faculty
    name.

    The user can choose to
    narrow the search by
    specifying another search
    term.




7
USER DEMO
    On Campus - Map
    The resulting map is
    displayed showing a path
    from present location.

    Information included –
    Building name, Level and
    room, ETA (in minutes).




8
USER DEMO
    Print
    Selecting the print button
    sends a request to the
    built in printer.

    The map is printed onto
    an index-card sized sheet
    that the user can take
    away.




9
USER DEMO
     Print
     When printing is
     successful, a dialog box
     tells the user where to
     retrieve the printout.




10
USER DEMO
     On Campus - Map
     (room search)
     In another search
     example, a “building” has
     been selected from a
     scrollable menu.

     To enter a number, the
     user clicks on the “room ”
     button and the QWERTY
     keyboard automatically
     launches. A dialog box
     prompts the user.

     “X” allows the user to
     close the keyboard
     window.




11
USER DEMO
     On Campus - Map
     (room search)
     Once any search term
     has been entered, the
     map highlights related
     buildings and displays a
     path and a dialog box
     with requested
     information.




12
USER DEMO
     Email
     Clicking on the email icon
     launches a data entry
     window and QWERTY
     keyboard.

     Cancel closes the
     window, OK sends the
     email.




13
USER DEMO
     Email
     Notification that the email
     has been sent.

     OK closes the dialog box.

     Any error message will
     be displayed in the same
     format.




14
USER DEMO
     On campus - Activity
     Upon launching the page,
     a dialog box appears with
     instructions. Clicking
     anywhere else on the
     screen closes it.

     Today’s events are
     automatically displayed
     during launch.




15
USER DEMO
     On campus - Activity
     Date selector made
     bigger and simpler for
     touch screen interface.

     Select the field to change
     and press “+“ or “-”.

     Clicking on the forward
     arrow allows the user to
     set an end date.

     Back arrow will be
     highlighted during end
     date.




16
USER DEMO
     On campus - Activity
     Arrows allow users to
     move between dates.
     Back/forward arrows will
     highlight based on
     available content.

     The table can be sorted
     by columns. In
     ascending, the tip of the
     triangle will point
     upwards. The chosen
     column will also be
     highlighted.

     Translucent tips appear
     briefly to aid the user.




17
USER DEMO
     On campus - Activity
     Users can refine the
     search with another
     parameter.

     Reveals clubs in chosen
     alphabetical order




18
USER DEMO
     On campus - Transport
     Dialog box appears
     highlighting the search
     options for this page and
     directs them to another
     option should they need
     state-wide transport info.




19
USER DEMO
     On campus - Transport
     Destinations are listed in
     alphabetical order. Users
     can choose listing
     options.

     Users are also able to
     select if they want to
     travel by bus or train.




20
USER DEMO
     On campus - Transport
     A map stating the location
     of the alighting point, bus
     numbers, frequency, ETA
     and fare.




21
USER DEMO
     On campus - Transport
     Should they choose to
     retrieve the timetable of
     the train from Redfern
     station, a list appears
     with various timetables.

     Users can toggle
     between train lines.




22
USER DEMO
     Bookmark
     Selecting the “Bookmark”
     icon from the toolbar, a
     dialog box appears.

     Bookmarks are only
     saved for the day and
     prompts the user to
     consider other options if
     they want to permanently
     save the page.

     Selecting this highlights
     the PRINT/EMAIL/MMS
     options in the toolbar.




23
USER DEMO
     On campus - Discount
     Like in previous screens,
     a help dialog box appears
     when screen is launched.

     Displays specials of the
     day.




24
USER DEMO
     On campus - Discount
     Translucent tips appear
     briefly to aid the user.

     Discounts valid today are
     displayed.

     Clickable options




25
USER DEMO
     On campus - Discount
     When an option on the
     previous list is selected,
     a location map is
     displayed showing the
     details of the student
     discount.




     Jump to
     Off-Campus - Discount
26
USER DEMO
     MMS
     The map can be sent to
     the user’s mobile via
     MMS on selecting the
     option on the toolbar.

     Notification that charges
     will apply.

     QWERTY keyboard
     appears for phone
     number entry.




27
USER DEMO
     MMS
     Notification that MMS has
     been sent to specified
     phone number.




28
USER DEMO
                                              Off campus -
                                              Map/Activity/Transport
                                              In the OFF-CAMPUS mode,
                                              users can search websites for
                                              general information about
                                              Sydney.

                                              MAP – brings up
                                              maps.google.com.au

                                              ACTIVITY – brings up
                                              SydneyConnect.com

                                              TRANSPORT – brings up
                                              131500.com

                                              QWERTY keyboard will be made
     Website is displayed in area marked X.   available by clicking a launch
                                              button.

                                              Users can choose to touch
                                              selections or use the pen stylus
29
                                              provided.
USER DEMO
     Off-campus - Jobs
     Help dialog box appears
     at the launch of the page.

     Background lists job
     applications closing this
     week.




30
USER DEMO
     Off-campus - Jobs
     Selection options in
     clickable categories
     grouped alphabetically.

     Location options are
     displayed in the same
     manner.




31
USER DEMO
     Off-campus - Jobs
     Job search results

     PRINT/EMAIL/MMS
     options are highlighted.




32
USER DEMO
     Off campus - Discount
     With the exception of an
     added “Movies” search
     option, this interface is
     similar to On-Campus
     Discount.




     Jump to
     On-Campus - Discount
33

More Related Content

Viewers also liked

2020 Best CIO Acceptance Speech
2020 Best CIO Acceptance Speech2020 Best CIO Acceptance Speech
2020 Best CIO Acceptance SpeechAnupam Kundu
 
Ecomondo - gestione relitti navali
Ecomondo - gestione relitti navaliEcomondo - gestione relitti navali
Ecomondo - gestione relitti navalimcm&partners
 
"Iot on the field: making smart environments in everyday experience"
"Iot on the field: making smart environments in everyday experience""Iot on the field: making smart environments in everyday experience"
"Iot on the field: making smart environments in everyday experience"CSP Scarl
 
Interview with Elaine
Interview with ElaineInterview with Elaine
Interview with ElaineMsCyprah
 
Csp@scuola2011 seminariointro sagliocco
Csp@scuola2011 seminariointro saglioccoCsp@scuola2011 seminariointro sagliocco
Csp@scuola2011 seminariointro saglioccoCSP Scarl
 
Anorexia nerviosa
Anorexia nerviosaAnorexia nerviosa
Anorexia nerviosafresia016
 
General Overview 100901
General Overview  100901General Overview  100901
General Overview 100901tjbates1
 
Barkloudly pitch-shelters and rescues slideshare
Barkloudly pitch-shelters and rescues slideshareBarkloudly pitch-shelters and rescues slideshare
Barkloudly pitch-shelters and rescues slideshareAnupam Kundu
 
Wilson Altruism
Wilson AltruismWilson Altruism
Wilson Altruismclover66
 
Kemiri sunan The Renewable Energy Sources Cheaper, Cleaner and Greener than P...
Kemiri sunan The Renewable Energy Sources Cheaper, Cleaner and Greener than P...Kemiri sunan The Renewable Energy Sources Cheaper, Cleaner and Greener than P...
Kemiri sunan The Renewable Energy Sources Cheaper, Cleaner and Greener than P...Abraham Pattikawa
 
Wellness in the workplace
Wellness in the workplaceWellness in the workplace
Wellness in the workplacekef52
 

Viewers also liked (17)

2020 Best CIO Acceptance Speech
2020 Best CIO Acceptance Speech2020 Best CIO Acceptance Speech
2020 Best CIO Acceptance Speech
 
Uncover opportunities i
Uncover opportunities iUncover opportunities i
Uncover opportunities i
 
Ecomondo - gestione relitti navali
Ecomondo - gestione relitti navaliEcomondo - gestione relitti navali
Ecomondo - gestione relitti navali
 
"Iot on the field: making smart environments in everyday experience"
"Iot on the field: making smart environments in everyday experience""Iot on the field: making smart environments in everyday experience"
"Iot on the field: making smart environments in everyday experience"
 
La ultima
La ultimaLa ultima
La ultima
 
Interview with Elaine
Interview with ElaineInterview with Elaine
Interview with Elaine
 
Csp@scuola2011 seminariointro sagliocco
Csp@scuola2011 seminariointro saglioccoCsp@scuola2011 seminariointro sagliocco
Csp@scuola2011 seminariointro sagliocco
 
Anorexia nerviosa
Anorexia nerviosaAnorexia nerviosa
Anorexia nerviosa
 
General Overview 100901
General Overview  100901General Overview  100901
General Overview 100901
 
Barkloudly pitch-shelters and rescues slideshare
Barkloudly pitch-shelters and rescues slideshareBarkloudly pitch-shelters and rescues slideshare
Barkloudly pitch-shelters and rescues slideshare
 
Wilson Altruism
Wilson AltruismWilson Altruism
Wilson Altruism
 
L25 human societies
L25 human societiesL25 human societies
L25 human societies
 
Managerial roles
Managerial rolesManagerial roles
Managerial roles
 
Kemiri sunan The Renewable Energy Sources Cheaper, Cleaner and Greener than P...
Kemiri sunan The Renewable Energy Sources Cheaper, Cleaner and Greener than P...Kemiri sunan The Renewable Energy Sources Cheaper, Cleaner and Greener than P...
Kemiri sunan The Renewable Energy Sources Cheaper, Cleaner and Greener than P...
 
Wellness in the workplace
Wellness in the workplaceWellness in the workplace
Wellness in the workplace
 
Thewiseoldman
ThewiseoldmanThewiseoldman
Thewiseoldman
 
Rca paper
Rca paperRca paper
Rca paper
 

Similar to Assignment5 Paper prototype

Interaksi manusia dan komputer
Interaksi manusia dan komputerInteraksi manusia dan komputer
Interaksi manusia dan komputergusfaleo firnando
 
Slide interaksi manusia dan komputer
Slide interaksi manusia dan komputerSlide interaksi manusia dan komputer
Slide interaksi manusia dan komputertheogrouptech
 
Honey Mustard Project Spec
Honey Mustard Project SpecHoney Mustard Project Spec
Honey Mustard Project SpecIzzy Goldman
 
Chapter 6 Basic Navigational Functions1.4.pptx
Chapter 6 Basic Navigational Functions1.4.pptxChapter 6 Basic Navigational Functions1.4.pptx
Chapter 6 Basic Navigational Functions1.4.pptxSantosoWahyudi
 
Chapter 6 Basic Navigational Functions1.4.pptx
Chapter 6 Basic Navigational Functions1.4.pptxChapter 6 Basic Navigational Functions1.4.pptx
Chapter 6 Basic Navigational Functions1.4.pptxdiklatstimartamni
 
Human computer interaction chapter 2 interaction Styles.pptx
Human computer interaction chapter 2 interaction Styles.pptxHuman computer interaction chapter 2 interaction Styles.pptx
Human computer interaction chapter 2 interaction Styles.pptxSHEHERYARali12
 
mit-watch-what-i-do-using-voice-input-to-disambiguate-intent
mit-watch-what-i-do-using-voice-input-to-disambiguate-intentmit-watch-what-i-do-using-voice-input-to-disambiguate-intent
mit-watch-what-i-do-using-voice-input-to-disambiguate-intentAlan Turransky
 
GeoWeb2009 presentation: Long Island Index & OASIS
GeoWeb2009 presentation: Long Island Index & OASISGeoWeb2009 presentation: Long Island Index & OASIS
GeoWeb2009 presentation: Long Island Index & OASISsromalewski
 
Lesson 1. OPENSTREETMAP Basic Operations
Lesson 1. OPENSTREETMAP Basic Operations Lesson 1. OPENSTREETMAP Basic Operations
Lesson 1. OPENSTREETMAP Basic Operations gicait ait
 

Similar to Assignment5 Paper prototype (10)

Interaksi manusia dan komputer
Interaksi manusia dan komputerInteraksi manusia dan komputer
Interaksi manusia dan komputer
 
Slide interaksi manusia dan komputer
Slide interaksi manusia dan komputerSlide interaksi manusia dan komputer
Slide interaksi manusia dan komputer
 
WTE Basic Mapping tools
WTE Basic Mapping toolsWTE Basic Mapping tools
WTE Basic Mapping tools
 
Honey Mustard Project Spec
Honey Mustard Project SpecHoney Mustard Project Spec
Honey Mustard Project Spec
 
Chapter 6 Basic Navigational Functions1.4.pptx
Chapter 6 Basic Navigational Functions1.4.pptxChapter 6 Basic Navigational Functions1.4.pptx
Chapter 6 Basic Navigational Functions1.4.pptx
 
Chapter 6 Basic Navigational Functions1.4.pptx
Chapter 6 Basic Navigational Functions1.4.pptxChapter 6 Basic Navigational Functions1.4.pptx
Chapter 6 Basic Navigational Functions1.4.pptx
 
Human computer interaction chapter 2 interaction Styles.pptx
Human computer interaction chapter 2 interaction Styles.pptxHuman computer interaction chapter 2 interaction Styles.pptx
Human computer interaction chapter 2 interaction Styles.pptx
 
mit-watch-what-i-do-using-voice-input-to-disambiguate-intent
mit-watch-what-i-do-using-voice-input-to-disambiguate-intentmit-watch-what-i-do-using-voice-input-to-disambiguate-intent
mit-watch-what-i-do-using-voice-input-to-disambiguate-intent
 
GeoWeb2009 presentation: Long Island Index & OASIS
GeoWeb2009 presentation: Long Island Index & OASISGeoWeb2009 presentation: Long Island Index & OASIS
GeoWeb2009 presentation: Long Island Index & OASIS
 
Lesson 1. OPENSTREETMAP Basic Operations
Lesson 1. OPENSTREETMAP Basic Operations Lesson 1. OPENSTREETMAP Basic Operations
Lesson 1. OPENSTREETMAP Basic Operations
 

Assignment5 Paper prototype

  • 1. GET & GO! A touch screen kiosk to get Uni mates going By Inez Ang 1
  • 2. USER INTERFACE -- Introduction Toggles between on- campus/off-campus mode Default toolbar (back, forward, bookmark, print, email, phone, help, search bar) Sub menu navigation buttons Touch QWERTY keyboard, automatically launches when keyboard input is needed. 2
  • 3. USER INTERFACE -- Buttons 1 Each button has semi- opaque text describing details of the selection, allowing users more information at a glance. These buttons animate one at a time in an anti- clockwise order during inactivity, acting as a demo. Once activity is detected, the descriptive elements are static. 3
  • 4. USER INTERFACE -- Buttons 2 Clicking on a button with a triangle icon launches a pull out menu with further options. A button with a pencil icon launches the QWERTY keyboard. 4
  • 5. USER DEMO On Campus - Map Semi-opaque instructions will appear every time a new screen is loaded. It will disappear once the user begins interacting with the screen. Multiple search terms allow the user to input one or multiple criteria. Zoom bar allows user to minimize or maximum their view of the map. 5
  • 6. USER DEMO On Campus - Map Selecting a search button displays a scrollable window with various search terms. Once a search term is selected, it is displayed in the search button. 6
  • 7. USER DEMO On Campus - Map In this example, the user has chosen “Finance Office” from the “service” button. The map updates to highlight various buildings with finance offices and also displays the faculty name. The user can choose to narrow the search by specifying another search term. 7
  • 8. USER DEMO On Campus - Map The resulting map is displayed showing a path from present location. Information included – Building name, Level and room, ETA (in minutes). 8
  • 9. USER DEMO Print Selecting the print button sends a request to the built in printer. The map is printed onto an index-card sized sheet that the user can take away. 9
  • 10. USER DEMO Print When printing is successful, a dialog box tells the user where to retrieve the printout. 10
  • 11. USER DEMO On Campus - Map (room search) In another search example, a “building” has been selected from a scrollable menu. To enter a number, the user clicks on the “room ” button and the QWERTY keyboard automatically launches. A dialog box prompts the user. “X” allows the user to close the keyboard window. 11
  • 12. USER DEMO On Campus - Map (room search) Once any search term has been entered, the map highlights related buildings and displays a path and a dialog box with requested information. 12
  • 13. USER DEMO Email Clicking on the email icon launches a data entry window and QWERTY keyboard. Cancel closes the window, OK sends the email. 13
  • 14. USER DEMO Email Notification that the email has been sent. OK closes the dialog box. Any error message will be displayed in the same format. 14
  • 15. USER DEMO On campus - Activity Upon launching the page, a dialog box appears with instructions. Clicking anywhere else on the screen closes it. Today’s events are automatically displayed during launch. 15
  • 16. USER DEMO On campus - Activity Date selector made bigger and simpler for touch screen interface. Select the field to change and press “+“ or “-”. Clicking on the forward arrow allows the user to set an end date. Back arrow will be highlighted during end date. 16
  • 17. USER DEMO On campus - Activity Arrows allow users to move between dates. Back/forward arrows will highlight based on available content. The table can be sorted by columns. In ascending, the tip of the triangle will point upwards. The chosen column will also be highlighted. Translucent tips appear briefly to aid the user. 17
  • 18. USER DEMO On campus - Activity Users can refine the search with another parameter. Reveals clubs in chosen alphabetical order 18
  • 19. USER DEMO On campus - Transport Dialog box appears highlighting the search options for this page and directs them to another option should they need state-wide transport info. 19
  • 20. USER DEMO On campus - Transport Destinations are listed in alphabetical order. Users can choose listing options. Users are also able to select if they want to travel by bus or train. 20
  • 21. USER DEMO On campus - Transport A map stating the location of the alighting point, bus numbers, frequency, ETA and fare. 21
  • 22. USER DEMO On campus - Transport Should they choose to retrieve the timetable of the train from Redfern station, a list appears with various timetables. Users can toggle between train lines. 22
  • 23. USER DEMO Bookmark Selecting the “Bookmark” icon from the toolbar, a dialog box appears. Bookmarks are only saved for the day and prompts the user to consider other options if they want to permanently save the page. Selecting this highlights the PRINT/EMAIL/MMS options in the toolbar. 23
  • 24. USER DEMO On campus - Discount Like in previous screens, a help dialog box appears when screen is launched. Displays specials of the day. 24
  • 25. USER DEMO On campus - Discount Translucent tips appear briefly to aid the user. Discounts valid today are displayed. Clickable options 25
  • 26. USER DEMO On campus - Discount When an option on the previous list is selected, a location map is displayed showing the details of the student discount. Jump to Off-Campus - Discount 26
  • 27. USER DEMO MMS The map can be sent to the user’s mobile via MMS on selecting the option on the toolbar. Notification that charges will apply. QWERTY keyboard appears for phone number entry. 27
  • 28. USER DEMO MMS Notification that MMS has been sent to specified phone number. 28
  • 29. USER DEMO Off campus - Map/Activity/Transport In the OFF-CAMPUS mode, users can search websites for general information about Sydney. MAP – brings up maps.google.com.au ACTIVITY – brings up SydneyConnect.com TRANSPORT – brings up 131500.com QWERTY keyboard will be made Website is displayed in area marked X. available by clicking a launch button. Users can choose to touch selections or use the pen stylus 29 provided.
  • 30. USER DEMO Off-campus - Jobs Help dialog box appears at the launch of the page. Background lists job applications closing this week. 30
  • 31. USER DEMO Off-campus - Jobs Selection options in clickable categories grouped alphabetically. Location options are displayed in the same manner. 31
  • 32. USER DEMO Off-campus - Jobs Job search results PRINT/EMAIL/MMS options are highlighted. 32
  • 33. USER DEMO Off campus - Discount With the exception of an added “Movies” search option, this interface is similar to On-Campus Discount. Jump to On-Campus - Discount 33