78
DIRECTING ATTENTION IN AUGMENTED REALITY A Dissertation Presented to The Academic Faculty by Logan Sand In Partial Fulfillment of the Requirements for the Degree Masters of Science in Digital Media in the Ivan Allen College of Literature Media and Communications Georgia Institute of Technology May 2017 COPYRIGHT © 2017 BY LOGAN SAND

DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

  • Upload
    others

  • View
    1

  • Download
    0

Embed Size (px)

Citation preview

Page 1: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

DIRECTING ATTENTION IN AUGMENTED REALITY

A Dissertation Presented to

The Academic Faculty

by

Logan Sand

In Partial Fulfillment of the Requirements for the Degree

Masters of Science in Digital Media in the Ivan Allen College of Literature Media and Communications

Georgia Institute of Technology May 2017

COPYRIGHT © 2017 BY LOGAN SAND

Page 2: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

DIRECTING ATTENTION IN AUGMENTED REALITY

Approved by:

Dr. Michael Nitsche, Advisor School of Literature Media and Communications Georgia Institute of Technology

Dr. Jay Bolter School of Literature Media and Communications Georgia Institute of Technology

Dr. Janet Murray School of Literature Media and Communications Georgia Institute of Technology

Date Approved: April 24, 2017

Page 3: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

To my mother, for all her support. I couldn’t have done this without her, emotionally.

To Jessica Burns, one of my closest friends. I couldn’t have done this without her, literally.

Page 4: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

iii

TABLE OF CONTENTS

LIST OF FIGURES iv

SUMMARY vii

CHAPTER 1. Introduction 1

1.1 Existing Augmented Reality Products 2

1.2 Initial Ideation and Motivation 6

CHAPTER 2. Establishing Research 9

2.1 Graphic Novels and Guiding Attention 9

2.2 Vuforia as a Platform 17

CHAPTER 3. Project Design and Development 21

3.1 Beginning the Process 21

3.1.1 Proving the Concept 23

3.1.2 Creation and Implementation of Markers 24

3.1.3 Types Of Augmentations 26

3.2 Pilgrimage as a Concept 37

3.3 Constructing the Visual Framework 38

3.4 Designing the Augmentations 44

3.5 Incorporating the Augmentations 46

CHAPTER 4. Implementation 49

4.1 Implementing the Augmentations 49

4.2 Testing the Comic 56

CHAPTER 5. Conclusion 59

5.1 The Next Steps 63

REFERENCES 68

Page 5: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

iv

LIST OF FIGURES

Figure 1a – Nintendo 3DS AR card 1

Figure 1b – Vuforia Base Trigger 1

Figure 2 – XCOM The Board Game 3

Figure 3a – PulZar Card 4

Figure 3b – PulZar Game 4

Figure 4 – Crayola Color Alive 5

Figure 5 – Marvel AR Application 7

Figure 6 – Stan Lee, How To Draw Comics The Marvel Way 10

Figure 7 – Eisner’s Comic Panel Flow 11

Figure 8 – The Enigma of Amigara Fault 13

Figure 9 – Astonishing X-Men #1 14

Figure 10 – Eisner’s variation in panel edges 15

Figure 11 – Nintendo 3DS AR use 17

Figure 12a – Regular Vuforia Image 18

Figure 12b – Vuforia Image With Tracking 18

Figure 13 – Marvel’s Avengers AR App 19

Figure 14 – Pokemon Go 20

Figure 15a – Transformers Original 23

Figure 15b – Transformers Augmented 23

Figure 16a – Istochnik, Page one 25

Figure 16b – Istochnik, Page two 25

Figure 17 – Bioshock Lighting Example 27

Figure 18 – Flower Color Example 29

Figure 19 – Dead Space Nursery 30

Figure 20 – Dead Space Sun 31

Figure 21a – Infamous: Second Son Paper Trail: Van 33

Figure 21b – InFamous: Second Son Paper Trail: Phone 33

Figure 22 – The Lost Woods 34

Figure 23 – WiiU Gamepad being used as scanner 36

Figure 24a – Star Trek Klingon 39

Page 6: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

v

Figure 24b – Stargate SG-1 Spirits 39

Figure 25a – White Poodle Moth 40

Figure 25b – Red Poodle Moth 40

Figure 26 – Character Designs In-Comic 40

Figure 27a – Original Panel Normal 41

Figure 27b – Original Panel Augmented 41

Figure 28a – Sketch Layer 42

Figure 28b – Ink Layer 42

Figure 28c – Color Layer 42

Figure 28d – Text Layer 42

Figure 29a – Club Panel Normal 43

Figure 29b – Club Panel Augmented 43

Figure 30a – Page Seventeen Normal 44

Figure 30b – Page Seventeen Augmented 44

Figure 31a – Comic Image 46

Figure 31b – Vuforia Recognition Points 46

Figure 32 – Zero Star Vuforia Grade 46

Figure 33 – Comic Scene within Unity 48

Figure 34a – Lid to the Crate 51

Figure 34b – Crate of Weapons 51

Figure 35a – Key Card Start 52

Figure 35b – Key Card Success 52

Figure 36 – Keypad On Initialization 54

Figure 37 – Keypad, showing incorrect combination 55

Figure 38 – Keypad, showing correct combination 55

Figure 39a – Istochnik, Page Two 60

Figure 39b – Pilgrimage, Page Seven 60

Figure 40a – Showing art style of early pages 62

Figure 40b – Showing art style of late pages 62

Figure 41 – Scott Pilgrim Vs. The World 64

Figure 42 – Pest Caravan by Jessica Burns 65

Page 7: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

vi

Figure 43a – Artace in the comic 66

Figure 43b – Artace fully shaded 66

Figure 44 – Amber Concept Sketches 67

Page 8: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

vii

SUMMARY

Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

becoming a booming market of design, both for technical industry purposes as well as home and

public entertainment. Many game companies, both video and tabletop, have begun to research and

develop for this hybrid medium. However, their designs are almost immediately flawed because it

becomes apparent that they are only just tiptoeing outside of their comfort zones in the creation of

the artifacts. The companies that are used to designing purely digital games use the tangible

creation as just a tool for image recognition without focusing too much on its design aside from

pure utilitarianism, and the companies that are used to designing tabletop games use the augmented

reality as minimal enhancement that’s usually optional for gameplay. The aim of my project is to

address the flux that’s created in any hybrid media when the user’s attention switches between the

digital and the tangible artifacts. I plan to extrapolate from Scott McCloud’s concept of closure

between graphic novel panels to create dynamic interest in an Augmented Reality setting, with the

attention shift between panels serving as a parallel to the shift between digital and physical

mediums.

Page 9: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

1

CHAPTER 1. INTRODUCTION

As virtual reality (VR) becomes a booming market with the Oculus Touch, HTC Vive,

and Playstation VR to name a few, there is little public mention of its predecessor Augmented

Reality (AR). Where VR focuses on immersing the interactor entirely in a digital space and

experience, AR bridges the gap and places digital artifacts in the real world through the use of a

camera. Since it is both physical and digital most companies who make Augmented Reality

experiences tend to stay close to what they are used to developing, and the other medium

becomes almost incidental.

This is not necessarily a problem, but rather a lack of usefulness. If time and resources

are going to go into making part of a product, then shouldn’t that part of the product also have

value? So much augmented reality is done with blocky black and white images or clearly labeled

high contrast ones, and they do not mesh into the augmentation itself. They are used as markers,

and then once the device has recognized them they are obscured.

Fig. 1a-1b: Nintendo 3DS AR card (left) and Vuforia Demonstration Trigger (right)

The biggest reason for this is that images like these, with high contrast and clean lines,

are most easily recognized by the augmented reality programs. Vuforia, a commonly used AR

program, even incorporates an image grader that ranks targets on a scale from zero to five of how

Page 10: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

2

easily the program can recognize the target image. Since these games and experiences are

developed for the mass public, it makes sense that easily recognized images would be used to

avoid any problems in target recognition. These images are lacking any greater context, and

merely serve as a marker for the program to work correctly.

The goal of this project was to design an augmented experience that would be cohesive

between the digital and tangible artifacts, making both halves critical to the full experience.

Graphic novels, or comic books, provided a framework for the execution, since attention is

already divided into segments, though within the same medium. By using the concept of

paneling in comic books as outlined by Scott McCloud and Will Eisner, an augmented graphic

novel could be created that would utilize the companion app in the storytelling as opposed to

providing incidental information to the user. It would allow the panels to dynamically change

and shift to show changes in the story world, building suspense and creating the illusion of

change, even though the comic has been pre-printed and is a static object. The interaction and

agency, or the illusion thereof, comes from the digital application. Because this project is

designing for interaction within a digital space, video games can be used as reference points to

how interaction is done in a digital space even though the app itself is not a traditional video

game. Many of the same principles of interaction apply, and can be used as a basis for guiding

player attention both on the screen and between the screen and the book.

1.1 Existing Augmented Reality Products

The inequality between digital and tangible design in modern Augmented Reality

gaming creates a rift in player attention, because the game designers are designing for

dominant and secondary dynamics. The user’s attention is meant to be focused on one artifact

over the other, with the secondary artifact acting as either a gimmick or a tool. For example, the

Page 11: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

3

board games Munchkin (Steve Jackson Games, 2001) and XCOM: The Board Game (Fantasy

Flight Games, 2014) both have companion apps, but neither are necessary for gameplay. They

serve to assist with rules and scorekeeping, and XCOM’s diegetic design of the application helps

with immersion, but they are ultimately extraneous to gameplay.

Fig. 2: The board game uses the companion app as a way to integrate a digital interface for

rules and scorekeeping, rather than augmenting the game itself.

On the opposing side, digital game developers generally use their tangible artifacts as

markers to place digital objects in set points in the real world. PulZar (PlayStation Vita, 2012)

and the Nintendo 3DS’ Augmented Reality cards (Nintendo, 2011) are both prime examples of

the tangible artifact being a tool. While Nintendo’s AR Cards do have more detailed designs than

the QR-Code styled markers that PulZar uses, they are still utilitarian in their nature. The cards

are made up of straight lines and sharp angles, with very high contrast between the darks and

lights of the colors used.

Page 12: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

4

Fig. 3a: The PulZar game trigger card before the game begins.

Fig. 3b: The PulZar game in progress, with the cards obscured by the app.

The Crayola Color Alive coloring book and companion app is the closest ideal for this

project. In this system, the user has a coloring page and colors it in as they would normally.

Then, once they have finished coloring the page they can scan them with an iPad and see a 3D

recreation of what they have colored. From a technical standpoint all of this has been done

Page 13: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

5

before, where the line-art of the coloring pages acts as an image tracker for the recognition

program. Then the image of the sheet is projected onto a 3D model of whatever the page

represents. This can be done in programs like Vuforia with little problem. However it provides a

more even distribution of attention between the physical and the digital, in the time has to be

taken to color in the page in order for the model to look correct. The pages can be used blank, of

course, but the model will just be paper-white then which is not the intended goal. When the user

colors in the lines they create pencil strokes and striations that then transfer onto the three-

dimensional model in the companion app, so they can immediately see the impact that they have

on the space.

Fig. 4: This is a screenshot from the Crayola Color Alive app, showing the colored model.

Page 14: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

6

Initial Ideation and Motivation

Development for this comic experience began during Dr. Jay Bolter’s Augmented Reality

class at the Georgia Institute of Technology, and began to look critically at augmented reality as

a whole. The first realization was that companies tended to focus on one half or the other when it

came to Augmented Reality, and either the tangible real-world suffered for it, or the application

became unnecessary and therefore unused. Most AR applications relied on some form of QR

code for image recognition, and then the app hid the tag entirely once the experience began. To

me, this seemed less about merging physical and digital, and more about lacking a creative way

to anchor their digital game objects in a physical space. The first key requirement of Augmented

Reality is that “It combines real and virtual content” (Billinghurst, p77, 2015). The idea of

Augmented Reality means to make reality more than it already is, rather than to obscure what

exists in favor of the purely digital. This concept seems to be one that most current developers

are struggling with, because either the Augmented Reality is gimmicky to focus on the tangible

artifact, or the tangible artifact has been reduced as far as it can to a purely utilitarian form. This

means that the interactor still is only focusing on either the tangible or the digital artifact, with

the other serving as a means to an end.

Clarity and ease of recognition is not the only reason that digital game developers lean

towards black and white artifacts with sharp straight lines. The developers want the player to

focus on the digital, and the card itself is just a means of recognition and nothing else. This is

most obvious in the PulZar game, where the cards are simplified QR Codes that the Playstation

Vita recognizes. More often than not with this sort of game, the AR Card is hidden or obscured

once the camera recognizes it. This forces the player to focus solely on the digital artifact,

without being consciously aware of the process that is going on that allows them to see digital

Page 15: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

7

objects projected into the real world. They pay no attention to the tangible marker, because it has

been effectively removed from their field of view.

Games are not the only medium that has tried to augment their features, comic books

have also tried to implement digital artifacts within their pages. Both DC Comics and Marvel

Comics developed AR companion smart-device apps for their comics, but neither one seemed to

fully embrace the digital aspect of the medium. The app released by DC Comics merely overlaid

a text-free version of the comic over the page, and had voice actors reading the text out loud.

Marvel Comics’ app, on the other hand, eschewed the comic entirely and when the AR panels

were scanned it brought up things like character biographies or concept artwork. Both of these

are entirely incidental, and not at all required for the full reading of the comic books. These apps

feel similar to more traditional second-screen apps that television shows use, providing bonus

behind-the-scenes information to be viewed during commercial breaks. It requires its own level

of attention be paid to it, and exists separate of the ongoing story like a behind-the-scenes section

on a DVD menu.

The Marvel AR app, which showed extra artwork but did not change the story.

But what if the app was involved in the story progression? What if the app aided in

telling the story, as opposed to just adding in unnecessary information or reading the book to

Page 16: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

8

you? This was part of the main goals of this project; to develop an augmented reality experience

that would split the user’s attention between the digital app experience, and the physical artifact

that went with it. Graphic novels were chosen as the real-world artifact because the comic panels

themselves could be used as image-recognition markers, which would inherently make the

markers more visually interesting than a QR code.

Graphic novels naturally break down information into timed sections, called gutters.

Gutters are “...That space between the panels” where “...The comic’s reader takes two separate

images and transforms them into a single idea” (McCloud, p66, 1993). This is merely to say that

not every single thing is drawn out in a comic, otherwise it would be a flipbook. But the idea

behind gutters is a powerful one, and one that is exploitable for the purposes of this project.

While the reader may not be consciously aware of it, the gutters are a place where their attention

goes from one point in time to another, within the diegetic space. Each frame is a moment or

series of moments in time, depending on the size of the frame (McCloud, p95, 1993). Larger

frames have more content, and therefore are not just a single snapshot like a smaller frame would

be. The gutters dictates this spacing, since it divides the pages into panels. Since different gutters

have different connotations according to Will Eisner, it stands to reason that there could be a

designated gutter style for augmentation that would act as a trigger without having a specific

marker inside the panel itself (Eisner, p44, 2008). This way, the augmented panels would still be

clearly marked, but in an unobtrusive way that would not impact the artwork and storytelling

within the panels themselves.

Page 17: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

9

CHAPTER 2. 2 ESTABLISHING RESEARCH

Graphic Novels and Guiding Attention

Stan Lee and Joe Buscema speak at length about how comic panels must be set up and

organized in their book Stan Lee’s How To Draw Comics: The Marvel Way. The reader’s eye

needs to flow naturally from panel to panel, and so the action needs to flow in a way that is

smooth, but also helps lead the reader from panel to panel. The way a character faces, or the way

a piece of machinery in the background is laid out, even the direction a character’s eyes are

pointing impacts the direction of the reader’s attention. In the context of this project these same

guiding principles can be used to push the reader from the page, to the app, and back without

having harsh signposts dictating what they have to be doing and how much time must be spent

on it.

Page 18: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

10

Fig. 6: Page 111, Stan Lee How to Draw Comics the Marvel Way

In the above panel, it shows a sketched-out page of panels and demonstrates the concept

of implicit lines. Depth helps a lot to create this, and is the main method of controlling the

reading path. Panel one has Captain America in the foreground with Captain Britain behind him

on the reader’s right. He’s on the same depth plane as Red Skull in the next panel, who is aiming

a gun at Nick Fury. The line created by Skull’s leg and Fury’s shoulder leads the eye to panel

three, where the gun is mimicking this line. Fury’s ankle and elbow are outside the panel itself,

which leads the eye to panel four. This method of directing attention is commonly used by artists

because the mind wants complete images and by leaving parts of a whole outside of a panel it

Page 19: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

11

guides the eye to where the omitted object is; in this case the next panel of the page. In an

augmented reality context, these concepts can be used to guide the reader back into the tangible

object from their device, rather than having the augmentation on a timer and disappearing after a

set length of time. It flows more organically, and lets the reader move at their own pace rather

than the pace dictated by the writer, taking their time where they feel like it is necessary to.

Below, Eisner has illustrated the most basic flow of attention through the panels. In western

comics, the last panel on the page should be in the bottom right corner, and the first page should

be in the top left. There are ways of working around this, such as having a full-page borderless

panel with smaller panels within, but this diagram is the standard basic layout.

Fig. 7: Showing the flow of a six-panel page. (Eisner, p42, 2008)

The fewer panels on a page, the easier this idea of controlling attention is to accomplish.

If the entire page is one panel, then the reader automatically looks at it in the correct order

Page 20: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

12

because there is only one panel to look at. Three horizontal panels stacked vertically are also

almost a guarantee, as each panel will be read, then the reader progresses to the next one down.

With dynamic setup it becomes more difficult to ensure correct reading.

Scott McCloud, in his book Understanding Comics defines a panel as a segment of time.

The longer the panel, the more time is being consumed in it because “In learning to read comics

we all learned to perceive time spatially, for in the world of comics, time and space are one and

the same” (McCloud, p100, 1993). There are limits to this time dilation, namely the width of the

comic page itself. A panel is a moment, though not necessarily a still image. Too much action in

one panel and the reader becomes disoriented and confused, so the panels are broken up by

‘gutters’, or the blank space between panels. The placement of these gutters is crucial because

“We [comic artists] assume as readers that we will know what order to read panels in, but the

business of arranging those panels is actually quite complex. So complex, in fact, that even

seasoned pros will sometimes blow it” (McCloud, p86, 1993). The artist cannot assume that

every reader will think in the exact same way that they do, so the line of progression must be

made clear. While panels can be more than just rectangles, to be sure, the core structure of

comics sticks to a fairly grid-like composition. As shown above in the page from The Enigma of

Amigara Fault, diagonal gutters are used to create tension and unease, especially when they are

only slightly tilted. This page was chosen to show this technique because the panels begin

vertical, then slowly become more slanted as the page progresses. Artists of horror comics and

manga sometimes subtly tilt their gutters in this fashion because it will make the reader

uncomfortable even though they cannot precisely say why.

Page 21: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

13

Fig. 8: The Enigma of Amigara Fault shows the flow of attentive direction. The

characters are facing the linear progression, with diagonal gutters dividing the last two

rows to increase tension. Ito, The Enigma of Amigara Fault

Page 22: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

14

Fig. 9: A panel with no gutters serving as the background

This page from Astonishing X-Men #1 by Joss Whedon is an example of directing

attention with gutters, or lack thereof, while also forcing the reader into a specific mindset. The

two panels at the top are using McCloud’s ideas of small panels being a short segment of time,

but their width keeps them large enough to be interesting. The center panel breaks the gutters and

is zoomed out, giving it a sense of expanse and isolation to the reader. By removing the gutter

Page 23: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

15

lines which are used to denote sections of time, it makes the reader see the large panel occurring

almost simultaneously with the three smaller block panels.

Eisner speaks at length regarding this topic in Comics and Sequential Art, outlining

various ways that comic borders can direct attention and create specific reactions. If the frame is

tight to a subject, then the attention is very direct. The reader is looking at the subject, and little

else. If a frame is large and distant, then the reader is made to feel isolated and alone, even if the

frame is crowded. Likewise, the actual border impacts the reader as well.

Fig. 10: “The ‘panel’ here is actually the doorway. It tells the reader visually that

the actor is confined in a small area within a wider one-- the building.” (Eisner, p49, 2008)

A rough, cloud-like border “...Defines the picture as being a thought or memory...”,

whereas “The absence of a panel outline is designed to convey unlimited space” (Eisner, p49,

2008). Two panels with diagonal parallel lines give a sense of dynamic tension, often used with

fighting characters facing each other. The panel can just be one wide panel stretching all the way

across with the characters on either side, but the line through the middle is symbolic of the break

in communication.

Page 24: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

16

For this project, both McCloud and Eisner are invaluable resources given their experience

with the visual medium of sequential art. Their texts are more commonly used in reference of

structure and composition, but they have gems of attention guidance especially in regards to

panel flow. McCloud speaks in terms of time and the reader, which is important in regards to

splitting attention between two devices. A series of smaller panels take up less time than a few

larger panels, but does that equate whatever augmented reality experience that correlates with

that page is the real question. Eisner’s book talks a lot more about creating emotions and thought

processes, which are crucial for attention. The biggest part of both authors is flow. There needs

to be suggested lines within the panels and between the panels for them to flow properly. This is

the crux of reader attention in comic books. If the flow is broken or reversed, like a character in a

movie crossing across the camera line, then the reader becomes confused and it breaks the

experience for them. The flow of the story determines the flow of the actions, and the flow of the

actions determines the flow of the panels. These decisions need to be planned out in parallel to

each other, in order for the experience to be fully realized with maximum efficacy. The project

would have to be thoroughly planned from the start, otherwise it would fall into the same trap

that Marvel and DC did, of just having a comic book that happens to have a few AR artifacts,

rather than designing a cohesive experience that used both mediums effectively. The

augmentation had to flow with the comic rather than against it, which is why the concept of

gutters was so important from the start. By using the gutters as described by Eisner and McCloud

augmentations could be inserted into the comic, splitting the reader’s attention between page and

screen, without breaking the flow of the comic’s pacing. By keeping and maintaining the flow of

the comic, the reader can translate from the book, to the device, and back again without thinking

consciously about it.

Page 25: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

17

Vuforia as a Platform

As previously stated, Augmented Reality is something that people have been working

with for years, and many people use it in different forms. One that is widely used is image

recognition, where a camera on a smart-device sees a picture and uses a program like Vuforia,

first released in 2013 by Qualcomm, which is made to create and grade image triggers, to project

a digital artifact onto the image. This is how apps like Nintendo’s 3DS AR game works.

Fig. 11: The Nintendo AR cards, and what they look like on a 3DS screen.

Vuforia prides themselves in being “The world’s most widely deployed AR platform”

with over 325,000 registered users and over 35,000 applications made. It is capable of

recognizing simple and complex 3D objects, as well as QR code style markers and custom user-

defined images (vuforia.com, 2017). This project uses the user-defined images, with the specific

comic panels themselves acting as triggers. It can be developed on Android and iOS devices, as

well as Microsoft HoloLens and several other phone-based VR headsets like the Gear, the Knox,

Page 26: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

18

and the View-Master. It can be used with several development kits, the decision was made to use

it with Unity because it was well-documented and stable for use.

These programs do not recognize the image itself, instead there is an algorithm written

that automatically sets key points on images based on contrast, and when the camera detects the

matching points it generates the digital image based on the corresponding points. This means that

AR images within the same app have to be significantly different, otherwise you risk triggering

the wrong image and breaking the experience.

Fig. 12a-b: The regular image (left) and the Vuforia recognition points (right)

This method of AR intervention is used for experiences that are meant to be modular and

taken with the user, but it is not the only AR methodology. Another popular augmentation is

overlay based on camera position. In this style, the app gets the camera’s orientation and then

renders images in relation to it. This can be used anywhere without a physical target, because the

camera is only being used to create a background.

Page 27: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

19

Fig. 13: The Marvel Avengers AR App released shortly after the first movie.

This does not require any image recognition or geolocation, because it is not tethering any digital

artifacts to real-world targets. It is just a game running with an invisible background, so the

camera overlays whatever it sees giving the illusion of the action taking place in the real world.

Images are not required for anchoring digital objects in space, however. With the AR

technique of geofencing, the app can access the internal global positioning system (GPS) and

uses it to find markers placed at geographic coordinates. This is how apps like Pokemon Go

work. Niantic links geographic coordinates to a gym, poke-stop, or pokemon, and then whenever

the player’s phone enters the geofence it triggers the corresponding event.

Page 28: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

20

Fig. 14: Pokemon Go, showing the gyms and poke-stop locations.

Geofencing is the least reliable of the three methods of augmentation, because it relies on GPS

accuracy and margin of error. With the anchor being entirely digital, there is also the risk of user

error where the player thinks they are within the fence, but their phone doesn’t recognize it. This

is in direct opposition to the camera positioning method, where the application doesn’t need to

recognize any tangible artifact to work. Image recognition seems to be the comfortable middle

ground between the two, where the app needs to recognize a real world boundary of some sort,

but everything is consistent between people. It is the same app, and the same trigger images, so it

drastically removes the chances for user error. This is why image recognition was an ideal choice

for an augmented comic, because the experience had to be uniform between readers. Just as a

traditional comic book has the same panels on the same pages from reader to reader, so should

the augmented comic book. By having the augmentations be a part of the plot, it avoids the

failing that DC’s AR app had of not adding anything to the experience. The DC Comics app read

the exact same words out loud that were on the page, and did not actually change anything. The

Page 29: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

21

Marvel Comics AR app brought new content to light, but unfortunately that content was aimed at

a narrow niche like new comic readers. A short biography of who Tony Stark is won’t be

interesting to someone who has been reading comics for decades, for example. By having the AR

experience tie in with the story, it puts all the readers on a level field.

CHAPTER 3. Project Design and Development

Beginning The Process

Pilgrimage was the third iteration of the idea of an augmented comic book, with the first

two serving as stepping stones towards the final product. Initially a proof of concept was made

using a few pages from the IDW comic Transformers: More Than Meets the Eye because it had a

vibrant color scheme and clear line work. The artwork was pre-made and ready to go, and only

needed to be put into a Vuforia library and augmented. This was almost immediately successful,

allowing the project to move on to step two; which was to create original artwork and augment it.

Adobe Photoshop was used to create these test panels, which were then augmented in the same

way as the Transformers panels were. A round of testing was done with two test pages at this

step, and the information gathered was used to create the final product of Pilgrimage.

It is important to plan the comic, including the augmented sections, ahead of time to

make sure the two parts are cohesive and make sense in tandem rather than just having two

separate experiences that are forced together. So, the first step was to find out how to control and

direct attention in a digital setting. Research done in the field of video games was helpful during

this step, because user interfaces focus so strongly on guiding user attention. While the intention

was never to make a traditional video game, the principles can be paralleled with any digital

interactive experience. The problem with a good deal of the existing research was that it was

Page 30: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

22

almost always heavily slanted in the direction of either video games causing or solving attention

problems in younger children. There has been a great deal of research and documentation

regarding attention in interactive mediums, but a majority of it revolves around Attention Deficit

Hyperactivity Disorder (ADHD). Those in support of video games have papers stating that

games cut down on ADHD and other problems, where the opposing side has equally valid-

seeming data saying that video games exacerbate ADHD. When some of these papers are

establishing their background, it is shown that their bias is impacting their research because they

are using surveys with “...Questions [that] reflect the negative impact of video games on social

functioning and relationships including excessive video game use, neglecting work and social

life, anticipation, lack of control, and salience”. (Chan and Rabinowitz, 2008) Chan and

Rabinowitz state outright that they are using questions that reflect the negative impact of video

games, rather than a mix of positive and negative, or better yet neutral questions.

The first thing to do is set a marker. Image recognition style augmented reality needs

markers to work properly, otherwise it boils down to just another companion app. These markers

will also serve as a way to break the reader’s attention in the comic, forcing them to transfer to

their phone or tablet device. The Attention Blink method served as a groundwork for designing

how to mark augmentation, because according to their study participants were able to better

discern information that only had to be identified, rather than categorized. (Johnson and Proctor,

p207, 2004) It was also shown that in a sequence, “...Although participants are able to identify

and report a single target… Report of the second target often fails”. (Johnson and Proctor, p208,

2004). This reasoning is why the decision was made to have only one augmented panel per page,

because any more than that and a hierarchy is formed. One augmentation becomes the primary

one, and the rest become secondary and tertiary with the risk of being glossed over entirely by

Page 31: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

23

the reader. It also served as a structure for relying on a trigger like a block of color, rather than a

more complex icon within the panel itself, since it was postulated in the Attention Blink study

that less complicated triggers are more easily and more quickly recognizable than complex ones.

Proving The Concept

To test whether comic panels could even work as Vuforia triggers, premade comic panels

were taken from IDW’s series Transformers: More Than Meets The Eye and put them into a

Vuforia database, then created a basic scene in Unity using the tutorials provided on Vuforia’s

forums. These panels worked well, due to the high contrast colors and thick, clean lines.

Fig. 15a-b: The original panel (top) and the augmented change (bottom)

While these worked correctly, this step showed a very important flaw about mobile

development that was thankfully discovered early in the process. Originally the intention was to

create full 2D animations for the augmentations, and they had been created for this testing step

using the premade panels and animating the saturation levels. The video textures worked well in

Page 32: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

24

Unity while they were tested, but caused errors during their upload to the iOS device The error

was that mobile devices do not support animated textures from Unity, so it was a relief to learn

that early on with five smaller animations rather than later on in the process with twenty-five

panels in the pipeline. Any animations would have to be done in Unity by animating objects,

rather than importing video files and applying them as textures.

Creation and Implementation of Markers

Over the course of this project contact was established with a professional artist, Jessica

Burns (https://www.artstation.com/artist/burnsjess), about visual ideas and how to keep a full

comic looking cohesive. Ms. Burns earned a B.S. degree from East Tennessee State University,

then went into the professional field with work for Digital Extremes, Play Likely Mobile, and

Van Ryder Games on her resume. She also has extensive experience with sequential art, most

recently with “Pest Caravan” (2016) hosted on Tapastic.com. With this experience she was able

to give useful critique throughout the process of this project, both on the side of the artwork as

well as the interactions.

Originally the plan was to keep the comic’s gutters an average width compared to most

mainstream comics, and use a bright red border around any panels that are augmented. When

speaking to Ms. Burns about this, she warned strongly against it because it would be disjointing

for the reader. The goal was not to break attention, but rather to nudge it in a different direction

and keep the reader inside the flow of the story world. She suggested that the gutter lines be

made wider, and to create a secondary border of a cooler color around augmented panels. What

Ms. Burns explained was that warmer colors appear further forward in the composition than

cooler colors, and since black is the coldest color in the spectrum any color you compare it to

will appear to come forward. The AR panels were then bordered in a bright green, half as wide

Page 33: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

25

as the black gutters themselves. This way the augmented panels could be marked and identified,

but it was not as harsh of a break as the red outlines would have been.

Fig. 16a-b: Two pages from the testing comic, Istochnik

During testing, using the same process as the Transformers panels, these two pages from

the initial comic worked well for Vuforia. Having a mostly grayscale palette to choose from

meant that any colors used would be emphasized, and the green would be unmistakable because

it was the only vivid color being used. Vuforia works best with non-gradiated colors and clearly

defined edges, so it made each panel easily recognizable for the program. The problem for this

comic came when writing the script for it and after a few pages realized that it was writing for a

regular a comic and forcing augmented reality into it, rather than designing a comic to be used

with augmented reality. Unfortunately this meant that the original concept had to be scrapped in

favor of one that would lend itself more readily to the process. By shifting the tone from

Page 34: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

26

obscured exploration to action-adventure, the AR elements fit much more cohesively with the

story and it diegetically makes more sense. This was the main flaw in the Marvel and DC

augmented reality apps, because there was no diegetic action within the digital space. The

information was ultimately extraneous to the story, and not necessary for the full enjoyment of

the comic book.

Types of Augmentations

The next step was to design the augmentations themselves, with each one different from

the last but also unified within the story world. Using video games as the basis for the

augmentations was advantageous, in that it laid the groundwork for what is successful and what

is not. Looking at how games control the player, trends began to emerge in methods for

manipulation.

1. Light and Color

Whether it is being used to illuminate writing on a wall, or having the lights in a room

flicker before going out, light is an effective way to keep attention focused on the device rather

than the book. These are listed together because it is difficult to convincingly change an object’s

color without changing the light shining on the object, or being emitted by the object, in some

way. Light and color are two sides of the same coin, since one cannot exist without the other.

Light illuminates, which allows the eye to experience the color that the light is reflected from.

An example of light guiding attention is on a stage, with Francis Reid saying that stage

lighting is specifically engineered to control the audience. In his book Stage Lighting Handbook,

he postulates that “The obvious technique is to light only the selected area of the stage while the

rest is blacked out. However, it is also possible to make a subtle but positive selection of vision

Page 35: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

27

by balancing the selected area to a brighter level than the rest of the stage. It is surprising how

even the smallest light re-balance can help to concentrate audience attention on the appropriate

action area”. (Reid, p6, 2001) This information can be used directly in augmented reality, by

changing the lighting in a panel it immediately directs the audience from looking at the panel as

a whole, to focusing them on the key element of that panel. In a more digital setting, the

Bioshock games developed by Irrational Games rely heavily on darkness and light to direct

attention. One scene in particular had a power-up on a pedestal beneath a spotlight, with enemies

hiding in the darkness around the player. They’re there and immediately dangerous, but almost

no players see them because they are so focused on the power-up.

Fig. 17: A high-contrast area in Bioshock, showing where you need to go while obscuring

enemies and traps. (PS3)

Color serves as a gradient rather than a scale, because there are shades and combinations

of different colors whereas light is a sliding scale of off to on. According to Elliot and Maier,

“Those with normal color vision experience a vast and rich chromatic palette, with estimates

Page 36: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

28

reaching up to 2.3 million discernible colors that may be seen together in an “almost infinite”

number of possible combinations” so it must be executed and handled differently. (Elliot and

Maier, 2014) Colors create depth within a flat panel, changing how the eye perceives the scene

even though it is all just ink on a page. “Warm or dark colors tend to advance while cool or light

colors tend to recede” which was echoed by Jessica Burns during her critiques. (Fraser and

Banks, p70, 2004) The emotional impact of certain colors has been studied for centuries, going

back to Goethe in 1810 describing the idea that “...Plus colors, namely, yellow, red-yellow, and

yellow-red, were thought to induce positive feelings such as lively, aspiring, and warm, whereas

minus colors, namely blue, red-blue, and blue-red, were said to induce negative feelings such as

restless, anxious, and cold”. (Elliot and Maier, 2014) Flower by ThatGameCompany uses color

very intelligently, especially since their game is already so vibrant. They constantly use high-

contrast colors to make sure the players know which directions to go, and which flowers are

important. Light is also used in this, but color plays the biggest part in the equation. With such

high saturation, the game had to focus on complementary colors: Red flowers on green grass,

blue flowers on dried yellow grass, white flowers on black grass. Always in small patches, never

overwhelming, just enough to get the player where they need to go.

Page 37: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

29

Fig. 18: A wide shot that the camera zooms to after blooming a small circle. (Flower, PS4)

2. Movement

According to the paper “Attention-Based Motion Perception”, the human brain can detect

low-level motion independent of conscious thought, meaning that motion inherently garners

attention subconsciously. In the context of this project, it could be a ship moving past the

window, or a character moving within a panel to open a door. These small animations, between

ten and fifteen seconds, would be enough to keep the viewer’s attention diverted, without making

them feel like they’re watching a cutscene. This also works in reverse, with no motion in an area

where there should be movement. It builds suspense, and forces the user to focus to try and find

what they feel should be there.

An example of movement as direction is in the EA game Dead Space 2. Survival horror

games are excellent at directing player attention, because they build suspense and create tension

within the player by definition. In one scene, the player goes through a nursery area that is quiet

and still. But there is a room at the edge of the field of view with shadows moving. This guides

Page 38: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

30

the player into the next area, but also creates tension. There are no enemies in this room, but it

feels like there should be because the shadows are moving on the wall.

Fig. 19: The Nursery in Dead Space 2, combining spinning lights and eerie music. (PS3)

Another instance of this technique, from the same game, comes slightly later in the same

area. There is a school gymnasium, much like the gymnasiums most Americans see in primary

school, where a massive horde of zombies is fought. All the doors are locked, so the player is

forced to go up on the stage. The walkway is narrow, and there are set pieces all around. After

the big fight, there is no movement and very little light. Everything is still, and the player is on

edge. At the end of the first row, a large and smiling sun prop drops down from the ceiling.

There is nothing scary about it, but after such a long period of no motion or movement, the

tension has built to such a level that even the smiling sun makes the player jump.

Page 39: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

31

Fig. 20: This scene is dark and ominous before the sun drops down, the sudden motion

scaring the player. (PS3)

In comic books motion is implied, because they are not animated. By augmenting the

panels animations become possible, bringing the reader more closely in line with the artist’s

original concept. It was concluded by Cavanagh that “once a feature is sufficiently visible to be

tracked, then the sensations of motion for the feature are based on low-level signals”, so in the

context of AR this would mean that once the augmentation is superimposed onto the comic, the

reader would then see the movement without having to consciously think about watching it.

(Cavanagh, p1565, 1992) The reader would be able to see the movement as a whole within the

panel, not just as a moving object.

3. Interaction

Video games use interaction to engage the player and hold their attention for potentially

Page 40: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

32

hours, so interactivity would be a key aspect of this project. Interaction serves as a way to draw

attention, while making the viewer feel involved in the story world. There is no true agency in

the medium of a graphic novel, given that the book is pre-printed, but the illusion of false agency

can be created by using the page, rather than a specific panel, as a boundary. Attentiveness

within game worlds has been studied previously, resulting that “Eye-tracking data shows that in

the first person shooter game, players paid attention only to the center of the screen, where the

cross of their gun was located. Most of the time, they shifted their eye-sight only to read the

information that appeared on the corner of the screen”. (Yan and El-Nasr, p6 , 2006). This

example of a first-person shooter, in this case Halo 2, shows that interactors focus on where the

interaction is, looking away only when new stimuli is added to their field of view.

Since this is an augmented novel, as opposed to a fully digital game, the interactive

elements will be relatively limited, with the goal time of taking under one minute to complete.

Examples of this could be scrolling through text on a computer screen, or entering a key code

that the protagonist discovered a few pages ago. Limited in scope to avoid taking too much

attention away from the physical artifact, but enough to pull and hold attention on the digital.

This is the largest holder of attention, and so must be used sparingly as opposed to light or

movement, which can be done quickly and retain the same efficacy. Augmented Reality would

lend itself easily to making a large grandiose puzzle that would take hours to solve, but that

would defeat the purpose of this project. The goal is to split attention roughly equally between

the analog and digital artifacts, not focus on one over the other.

The Playstation 4 title InFamous: Second Son has a downloadable content mission called

Paper Trail that forces this interaction between two screens in order to advance the storyline.

After playing for a period in the game, the player must log onto a series of websites and solve

Page 41: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

33

puzzles and crack codes, like piecing together shredded paper or hacking into a website. In one

instance, the player must call a number that tells them what to do. But they can only get that

number from finding a business card, turning it over, and logging into a website with the

password found there. While a useful example, this style of multifaceted interaction is much

more complex than what is necessary within this project, because it divides the time too

greatly. Each section of Paper Trail only takes a few minutes, but the sections nest together and

it can take almost an hour to get back to playing the game itself.

Fig. 21a-b: This shows website artifacts that directly impact games on a console. Infamous:

Second Son Paper Trail hacking storyline. (PS4)

For the graphic novel being created, interactions are limited to only a few instances

because they are so much more involved on the reader’s part than seeing a color change or

watching something move on a screen. The user has to physically make a change to the digital

space which, as stated, focuses their attention on the interaction and little else. The interactions

are not be incorporated into the panels for this reason, rather they are styled like pop-up windows

to obscure the panel itself. If an augmentation is interactive then that is the focus, and making it

smaller to fit within the panel itself would only be a hindrance.

Page 42: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

34

4. Sound

Sound as a stimulus pairs with movement, so having sound as a stand alone augmentation

must be done with care to avoid breaking the illusion. Movement without sound can be

acceptable, but sound without movement is rarely seen. The glaring exceptions to this is when

either there is a speaker or device or the goal is to create tension, then the sound is being created

by something out of the field of view. Hearing has a separate set of rules from vision, which

must be recognized in order to use it effectively. Unlike vision, “...It is impossible for subjects to

process more than a few simultaneously presented auditory stimuli”. (Johnson and Proctor, p96,

2003) In the context of a graphic novel this information is useful, because “...The dichotic

listening paradigm shows that people can direct attention to just one source of stimulation when

the source is well defined by a basic characteristic such as location”. (Johnson and Proctor, P101,

2003) Meaning that as long as the source of a sound is identified, or at the very least implied in

the setting of the scene, it will hold attention more effectively than if it were a non-diegetic

sound like background music.

Fig. 22: The Lost Woods, Ocarina of Time (N64)

Page 43: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

35

A classic example of this comes from the Nintendo64 game The Legend of Zelda:

Ocarina of Time. In one of the early stages there is a maze of rooms, each with four doors. While

the music is playing, it is noticeably louder near one of the doors to notify the player that it is the

correct one. Coming back to Bioshock, the player is often directed by the sounds of yelling,

gunfire, or in some cases a player piano within the worldspace. Sound is often used as direction,

whether with its presence or the lack thereof.

Sound within a comic book begins to toe the line between comic and animatic, because it

engages more senses than just the eyes. To restate the information from Attention, sound can be

used as an anchoring device within the worldspace, provided that it is given context. In a comic,

aside from the characters themselves the anchor could be a speaker on the wall, a phone, or an

alarm clock. This bridges the gap between digital and physical because the app is not providing

any new visual information, and the user is able to look at the comic page while hearing the

audio playing.

The goal of this project is shifting attention between two artifacts, one that is digital and

one that can be physically manipulated. One of the most prominent utilizations of this type of

attention shifting is the Wii U from Nintendo, with games like “Legend of Zelda: Wind Waker”,

“Sonic Boom”, and “Batman: Arkham City Armored Edition” all forcing the player to look

between the main screen and the smaller Wii U tablet. However, in each of these instances the

player is either explicitly told what to do and where, or left entirely to their own devices. In

“Wind Waker”, the tablet is used purely as an inventory system, mostly ignored by the player. In

“Sonic Boom” the only function of the tablet beyond a basic controller is a secret object detector,

not necessary for gameplay and can be forgotten almost immediately after it is revealed to the

player. In every instance, the Wii U’s games seem to ignore the gamepad almost entirely with the

Page 44: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

36

exception of multiplayer versus play. Even then it only uses the gamepad as a sort of ‘black box’,

obscuring information between players to create new dynamics in games that involve one player

chasing another.

Fig. 23 Scanning in-game artifacts. Batman: Arkham City: Armored Edition (WiiU)

The Wii U touched on several augmented reality chances but failed to go in depth with

any of them within a game. One possible reason that Marvel and DC made their apps non-

essential to the enjoyment of the comics was that not everyone had access to a smartphone,

especially the younger members of their audiences, and they did not want to risk alienating any

of their audience in the pursuit of new technology. That argument cannot be used by Nintendo

concerning the WiiU, because the console needed the gamepad to function. The gamepad was

the controller, and a necessary part of the setup. The technology was there, and was used in a few

games, like the previously mentioned “Batman: Arkham City Armored Edition” and “Sonic

Boom”, but even then they were not core gameplay elements. “Sonic Boom” used it as a way to

find inconsequential money caches, and “Batman: Arkham City Armored Edition” rarely

Page 45: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

37

required the use of the gamepad as the scanner. These are both augmentations, but they were

digital augmentations on an already digital environment, so it came up short within the

experiences.

Pilgrimage as a Concept

After it was made clear that the original comic idea would not be usable, the next steps

had to be planned out much more carefully. For Istochnik, which was the working title of the

first iteration, the idea for the comic happened and started the art began immediately, writing the

story as pages were finished. But this method quickly proved to be problematic, so for the second

comic it was clear that the full script would have to be written out with the augmentations

outlined before any art began. It started small, with a sentence or two describing the story, and

then a paragraph outlining the story in broad details. After the paragraph had been written the

full script could begin, page by page with the panel layouts, dialogue, character actions, and most

importantly the augmentations. What had happened with Istochnik was the page first, and then it

had to be figured out where AR could be inserted into it which led to an incohesive end result.

Reflecting on the original process it became clear that artwork had to become secondary to the

experience, with the focus being on writing a story that could use the augmentations within it

rather than have them shoehorned in as an afterthought.

The story began to form, influenced by tropes within media currently dominating the

field and developed in line with familiar storytelling genres. Establishing the setting as an alien

spaceship afforded for many freedoms as far as augmenting went, because advanced technology

would allow for certain things that modern-day Earth does not have; especially in the realm of

lighting. The hardest part about writing was getting started because whatever was written then

would be what became the final product, and being locked into something was unnerving.

Page 46: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

38

The second draft of the story, the one which ultimately became Pilgrimage, revolved

around an alien race looking for new worlds to colonize. The protagonist, named Artace, was a

naive low-level worker who had little knowledge of anything beyond his specific job within the

ship. This allowed for organic story flow to take place, with information being revealed to Artace

at the same pace that the reader got it. Ultimately Artace and two of his close friends, Qaalen and

Eijis, discover a treacherous plot by their newly militaristic government, led by Galra, and have

to make the decision whether or not they want to accept it or risk everything to change it.

Constructing The Visual Framework

After the script was finished the artwork had to begin almost immediately, since it would

be take the longest amount of time. There were many concept sketches, but they had all been for

Istochnik which had a faceless human protagonist in a futuristic suit. Pilgrimage needed to have

at least a partially non-human cast, because it would allow for more creative freedom as far as

characterization went. Inspiration initially came from classic science-fiction television shows,

and patterns in the alien designs began to emerge. A large percentage of aliens were humanoid

with one or two distinctions, and usually around the face. Klingons in Star Trek had forehead

ridges, and the Spirits in Stargate were humanoid except for gill-like appendages where their

noses should be.

Page 47: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

39

Fig. 24a-b: A Star Trek Klingon (Left) and the Stargate SG-1 Spirits (Right)

For the character designs it needed to be nonhuman, but anthropomorphic. Recognizable facial

features make emotion easier to convey, so a humanoid shape is preferable when designing a

character. The decision was made to abstract it one step and use insects as a stylistic base as

opposed to familiar animals like dogs or cats, which are often anthropomorphized into humanoid

characters. With this in mind, the process of looking at various insect species began, scrolling

through image galleries on Google and Pinterest. After a few days of looking and thinking the

Venezuelan Poodle Moth presented itself as the base insect to work from. It lent itself well for

variation because the species itself can be a variety of colors, and since it has hairs, in an

anthropomorphic state that could translate to hairstyles, allowing for easy differentiation between

characters.

Page 48: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

40

Fig. 25a-b: Two colorings of the Venezuelan Poodle Moth

Fig. 26: The in-comic character variations based off of the Poodle Moth

The environment design of the world space heavily referenced science fiction tropes like

sliding doors, keypads, with the walls and ceilings very angular and streamlined. The futuristic

environments also allowed for augmentations without stretching the disbelief too far.

Page 49: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

41

Fig. 27a-b: The original panel (left) and the augmentation for that panel (right)

These augmentations are meant to work within the story world not against it, so the panels had to

be set up in a way to show an empty state where the augmentation would go. In this example

case, it is the blank computer screen that lights up when the image is recognized by the

application.

The creation of the pages was the most time consuming process of making the whole

comic. Each page had to go through several steps, and in order to keep a cohesive visual

appearance from page to page the same process had to be followed. This effectively means that

each page had to be drawn two different times, before being colored in. The augmented reality

programming could not begin until the pages were finished because the pages were the markers,

so this gave the project a very strict set of directions to follow. Thankfully the script was readily

available to work from, so this section of work was only translating written descriptions to a

visible depiction of the words.

Page 50: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

42

Fig. 28a-d: Rough lines (Top left) Inks (Top Right) Color (Bottom Left) and Text (Bottom

Right)

The more pages that had been made, the more care had to be taken about maintaining color

accuracy because every time a new character or location was added, the colors had to remain

consistent across the rest of the comic. This meant that every time Artace or Galra were drawn,

the colors would be exactly the same and the coloration would be exactly the same between page

Page 51: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

43

four and page twenty. After all of the pages were finished, the artwork for the augmentations had

to be made. This took longer for some panels than it did others, because some panels had more to

change. For example, the augmentation on page five was the addition of nightclub style lighting

and adjusting of the color curves. This only took a few minutes with the gradient tool and Curves

adjustment layer. On the other hand, pages that were an entirely different panel, like on page

seventeen, took just as long as making one of the regular panels.

Fig. 29a-b: Original panel for page five (Left) and augmentation for it (Right).

Page 52: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

44

Fig. 30a-b: Original panel for page seventeen (Left) and augmentation for it (Right).

Not all of the panels had visual augmentations but rather had audial augmentations, and

this presented a fresh challenge. Making the music from scratch would have been time

consuming and difficult, since production level tools are not readily available. As an audio

resource a royalty free sound library (FreeSFX.co.uk) was used in this project, so professional

quality sounds were available. This audio was used in several augmentations in tandem with

image changes to create key points by combining attention methods. Some of the audio did have

to made myself, but those were the specific plot-related audio clips. With creative post-

processing, sound clips for Artace, Galra, and a newscaster were created that all sounded

different and unique.

The creation of this comic, as with any comic, had to follow a series of steps. First the

story had to be written, and then the artwork had to be made. The artwork had several steps as

well, beginning with finding references, then the concept art, then sketches, inks, and colors for

every page. After that the dialogue was added, and this would be the step that most comic books

Page 53: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

45

are completed, but since this comic has augmented reality functionality the final step in this

process was the augmentation. The visual augmentations followed the same steps as one of the

regular panels, and the audial augmentations only had to be found and prepared to be

implemented. The final step was to link the augmentations to the images.

Designing the Augmentations

With the comic and its augmentations made, the final step in the process was to create a

Vuforia database that could be used with Unity. There are many programs that support Vuforia

use, including Georgia Tech’s own Argon program. Each option had its own set of positives and

negatives, but ultimately Unity was chosen because it had thorough documentation for Vuforia

use, had public online forums for the discussion of problems and troubleshooting, and allowed

for offline use. Unity also afforded the ability to create single stand-alone apps that had their own

individual icon, as opposed to Argon which required entering the application and then loading a

bookmarked webpage that contained the program.

The database in Vuforia was where the artwork for Pilgrimage hit its first stumbling

block. While uploading the marker panels, most of them were ranked four and five star quality

but a few were ranked either one or zero star. What this means in the context of Vuforia was that

some of the images would be much more difficult to recognize as triggers than others. These

recognition points are created at the intersection of lines, where the markings are clear and can

be recognized consistently and repeatedly over the lifetime of the application. Lower ratings

mean that the image could potentially take longer to recognize, not be recognized at all, or flicker

while it’s being shown onscreen.

Page 54: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

46

Fig. 31a-b: The original image (left) and the Vuforia target recognized points (right) of a

five-star image trigger.

Fig. 32: A Vuforia point map of a zero star image trigger.

This hurdle taught that Vuforia did not create recognition points in areas with gradients,

or soft lines. Upon noticing this pattern, going back and changing a few key points in the failing

images brought them up from zero to one star, making them usable. According to the Vuforia

Page 55: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

47

website, for basic image recognition one star will suffice. Their grading system also works on

three-dimensional shapes, and three stars are the minimum recommended amount for any object

recognition that is not just a flat plane. So the decision was made to at least try and see if they

would be recognized at one-star quality, fully aware that if they were not these trigger panels

would have to be redone. Thankfully this was not the case, because even one-star graded images

were easily recognizable by the app in this context, meaning that the next phase of the project

could begin.

Incorporating the Augmentations

This phase was where the project moved from Photoshop to Unity, which was potentially

the greatest limitation going into the project. While Unity and Unreal are both established game

engines, Unreal Engine Four (UE4) is used widely in game development for games like the

“Gears of War” series and “Kingdom Hearts III” where Unity was used for games like “A Night

in the Woods” and “Super Mario Run”. In addition, Unreal Engine’s Blueprint coding workspace

meant that code never had to be typed out longhand, and the flow of data inside the scene was

illustrated, making it easier and faster to figure out where the problem in the code was. Unity

uses either C# or Java to program, with each section of code existing within its own text file

rather than a shared space within the engine. The code cannot be edited inside of Unity, but

instead must be opened in an external program, altered, and then returned to Unity.

Despite this, Vuforia was the limiting factor and only Unity had an official plugin for it.

There was a third-party plugin for Unreal Engine Four (UE4), but the risk of using a potentially

unstable third-party product was too great to take. In their developer portal Vuforia has produced

a plugin explicitly for use with Unity, which contains premade objects for an AR camera and

image recognition target objects. This accelerated production, removing the steps of creating a

Page 56: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

48

virtual scene that would be necessary if using Argon. On their site they made a very clear set of

step by step instructions on how to set up the scene, and how to link digital artifacts to the trigger

images. The image triggers were a premade object within the Vuforia package, so all that had to

be done for them was put them in the scene. Since the device camera was controlling the scene

camera, it did not matter where the triggers were placed. They were ultimately put in a grid

pattern, simply to keep track of which pages corresponded with what images without having to

reference back to the full page files.

Fig. 33: Unity project scene with the twenty-six trigger images

To link an artifact to the trigger, it has to be a child object of that image trigger. Then the

Vuforia package code creates that object in relation to the image when it is recognized by the

device camera. To test the recognition, cube primitives were created as child objects of every

image, centered on the trigger. This was the fastest and easiest way to see if any panels would

fail recognition and need to be redone. Thankfully this was not the case, and all of the image

Page 57: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

49

triggers functioned as they were supposed to. During this step, small deviations began appearing

in the functionality of Vuforia’s image recognition from a screen versus from a paper copy. The

camera tries to adjust for brightness, and since digital screens produce their own brightness the

light contrast is much higher than reading from a paper, and in certain panels that had high

brightness contrast the camera struggled to read the image. The first panel consistently took

much longer to register than any other panel when testing between the desktop and an iPad, but

once it was printed out on paper it registered much faster. Since the final product was always

meant to be a tangible book this was acceptable, but it would hinder others sharing the comic as

a digital file and viewing it from their computers. Even if the file were shared, it would not

function optimally until it was printed out onto paper.

As a game engine, Unity is easily used for mobile development since it does not require

complex rendering or ray casting, something most phones cannot handle. Vuforia recognizes

this, and has produced a toolkit specifically to be used in the development of AR apps within

Unity. This expedited several processes in setup that would have been arduous in other

programs, like establishing an AR Camera and identifying the individual image triggers. Testing

with basic primitives, Vuforia was able to recognize each image trigger and anchor the cubes

correctly, which meant that the real augmentations could be connected.

CHAPTER 4. Implementation

Implementing Augmentations

The basic augmentations were done first, which were the image to image panel changes.

An object plane had to be created as a child object to the trigger panel, and then textured with the

augmented differences. Starting with the image to image transitions allowed for the conventions

Page 58: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

50

of Unity to be picked up slowly, so that one thing could be worked on at a time in order to not be

overwhelmed by learning a new user interface, new coding language, and new naming

conventions. By the time these panels had been completed there was a routine, and the next step

up in difficulty could be taken.

The animated panels were the logical procession from image-to-image transitions, but

thankfully Unity has an animation editor that is similar, although simplified, to Maya’s; a

program made by Autodesk. It creates the animation file (.anim) as well as the controller

automatically, and it combines the keyframe creator and the curve editor into the same window

to streamline the process of animating and refining. Since the animations were only image planes

the changes were not as complex as a full character model, limited to translation and rotation.

Keyframe style animation is the same across platforms, so there was no need to learn an entirely

new animation toolkit.

Adding sound to panels was the first major stumbling block. In the Vuforia

documentation, it said to create an audio source parented to the image trigger to create sounds.

While this worked, technically, it played the sounds as soon as the scene started rather than on

image recognition, which meant that as soon as the app began the sound began playing. It was

playing successfully though, so it was only a matter of starting and stopping the audio. A

separate script had to be created within Unity to hold the audio file, rather than linking it to the

image trigger itself. Upon testing, the audio played exactly as intended on recognition, but only

played once. With the shorter clips, like the alarm clock and electricity crackling in pages eight

and twenty-four respectively, the sound only lasted a few seconds before cutting off. Unity

included a ‘Loop’ function in the audio object, and after turning that on the sound played for as

long as the reader wanted to stay on that panel. The decision was made not to loop the three

Page 59: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

51

dialogue boxes because it would not diegetically make sense for that audio to be looped. If the

reader wants to hear it again they can re-scan the image and hear it, but they do not automatically

loop.

The last group of augmentations to create was the interactive ones. Some of these

required more complexity than others because the interactions were more in-depth. The first

hurdle that needed to be passed was figuring out how to touch and drag. In Unity, the tag

OnMouseDown() is also used for touch on devices so the code could be tested on the computer

rather than having to upload the file to the designated iPod every time there was a new iteration.

The first interaction that was coded was the augmentation on page fourteen of the comic; moving

the lid of a crate out of the way. There was no spatial recognition or variables to be coded, but it

was moving an image plane out of the way. In the original comic, Istochnik, the object was

outright destroyed on touch, but for this panel there needed a build up to the reveal. By dragging

the lid off it slows the reveal compared to the lid simply vanishing from existence.

Fig. 34a-b: The lid (left) and the crate that it obscures (right)

Page 60: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

52

The next interaction required spatial recognition, because it was a key-card unlocking a

cell. The card had to move over the reader in order to unlock it, and the OnOverlap() or

OnIntersect() tags felt clumsy and imprecise. Instead the key card’s x and z coordinates were

used to create a logic statement of “if (transform.position.x >= “boundaryLeft” &&

transform.position.x<= “boundaryRight” && transform.position.z >= “boundaryBottom” &&

transform.position.z <= “boundaryTop”). This if statement would only be true if the key card’s

center met these requirements. The coordinates from the image of the card reader were then

established, using the dark square as the boundaries.

Fig. 35a-b: The card reader as it begins (left), and after it recognizes the key card (right).

This presented a problem, however, because the coordinates of the card after recognition

did not match the world space coordinates in the editor scene, and would not trigger the change.

The code worked correctly and was then tested by putting the transform.location statement on

either side of the equation and it triggered immediately. The proper set of coordinates to use had

to be determined, and then implemented. So in the key card’s drag script, two small but useful

lines of code were added at the end: Debug.log(transform.position.x); and

Page 61: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

53

Debug.log(transform.position.z);. This would print out the coordinates that were needed for

recognition. So the program was initialized and the card was dragged to the correct boundaries,

giving the printed values to create a proper if statement. After these values were entered the card

scanner worked immediately and work could begin on the keypad puzzle panels.

Two different panels both use keypads, so a lot of the code was able to be reused between

them. The biggest change was the name of the global variables, and the root script that held

them. Also the second keypad was a decoding game, but the first one was right or wrong since

the code is provided for the reader to get them used to the interaction, so the second one changes

the position code to yellow if the number is in the combination, but in the wrong place. Invisible

geometry was used to create trigger volumes for each button on the keypad, then created a string

to hold the code and an integer to hold the number of numbers in the code. The number keys

only work if the string is less than the maximum code value, at which point the user can only use

the escape and enter keys. Escape clears the numbers regardless of their value, but Enter checks

to see if the string is correct. If the string is correct then Enter destroys the keypad volumes as

well as the first keypad to display the success screen, and if not it resets the string and values.

This was the longest designed interaction, and so it only occurs twice within the comic. The first

time was used as a teaching moment since the code is provided and the player can see what is

correct and what is incorrect, and then the second time is the actual puzzle interaction.

The code for this part was tedious and complex, because each key was almost the same

except for changing the numerical value, and it created a lot of scripts because each key needed

its own to house its own individual number. The keypads were created quickly, the biggest

problem was how to indicate the correct values. 3D primitive objects were used to give the pad

depth, and ultimately using spheres as color indicators seemed the most successful because they

Page 62: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

54

were reminiscent of the LED bulbs in an actual indicator pad. The recognition code for this was a

layered if statement, where it checked the number of characters in the combination string, and if

the button pressed was correct it turned green, and if it was incorrect it turned red. The second

keypad followed the same conventions, with the addition of an Else If step that checked if the

button pressed was anywhere in the combination. If it was in the combination but in the wrong

place, the sphere turned yellow. The color changes were handled using the code

“GetComponent<Renderer> ().material.color = new Color (R, G, B);”. Each step in the If

statement during Void update() sets the code, and the Void Start() phase sets the base color as

blue. This is also the color that the spheres reset to when Esc or Ent are pressed if the

combination is incorrect, indicating that the values have not been entered.

Page 63: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

55

Fig. 36: The code keypad upon initialization

Fig. 37: The code keypad showing the incorrect combination. Yellow indicates the right

number but wrong space, red indicates the wrong number, and green indicates the right

number in the right space.

Fig. 38: The success screen, which is the right combination after pressing enter.

Page 64: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

56

Implementing the augmentations was successful in terms of the technology because they

all worked correctly, and the augmentations matched the initial script so the implementation was

also successful in terms of the diegetic story world because they fit in with the plot rather than

being extraneous. While creating the artwork was the most time consuming part, writing and

implementing the code took more thought, because variables had to be set and called, and

animations had to run. Numbers had to be dealt with precisely in order for changes to happen

correctly, and with the interactions on the number pads permutations had to be calculated to

show the correct sequence of colors on the lights. Once the application was working there was

only one step left, to test the comic with people who had not seen it, and make changes

accordingly.

Testing The Comic

Once the augmentations were working and the application had been installed onto a

device, this prototype was tested with a group of participants unfamiliar with the project in order

to get feedback. They were handed the application and the completed comic on paper, and left

them to their own devices. They were not told that the green bordered panels were the

augmented ones, because there was an explanation on the inside cover on how to use the app. In

comics, traditionally the inside cover is used to hold the credits, publisher information, copyright

information, and a brief synopsis of the plot so far. With Pilgrimage, this was the first issue so

space was available to insert a few sentences on how to access the augmentation. In most cases

the readers assumed that the green panels were the augmented ones right away even without

reading the first page, but three of the eight people in the group took several pages to figure that

out so in the final draft of the comic the explanation of the augmented function of the comic was

Page 65: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

57

put inside of the same green border to set the connection immediately without having to use the

mobile device.

During the initial testing, it was noticed that their fascination with the augmented panels

kept them on the panels through several loops of the animation. While this was unexpected, it

actually evened out the time that they spent reading the comic and looking at the augmentations.

While testing the Vuforia triggers there was concern that the loops were too short and the

attention would be focused too heavily on the comic with an uneven ratio, but this was from the

perspective of someone who had written the comic and knew what the triggers were. Since

others who were reading the comic knew nothing about it and were experiencing it for the first

time, they were engrossed in the augmentations and went through several loops. While these

changes were being planned out consultation began on how to transition back from digital to

tangible, but because of the nature of comic panels this seemed unnecessary. Comic panels are a

section of time, but the reader can look at them for as long as they want. Some people read

comics for the story and don’t pay much attention to the pictures, but others may pay more

attention to the pictures than the plot. By limiting how long each augmentation lasts it would

artificially shorten the panel, making the reader have to re-scan the panel. With this in mind the

decision was made not to have the three audio dialogue panels loop because during testing, the

participants commented that the audio began to bleed together and was blurring the ending and

the beginning together. Since the dialogue is diegetic as part of a conversation, as opposed to a

beeping alarm or thumping club music, it would make sense for it not to loop.

What was also noticed was that the augmentations did not evenly split attention, which

was mentioned when outlining the four means of holding attention. It was a surprise, however,

when it was audio that held the least amount of attention. The dialogue held attention but the

Page 66: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

58

looped audio did not hold attention for more than a couple seconds, which is less than the looped

animations. The interactive keypad panels held attention much longer because it was a puzzle to

be solved, and the participants visibly reacted to their success. The first keypad is supplied with a

combination on the same page, setting the expectations and controls for when it reoccurs later in

the book. The participants reacted to this with nods, and general words of understanding. They

saw the four spheres, and saw the four numbers on the page, and assumed that they went

together. Later in the comic they have to figure out the combination themselves, which took an

average of several minutes and garnered frustration from the participants, but a bigger reaction

upon success. None of the testers would move on from that page until they had discovered the

combination, and even though the only reward is a green light they still reacted physically to

their success. There are many more comic panels than there are augmented panels, so the

attention levels balance out. Overall the people that got to try it did spend more time reading the

comic than looking at the augmentations, but not by too wide of a margin.

After observing the test group, a few small changes had to be made to the app but the

design criteria for the project were satisfied. A full length single issue comic book was made, and

a digital application was made to go with it. The app augmented designated panels of the comic

book, with panel gutters serving as a transition marker as opposed to an icon inside the panel like

Marvel did with theirs. Using the methods taken from research into attention manipulation as

well as digital interaction a wide variety of augmentations were able to be made that held

attention, but did not feel repetitive according to the test participants. Attention was split

approximately equally, on average between the participants.

Page 67: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

59

CHAPTER 5. Conclusion

At the beginning of this project, there were two concrete goals in mind. To create an

augmented reality experience that would split the interactor’s attention evenly between the

digital and tangible mediums, and to create AR markers that were more visually interesting than

a typical QR code. Graphic novels were the ideal medium to combine artwork and augmented

reality because the panels serve as a way to divide time and attention into segments for the

reader. The artwork itself would be accomplished without relying on an outside artist. Video

games were studied as a means of directing attention to an interactor within a digital space,

concepts that were transferable to the AR app that was developed. A basic proof of concept was

done first using premade comics to see if comic panels were even usable as AR image trackers.

This test was successful, and progress continued to making test pages of original artwork to see

if they would be as effective. The first idea worked thematically as a graphic novel, but did not

lend itself to augmentation so it had to be scrapped in favor of a new story that would be more

cohesive with augmentation. A script was also written the second time and completed before the

artwork even began, rather than starting in Photoshop and writing the story page by page as they

were completed. Because of this the artwork could be planned out much more efficiently, and

ended up with a product that fulfills the initial premise of the project successfully.

Page 68: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

60

Fig. 39a-b: The first comic Istochnik (left) and the final comic, Pilgrimage (right).

The risk of using Unity for the first time was higher than would be preferable, but

thankfully as a program it is well documented and has a downloadable plugin for Vuforia, which

is a commonly used image recognition program. Because of this the documentation was

indispensable and allowed for troubleshooting problems as they arose. The largest perceived

difference between Unity and other game engines was the syntax of the specific language, and

now that the syntax has been learned if another similar project had to be made, the coding could

be completed in probably half the time.

Vuforia, on the other hand, was fascinating to work with and is so open ended that it

allows for almost endless variation. The project shows that more than just QR Codes can be used

for image recognition, full artwork can be as well. With a few exceptions, meaning the panels

Page 69: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

61

that failed the Vuforia grader, the comic panels functioned naturally as image triggers without

having to consciously think about that during their creation. In fact, while testing Vuforia with

comic pages at the very beginning using premade comic panels from Transformers: More Than

Meets The Eye, all of those panels rated five stars in the Vuforia grader. This theme of

artistically minded triggers over purely utilitarian triggers can be expanded upon into educational

materials, street art, or just larger scale graphic novels. The pages of Pilgrimage made for this

project amount to one issue in a series, which average between twenty-five and thirty pages not

including advertisements. This comic hits in the middle ground at twenty-six pages, and has a

self-contained story that does not require any outside information to be enjoyed.

Jessica Burns was sent a copy of the comic once it was finished, and we sat down in a

Google Hangouts session to talk about what worked and what didn’t. Her first comment was on

how much the artwork improved comparing the first pages to the later pages, which is

subjectively true. There had been little practice when the project began, and working for eight

hours a day on drawing improved the art drastically, so the end of the comic doesn’t quite match

the beginning under scrutiny.

Page 70: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

62

Fig. 40a-b: Page four (left) had stiff lines, and no real character interaction. They were

drawn as poses rather than as characters. Page twenty-three (right) shows motion and

interaction while fighting, rather than just stiff posture.

Another major critique of hers was the lack of depth in the comic’s artwork. All of the

colors were flat, meaning that there was no lights or shading on the characters or the

environment. The comic should be shaded to some extent without question, but that is a time

consuming process in sequential art because the shading needs to be consistent across panels.

This is a similar concept to keeping colors consistent, but then each character has an additional

set of shades for each color on them so the decision was made not to shade the panels. It did not

impact the Vuforia recognition, which was the goal to begin with. For the purposes of this

project, the artwork did not need to be masterful, and would have taken two or three times longer

to make if the pages were to be fully shaded and detailed. Instead a less realistic art style was

Page 71: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

63

used, though it was more complex than Istochnik because it was still effective. Mainstream

comic books are not made by one person, generally they are made by teams of workers who have

one designated task. They have writers, pencilers, inkers, and colorists, not to mention letterers

which were circumvented by using a font rather than hand lettering every dialogue box. In

hindsight, this was one of the bigger risks of this project. It was established that comics would

work as triggers based off of experimentation using Transformers comics, but by undertaking all

of the steps of production by one person it was reducing the work of roughly eight people on a

professional comic book to one person on an amateur one. A script was written, illustrated, and

augmented, all in just under three months; something that most people would have deemed not

possible, or not likely, for one person to accomplish. Not only that, but the visuals and

augmentations were completed almost exactly how the script established them without having to

sacrifice any pages to save time on the artwork or on the coding side.

The Next Steps

In the end, this project was a success in that a problem was identified, and then an

intervention for that problem was developed. This is not the end of the project, because there are

several things that could be done in the future to improve it. First of all, the amount of content

would almost have to be changed. There would not be one augmentation per page, rather one

every few pages, but the augmentations would be more meaningful. While they diegetically

work within the story, there were several pages of the comic that had augmentations simply

because it had been set as an arbitrary rule that every page had to have one augmentation. This

would only work on a larger scale though, so it would either have to be a fully made graphic

novel like “The Watchmen” or “Persepolis”, or a syndicated series like the publications that

Pilgrimage was modeled after. That way the same amount of augmentations would be provided

Page 72: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

64

but they would be meaningful and, more importantly, better spread out. In this comic, each page

was augmented so it became expected and routine. But if the pages were augmented irregularly,

then it would always be a surprise when the next one came. This is not to say that the comic is

not successful, only that the augmentations would be more effective if they were less frequent. If

there were only one augmentation every two or three pages, it could be saved and used when it

would be more thematically appropriate. This would create focus on it, since it would be less

common than it is now.

In the next iteration of this comic the artwork would be done in higher quality, with full

lighting and shading on every panel. This goes back to the conversations and consultations with

Ms. Burns, in making the artwork more professional and finished. Comics that have lineart and

color but no shading need to be heavily stylized so the reader knows it is a conscious choice,

rather than an inability to do so.

Fig. 41: Bryan Lee O’Malley’s series “Scott Pilgrim vs The World”

Page 73: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

65

Fig. 42: An example of Ms. Burns’ work, in her online comic Pest Caravan.

Scott Pilgrim is highly stylized as a comic, and it uses lots of motion lines to fill up the

otherwise empty space that would have been occupied by shading detail. It works because of that

exact reason, because it is not just line art. Pilgrimage has lineart and color, but no real level of

detail beyond the lineart. Shading in the comic would be time consuming, to be sure, but it would

make it much more presentable to a higher caliber audience.

Page 74: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

66

Fig. 43a-b: An idea of how even just character shading can improve a comic.

In addition to this full character breakdown drawings would have to be done, so that

reference would be readily available as to what the characters looked like from the front, sides,

and back. While making the artwork for Pilgrimage, this was one of the largest time investments

because whenever Artace or Qaalen appeared in the comic at an unusual angle, it would require

finding reference poses as well as figuring out what their character would look like from that

angle.

Page 75: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

67

Fig. 44: Pest Caravan character study for protagonist Amber, courtesy of Ms. Burns.

Even though these are rough sketches of the character, it gives just enough definition that

the artist can take them and work with them. These are similar to the augmentations that Marvel

had in their app, where if the user scanned a panel it would show character breakdowns like this

one for that page. In just this breakdown, Ms. Burns shows her character’s face from four

different angles, the scale plating, the larger armor plating, a range of emotions, and an enraged

form.

Almost all of the changes that would be made would be cosmetic, making the artwork

more professional and detailed. The exception would be the dispersal of the augmentations

throughout a larger body of work, rather than concentrating twenty-six augmentations within

Page 76: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

68

twenty-six pages of comic book because it did start to feel unnecessary in a few panels according

to the preliminary testing. The rule was set that there should be one augmentation per page, and

that rule was adhered to for the sake of the process. Overall this project is successful when

compared to its initial intent, especially since it all works the way that was intended. The gutters

divided attention, and by stylizing the gutters of the comic attention was able to be guided

roughly evenly between the comic book itself and the application.

Page 77: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

69

Works Cited

Banks, Adam and Tom Fraser. Designer's Color Manual: The Complete Guide to Color Theory

and Application. San Francisco: Chronicle Books, 2004.

Billinghust, Mark, Adrian Clark, and Gun Lee. “A Survey of Augmented Reality”. Functions and

Trends in Human-Computer Interaction, vol. 8, No. 2-3, pp. 73-272. 2015. https://files.t-

square.gatech.edu/access/content/group/gtc-a168-6c57-54b5-9980-762e61a1c021/gtc-

71de-5ab7-500a-b57f-75ac1ce94218/Readings/Billinghurst.pdf

Burns, Jessica. Pest Caravan. Tapastic. Aug. 31, 2016. https://tapastic.com/episode/444271

Buscema, Joe and Stan Lee. Stan Lee’s How To Draw Comics: The Marvel Way. Simon and

Schuster; New York City, 1978.

Cavanaugh, Patrick. "Attention-Based Motion Perception." Science, vol. 257, no. 5076, 1992,

pp. 1563, Advanced Technologies & Aerospace Database; Materials Science &

Engineering Database; ProQuest Central; ProQuest Environmental Science Collection;

Research Library,

http://prx.library.gatech.edu/login?url=http://search.proquest.com/docview/213542961?a

ccountid=11107.

Chan, Phillip A. and Terry Rabinowitz. “A Cross-Sectional Analysis of Video Games and

Attention Deficit Hyperactivity Disorder Symptoms in Adolescents”. Annals of General

Psychiatry, 5:16, 2006. Web. Accessed Sept. 5, 2016. http://annals-general-

psychiatry.biomedcentral.com/articles/10.1186/1744-859X-5-16

Clark, Nicholas. Flower. ThatGameCompany, 2009. Playstation 3.

Eisner, Will. Comics and Sequential Art: Principles and Practices from the Legendary

Cartoonist. W. W. Norton & Company; London, 2008.

Elliot, Andrew J. and Markus A. Maier. “Color Psychology: Effects of Perceiving Color on

Psychological Functioning in Humans”. Annual Review of Psychology, 2014. P95-p120.

Hill, Sefton. Batman: Arkham City Armored Edition. Rocksteady Studios and Warner Bros.,

2011. Wii U.

Ito, Junji. Gyo Ugomeku Bukimi. The Enigma of Amigara Fault. Big Comic Spirits; 2001. Viz

Media; 2003.

Johnson, Addie and Robert W. Proctor. Attention: Theory and Practice. Thousand Oaks: SAGE

Publications, 2003.

Levine, Ken. Bioshock. Irrational Games, 2007. Playstation 3.

McCloud, Scott. Reinventing Comics: How Imagination and Technology Are Revolutionizing an

Art Form. HarperCollins; New York City, 2000.

McCloud, Scott. Understanding Comics: The Invisible Art. HarperCollins; New York City,

2000.

Page 78: DIRECTING ATTENTION IN AUGMENTED REALITYdmprojects.lmc.gatech.edu/~lsand6/LSandThesis...Despite the failure of Google Glass to become the next hot item, augmented reality is quickly

70

Miyamoto, Shigeru. The Legend of Zelda: Ocarina of Time. Nintendo, 1998. Nintendo64.

Miyamoto, Shigeru. The Legend of Zelda: Wind Waker HD Edition. Nintendo, 2013. Wii U.

Pashler, Harold. Attention. Abington: Psychology Press; 1998.

Reid, Francis. The Stage Lighting Handbook. New York: Routelage, 2001.

Schofield, Glen and Matthias Worch. Dead Space 2. Visceral Games and Electronic Arts, 2011.

Playstation 3.

Senn, Chris. Sonic Boom: Rise of Lyric. Sega, 2014. Wii U.

Vargus, Nic. “Nintendo Wii U Review (2012)”. IGN, 2012. Web. Accessed Sept. 5, 2016.

http://www.ign.com/articles/2012/11/21/wii-u-review

Whedon, Joss. Astonishing X-Men. Issue 1. Marvel Comics; New York. 2004.

Yan, Su and Magy Seif El-Nasr. “Visual Attention in 3D Video Games”. Penn State University,

2006. Web. Accessed Aug. 25, 2016. http://dl.acm.org/citation.cfm?id=1178849