Document9

1

I561 Visual Thinking, Meaning & Form in HCI/dTeam FluxBehavioral Prototypes

h c

i d

Eli Blevis, Associate Professor of Informatics

Gopinaath Kannabiran, Associate InstructorSam Tian Xia, Associate InstructorThai Yue, Mentor

HCI/d ProgramSchool of Informatics & ComputingIndiana University, Bloomington IN USA

SPRING 2014| Version 1.0 I561 INFO-I 561 MEANING AND FORM IN HCI (3 CR) 22095 RSTR 06:00P-09:00P W I2 150

2

Project NineBehavioral PrototypesTeam Flux: Time & Temporal Organization Systems

PrototypeGriot is an interactive family scrapbook made of flexible, touch-responsive OLED “pages”. Griot can be used to record mementoes — photos, videos, audio — or receive them from other devices (such as phones, laptops). It not only displays these, but also links these with dates, places, notes, news articles, popular culture, name meanings, national/cultural symbols, other family relationships and events. As mementoes are added, Griot automatically updates Griot scrapbooks of remote family members. Older mementoes and pages will look aged over time, an environmental cue as to when items were added.

The prototype was made primarily from paper and a binder. An iPhone was used to simulate the audio recording and playback, and video playback. It was built to test the following features:

• Taking a photo• Recording a video• Recording an audio• Tagging people in recordings/photos• Writing captions• Playing a video• Playing recorded audio • Searching people by name, or content by date• Viewing family tree• Loading more pages

3


Process• Create paper prototype • Conduct pilot test• Conduct test with cameras focusing on subject’s actions and body language/reactions

At left: pilot test; at right: test location set-up; the designated video camera (top-left) was focused on the subject’s actions; the designated photo camera (bottom-left) was focused on the subject’s reactions.

4


Results — Taking a PhotoSince our subject was looking at a paper prototype with sample photos she was not sure if she was going to just view the existing samples or if she could also make changes. Once we placed the camera interface on the page, she realized she could actually take photos with the album.

Upper Photo: Subject’s reactionLower Photo: Subject’s action

5


Results — Recording a VideoSince she just took a photo, it was quite easy for her to figure out how to record a video.


6


Results — Recording AudioSince she took a photo, figuring out how to record wasn’t difficult for her. She started a self introduction with the audio recording, typed in caption, and then saved it.


7


Results — Tagging People in Recordings/PhotosShe noticed there were green squares on the recording interface, but since she didn’t know if the device connected to a social network she was not sure if she could tag all her friends.


8


Results — Writing CaptionsOnce a picture was taken, she noticed the caption section, and she hit the “Save” icon after typing the caption.


9


Results — Playing a VideoShe pressed the play icon on a video, and a prepared video we stored on the iPhone was played, she found it was interesting.


10


Results —Playing Recorded AudioWe played the audio she just recorded when she pressed the play audio icon, and she was very happy with this function.


11


Results — Searching People by Name, or Content by DateShe understood the search function, but was a little bit confused about the page navigation function.


12


Results —Viewing Family TreeShe thought if she clicked on the thumbnails, more photos of a particular person will show up.


13


Results — Loading More PagesWhen she reached the last page, she pressed the “Load More Pages” button. After the pages were loaded, she flipped the pages back as instructed. She understood she could now see the rest of the album by flipping pages in the opposite direction.


Technology

Document9