Anda di halaman 1dari 33

HCI

HUMAN COMPUTER
INTERACTION
Information and Multimedia Technology

w12

Todays Menu
Paper Prototyping (Low-High)
Preparation for Usability Testing
Documentation

Human Computer Interaction

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013

Feature List Table

Usability Testing Phase


High
Fidelity
(Color)

Card
Sorting

Info

Medium Fidelity
Prototype (comp)

Arch

Paper Prototype
1

Usability Test 2

Paper
Prototype
2
Human Computer Interaction

Usability
Test 1
INFORMATION AND MULTIMEDIA TECHNOLOGY
Universitas Ciputra Surabaya - 2013

Iterative Design Process

Creating User Profile


and
User Scenario

User Profile

User Scenario (1)


A scenario is a
description of a
persons interaction
with a system.
Scenarios help focus
design efforts on the
users requirements,
Human Computer Interaction

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013

User Scenario (2)


Scenarios can be derived
from data gathered
during contextual enquiry
activities.
If you do not have access
to such data, you can
write scenarios based on
prior knowledge or even
best guess,

User Scenario (3)


After you have written a scenario, review it and
remove any unwarranted references to systems
or technologies.

Human Computer Interaction

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013

User Scenario - Example


Hari ini adalah Jumat siang dan Budi ingin bepergian ke Kota Makassar
untuk suatu acara bisnis. Tapi, dia masih memiliki 1 hari bebas untuk
dapat menikmati keindahan kota Makassar. Hanya saja dia masih belum
tahu, apa yang akan dilakukan di sana.
Sesampaiya Budi di Bandara, dia ternyata merasa sangat lapar dan dia
tidak tahu harus menuju ke mana. Untuk itu dia membuka gadgetnya
dan melakukan akses ke browser untuk mencari makanan favorit
Makasar. Budi tidak mengetahui apa-apa tentang Makasar dan dia
hanya berbekal gadget nya untuk dapat mencari makan yang paling
enak di kota Makassar dan dia ingin menuju ke tempat tersebut dengan
cepat.
Setelah Budi membuka browser, akhirnya dia menemukan makanan dan
tempat makan yang dia ingin coba. Hanya saja, dia tidak tahu
bagaimana cara menuju ke tempat tersebut karena dia menyewa mobil
sendiri serta tidak ada penjelasan mengenai jam buka-tutupmaupun
berapa harga makanan itu bagi Budi.

User Scenario - Example


Setelah makan siang, Budi ingin pergi
mengunjungi sebuah tempat wisata bernama
Fort Rotterdam yang terkenal itu. Akan tetapi, dia
tidak mengetahui apapun mengenai Makassar
karena ini adalah perjalanan pertama dia ke kota
tersebut.

Usability Testing
(Low Fidelity Prototype)

With task / instruction


To conduct the USABILITY TEST

Usability Task(s) - example


[For Long scenario]
You have to find an Resto Ali for lunch
in Makassar City and order a Coto
Makassar for 2 people. You must go to
there on your rental car.
You have to go to Fort Rotterdam in
Makassar City to have a sight-seeing for
2 hours, booking the entry ticket inadvanced for 2 people and pay using
the application.

Usability Task(s) - example


[For Short scenario]
You have to make a [phone] call to Local
Makassar Tourism Authority Office
You want to know where Makassar is located in
Indonesia.

Usability Task(s) Note Taking


Note the steps under
taken by each users
Note the duration of
each step and the total
time to do the task(s)
Note the feedback
Do not force your users if
they dont know where
the points are located

Testing Script (Intro)


[Welcome the participant, offer them tea or coffee. Offer the opportunity
to
use bathroom facilities.]
Thank you for coming today.
My name is [name]. Were working on the design for [product], and as
part of the process were asking a variety of people to attempt various
tasks using it to see what elements of the design need to be changed.
Id like to stress that were testing the product, and not your abilities. If
you find parts of the product difficult to use or understand, so will other
people, and it will be our job to make sure we make the appropriate
changes to improve it.
As you use the product, there will be other people observing, and Ill
introduce you to them now.
[Introduce participant to observers even if they are in another room].
Todays session will last for approximately one hour. If you want to stop
for a break at any time, just say so.

Interface Design

(Medium Fidelity Prototype)

Medium Fidelity Prototype

Interface Testing
(High Fidelity Prototype)

High Fidelity Prototype

Human Computer Interaction

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013

Medium to High Fidelity

Human Computer Interaction

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013

Testing Questions
1. Whats your first impression when you see
this application?
2. Name a few adjectives to describe this screen?
3. What is the purpose of this application?
4. What does this business/company do?
5. If you were going to click on (some design
elements) where it take you?
6. And what would you expect to see after you
clicked on that?
Human Computer Interaction

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013

Testing Questions
6. What do you think of this (a specific design
element)?
7. Is there anything that you liked in particular?
8. Did you notice this (a specific design element)?
9. Comparing this design with the other
design(s), which one did you prefer?
10. What did you prefer about it?
11. Is there anything you expected to see on the
site that didnt appear?
Human Computer Interaction

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013

Things to do

(Individual & Group Task)


Check your Feature List Table (+group view)
Check your Lo-Fi to Hi-Fi Prototype

Human Computer Interaction

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013

Low Fidelity Test Procedures


Low Fidelity
(Sketches)
-- OWNER --

Low Fidelity
--TESTED TO --

Person A

Person X

Person B

Person Y

Person C

Person Z

Human Computer Interaction

RESULT of Lo-Fi Testing

Person
A+B+C
= Low Fidelity TEAM

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013

Medium Fidelity Test Procedure


Medium Fidelity
(Computerized)
-- OWNER -From LoFi Team Person A
then create Medium
Person B
Fidelity
(computerized
Person C
prototype)

Human Computer Interaction

Medium Fidelity
-- TESTED TO -Person P
Person Q
Person R

Result of Me-Fi
Testing

Person A + B + C
= Medium Fidelity
TEAM

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013

High Fidelity Test Procedure


High Fidelity
(With Colour)
-- OWNER -From Me-FI Team
then create High
Fidelity
(computerized +
coloured prototype)

High Fidelity
--TESTED TO --

Person A

Person K

Person B

Person L

Person C

Person M

RESULT of Hi-Fi
Testing

Person
A+B+C
= Hi-Fi TEAM

Three best team will be funded by University to


construct bigger size of the Tablet Prototype and
gain bonus score for the group.
Human Computer Interaction

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013

Hi-Fi Testing Questions (repeat)


1. Whats your first impression when you see
this application?
2. Name a few adjectives to describe this screen?
3. What is the purpose of this application?
4. What does this business/company do?
5. If you were going to click on (some design
elements) where it take you?
6. And what would you expect to see after you
clicked on that?
Human Computer Interaction

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013

Hi-Fi Testing Questions (repeat)


6. What do you think of this? (point out to a
specific design element)
7. Is there anything that you liked in particular?
(any good element on the apps?)
8. Did you notice this (a specific / unique design
element)?
9. Comparing this design with the other
design(s), which one did you prefer?
10. Is there anything you expected to see on the
site that didnt appear?
Human Computer Interaction

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013

Next Checking
Tuesday 29 October 2013
Any other notification will be posted
on EDMODO Group

Human Computer Interaction

INFORMATION AND MULTIMEDIA TECHNOLOGY


Universitas Ciputra Surabaya - 2013