matthew stanford's mfa project documentation

Title “Analysis + Application of Presenting Visual Wayfinding

Information on Handheld Devices.”

Advisor Dr. Noel Mayo

Committee Dr. Liz Sanders, R. Brian Stone

Specialization Design Development

Option Non-Thesis

Email [email protected]

Website MFAdesignThesis.com

Matthew StanfordMaster of Fine ArtsProject Documentation

Acknowledgments

I was blessed to come from a family made of many different examples

of talent, intelligence, and perseverance to model myself after. This

enabled me to obtain an education from renown experts who were

willing to share their knowledge.

My deepest gratitude is extended to my mother and first teacher, to

whom I owe dearly for her unwavering support, patience, and strength

throughout my lifetime. Many people believe that once a child becomes

an adult, their job as a parent ends. Through her actions, my mother

exemplifies the principle that a parent’s job is never complete. The level

of skill, effort, and sophistication needed to raise a child is much more

difficult to obtain than any type of degree; I am honored to serve as her

third manifestation of parental accomplishment. To my older brothers,

who I have looked upon with sincere admiration ever since I was a

baby. There are times when I find myself displaying characteristics

that remind me of you—this is only because I have patterned myself

after both of you. Very special thanks to my extended family for

encouragement and serving as role models.

To my advisor, Dr. Noel Mayo, who readily shared his invaluable

wisdom, guidance, and experiences. I was unaware that my graduate

education would entail so much in such a short period of time and

for this I am forever grateful. Also to my committee members, Dr. Liz

Sanders and R. Brian Stone, for their feedback, honesty, and genuine

interest in my education and professional development.

To the Department of Design faculty, especially Dr. Wayne Carlson,

Cory Daughton, Tina Federico, and Tamara Dunaeff for providing

administrative support that exceeded requirements.

To my mentor, Kurt Shade, who I never needed to ask for help as you

avidly provided guidance and professional referrals. Sincere thanks to

my colleagues: Sandra Wan, Andrew Kerr, Meihui Lin, Brandan Craft

and all the other OSU students with whom I have shared experiences.

PAGE 2

Education

The Ohio State University, Design Development

Master of Fine Art, 2010

Columbus College of Art & Design, Advertising & Graphic Design

Bachelor of Fine Art, 2005

Employment

Noel Mayo Associates Freelance Designer Sep05–present •

Various projects including package, identity, and web design.

OSU Dept of Design Graduate Teaching Associate Jan06–June08 •

“Design 552: Communication Practices” provided Product Design majors an

introduction to basic visual communication design. Students developed their

own visual identity including a logo, letterhead, business card, digital slide

presentation layout, portfolio, and web site.

Evaluation of students’ overall performance based on expectations specified in

the course’s syllabus.

Developed syllabus, graded homework, and held individual office meetings

with students.

The WOSU Stations Graphic Designer Oct04–Apr06 •

Design of signage and EffectTV displayed at COSI, promotional material for

Ohioana Authors, logo design for ArtZine, and the annual staff calendar.

OxyVinyls Graphic Designer Oct03–Feb04 •

Created hardcopy forms and checklists for machine maintenance.

Created logo and identity for RPAC, OxyVinyls’ community information hotline.

Vita

PAGE 3

Overview

The Current State of Affairs

Inspiration

Shortcomings of Existing Systems

Guidelines for Creating Interactive Maps for Handheld Devices

The Proposed Solution

Conclusion

References

Outline1

2

3

4

5

6

7

8

1

Overview

What Was Done

The primary objective of this project is to define an appropriate process

of creating a visual wayfinding application on handheld devices. The

deliverable includes guidelines for how to recreate such a system for a

different geographic area.

This project develops a solution for a local area; ultimately, the intention is

to apply this system on a larger scale, allowing a seamless integration of

each city’s wayfinding system.

Ultimately, this research is being conducted in order to provide interactive

designers with guidelines for how to recreate a solution for interactive maps

in the context of mobile devices.

This research is inspired primarily by the future recommendations from

Susan Zolads’ MFA Project (The Ohio State University, 2005—advisee

of Dr. Noel Mayo) titled “Columbus… Identified” which suggested there

are further possibilities in which wayfinding design may benefit its users if

applications of handheld technology are explored.

In the beginning stages of this research, many different aspects of

wayfinding information delivered on handheld devices were explored. One

particular topic involved the development and implementation of a directory

of African-American businesses in Central Ohio. Another area researched

was the development of wayfinding signage which transmitted frequencies

providing information regarding the user’s immediate surroundings.

Wayfinding applications for handheld devices were then reviewed. It

was then that the key discovery was made: most existing wayfinding

applications suffer from similar issues: limited visual information as well as a

lack of visual hierarchy (in the context of typography, color, and graphics),

lack of consistency, and minimal attention to aesthetics.

The initial proposals of interactive map solutions were presented in

overhead view only until another key discovery was made: this visual

wayfinding information should more appropriately correspond with the

view of the user—pedestrians and automobile drivers never see the space

in which they are navigating from an overhead view. The perspective view

became popular in cellular phones just after my research of perspective

PAGE 6

views commenced. I began to study three-dimensional virtual environments

(including the height/width/depth of buildings as well as the inclusion of

surrounding landmarks). This direction was thwarted due to visual limitations

(lack of extended views of the users path/destination) caused by these

virtual three-dimensional buildings.

I then discovered that those existing and newly popular perspective views

continued to (and still do) suffer from the same issues in which the previously

popular overhead view maps suffered: limited visual information as well as

a lack of visual hierarchy (in the context of typography, color, and graphics),

lack of consistency, and little attention to aesthetics. This concluded:

interactive map design will benefit from research regarding the said issues.

I began collecting more data. Data was retrieved from various resources

including (but not limited to) Internet map applications, personal use of

handheld devices with interactive maps (owned an HTC Mobile Digital

Assistant (MDA) Vario equipped with Google Maps Mobile, Zagat To Go,

Microsoft Pocket Streets, and other mobile navigation software).

Frequently the argument is made against the importance of visual

wayfinding information on handheld devices, citing voice-guided

instructions as the only necessary component in mobile navigation. However,

during the course of this research, I conducted field research while driving

to Chicago, Illinois using a Garmin nüvi® 370; I was attempting to reach

a Best Western Hotel from Interstate 90 (Kennedy Expressway). When I

approached a 5-way intersection, the voice-guided directions instructed

me to “turn left at [street name].” In an unfamiliar city, during heavy traffic,

while passing through an unfamiliar type of intersection which displayed

illegible street signs (due to the surrounding visual noise and small size of

the street sign’s type) I was left no other option but to use the visual map

to successfully guide me through this intersection. Chances are, without this

visual assistance I would have either made an incorrect turn, been forced

to slow down (blocking traffic), or—worse yet—caused an accident. While

one might make the argument that this is an isolated incident, if the potential

for a car accident exists, this is certainly an issue requiring attention and

consideration.

PAGE 7

To obtain an understanding of the target audience’s perceived value of the

current applications on their handheld devices, I conducted a qualitative

survey of 35 participants. This survey was conducted via the Internet at the

following URL: http://mtstanford.com/673survey.html

The survey’s participants were collected through friends, colleagues,

classmates, and family. As indicated by the survey’s summary, the

survey yielded results indicating that there is room for improvement in

the perception of mobile navigation. I concluded: members of the target

audience for this research are not satisfied with existing commercial

mapping software.

After obtaining the results from the survey, I categorized and evaluated

existing systems based loosely upon Jakob Nielsen’s 10 Usability Heuristics.

Though a well-established expert in the field of interactive design, Jakob

Nielsen’s usability heuristics could not be used as a blanket application

because they are not specific to interactive map design for handheld

devices. Therefore, the evaluation criteria (shown on pages 25–38) have

been adapted based on the knowledge obtained throughout the course of

this research.

Once the evaluation of existing systems was completed, I began developing

prototypes of the proposed solution as shown on the subsequent pages.

PAGE 8

11:00am 17mph 0.7 miles: Hopkins Hall Right on Woodruff AveLeft on College Ave

Help Home

»

Fig 1.1 Screen shot of proposed

solution.

What Was Used to Guide the Process

The primary source of my decisions were based on general design

principles where minimalism is applied in many different contexts. This

includes the typeface selection (decorative and/or illegible fonts should

be avoided to optimize legibility), color palette (assigning specific colors

to elements in the map without using unnecessary or unassigned colors),

consistency (maintaining a visual language across the program by only

using elements which are graphically similar to each other).

I incorporated some of Jakob Neilsen’s 10 Usability Heuristics for Interactive

Design. While some of these guidelines are not applicable, the served as

a general basis to create the guidelines provided in this documentation

which are developed specifically for creating interactive maps on handheld

devices.

Typographic standards were developed from Monotype Studios’ on-screen

fonts and organization recommendations from John Kane’s “A Type Primer”

and Dr. Mayo, my advisor for this project. The technical specifications are

based on the standard size and colors for handheld devices (240px x

320px (4:3), 16-bit RGB color).

PAGE 9

What I learned

Minimalism is essential in designing for handheld devices. As previously

stated, minimalism is a key principle of design in general; no element should

be used arbitrarily. Since screen real estate is limited (typically to 240px

x 320px) this is especially true when designing for handheld devices. This

means, all irrelevant information should be avoided. This was a huge factor

in decision making when designing the map (outlines around buildings and

streets are unnecessary, the colors were reduced to only show buildings,

streets, and walkways).

While voice-guided instructions must supplement the solution, the visual

characteristics are the primary focus of this study. The demonstration

provided displays a vertical application of an interactive map but may be

applied horizontally.

There are typefaces that were designed specifically for use on screen. Of

those typefaces, a few of the most popular are Verdana, Georgia, and

Trebuchet. These typefaces are ideal for use on screen because of their

large counterforms and the similar characters (e.g. lowercase letters “i,” “j,”

and “l”) are easily distinguished at small sizes. As previously mentioned,

Monotype Studios developed a series of typefaces specifically for handheld

devices. This prevented me from selecting typefaces I might use for print

(e.g. the typeface used in this document is Futura which cannot be used

for mobile devices because the lowercase letters “i,” “j,” and “l” are all too

similar visually).

Moore’s Law (see page 15) is now an underestimation. It is extremely

difficult to stay abreast of existing design projects involving technology;

especially when one of the leading companies in this field (Google, Inc.)

is, by far, the largest company on the U.S. Stock Market. It is impossible

for one graduate student to compete with any of the Research &

Development teams of companies such as Google, TomTom, Garmin, etc.

Therefore, instead of trying to ‘outsmart’ these companies and attempt to

stay ahead of their research, I could only make improvements on what

was publicly available during the course of my graduate studies. The

prototype, designed in 2007, represents a snapshot in time and should be

compared to what was available at that time (most are displayed in this

documentation).

PAGE 10

Current State of Affairs

2

Introduction

As the cost of oil continues to climb while the economy declines, major

airline companies are responding by raising the cost of airfare and

reducing customer service employees. Although the customer service

travelers used to enjoy is being reduced, travelers are becoming more

familiar with interactive technology that facilitates quick responses if a

trip goes awry. Many mobile navigation companies have improved

their systems’ human-computer interactivity by including voice activation

technology, voice guided instructions, automatic rerouting due to traffic

or weather conditions, and the ability of users to modify and update

preloaded maps. However, significant improvements to the design of the

interactive map based on design principles and usability guidelines are not

commercially available. This may indicate an opportunity to provide a more

useful, usable, and desirable interactive map for handheld devices.

PAGE 12

The Information Age has facilitated the development of many dual-use

technologies, which are used extensively both in military and civilian

situations. This section focuses on both traditional and non-traditional uses

of mobile mapping technology in the context of Global Positioning Systems

(GPS). Topics include how GPS navigation is used in the military, the influx

of GPS navigation systems on handheld devices, and non-traditional uses

including mobile mapping software for the purpose of social networking.

Specifically, this section examines non-traditional applications of GPS

technology such as PacManhattan (a large-scale urban game that utilizes

the New York City grid to recreate the 1980’s video game sensation

PacMan), Helio’s Buddy Beacon (a GPS-powered feature offered by the

wireless carrier Helio which enables users to share their location with

friends as well as on popular social networking sites), and Socialight (an

Internet-based application which enables members to share places and

experiences with friends via handheld devices). The objective is to compare

and contrast the technology and its purposes which now exceed reaching

physical destinations.

Assigning the terms “traditional” and “non-traditional” in the context of

uses of technology which are not yet even forty years old may seem

questionable. Compared to other technologies — including radio, television,

telephones, automobiles, photography, and so forth — GPS can be

considered very new. However, modern technology matures at much higher

rates than that of twenty or more years ago.

For example, consider the advancements of portable media players over

the past ten years compared to portable media players ten years after

their inception. The original Walkman, created by Sony and introduced

in 1979, played audio cassettes only. While the Walkman is undoubtedly

considered a breakthrough in the personal stereo industry, the portable

media player industry made relatively very few improvements until

Apple introduced the iPod in 2001. The iPod is a breakthrough due to its

minimalist design, the amount/method of storage, and how users interact

with the device itself. Continue less than ten years beyond the birth of

the iPod and today’s models of portable media players can play videos,

download new music directly to the device without the hardware support of

a personal computer, and are even incorporated into cellular phones (eg:

the iPhone).

Moore’s Law (as articulated by Gordon E. Moore, co-founder of Intel

Corporation) states “the number of components the industry will be able to

place on a computer chip will double every year” — meaning computers

will double in speed annually and, therefore, facilitate the utilization of

greater activities by way of the technology in question (in this case, Moore

is referring to personal computers). This statement has consistently proven

itself true for technology beyond home computers and by these standards,

the development of GPS technology is on schedule. Since the rate of

advancement in technology is much greater than that of fifty, or even

twenty years ago, the terms “traditional” and “non-traditional” can be used

in the context of GPS. Just as the term “our children are growing up so fast”

is used to describe newer generations in society, so is our technology.

Validation of Research Why this research is Important

Nielsen Mobile reported in a press release published 10 October 2007:

“With GPS available on more new mobile devices, consumer demand for

location-based services (LBS) such as navigation is growing, according

to Telephia, a service of The Nielsen Company, and the world’s largest

provider of syndicated consumer research to the telecom and mobile media

markets…

“While location-based services deliver highly personalized offerings such as

friend-finding and other location-aware features, navigation represents the

lion’s share of revenue.”

The findings by Nielsen Mobile clearly indicate that the field of navigation

on handheld devices is growing rapidly due to increased popularity. Results

from an April 2008 Windows Mobile Survey report similar statistical

data. However, in the qualitative survey conducted for this project (see

appendix), the results show that users in the Baby Boomer generation are

dissatisfied with the overall functionality of navigation on handheld devices.

This concludes: while popularity amongst the general public for handheld

mapping has increased, members of the target audience for this research

are not satisfied with existing commercial mapping software. This deficiency

between the demand of the mobile navigation software and satisfaction

may be compensated by applying fundamental design principles and

improving the usability of existing portable navigation systems.

Figure 1.2 Results from an April

2008 Windows Mobile Survey.

PAGE 15

.6

2.7

4

24

143

1,0

00

pr

ojec

ted

Tota

l num

ber

of

GPS

dev

ices

in u

se in

milli

ons

source:

ABI Research

source:

Global Sources

source:

GPS World

source:

Ivan Getting

source:

US Navy

PAGE 16

1970 1980 1990 2000 2010 2020

Evolution of the Use of Global Positioning System (GPS) Technology

GPS will be standard

in all new automobiles

and cellular phones

‹2013

First used by US

Air Force

1972

GPS approved

for public use

1983

Pervasive use by US Military begins

1994

Pedestrian and

automobile use

1996

Utilization of GPS for social networking

2006

Inspiration

3

This section provides a description, overview and survey of a proposed

target audience and how the system may address the needs of this

audience.

This chart shows the increase of population of the Baby Boomer generation

in the United States of America (it is increasing at an average rate of 20.2

million people per decade).

Population Increase

1960–1980 +9mil

1980–2000 +9.8mil

2000–2020 +18mil

2020–2040 +24.3mil

Figure 3.1 Source: US Census, Middle Series Projections

PAGE 18

User Description

The target audience member is 45–65 years of age, a frequent traveler

[three times per year or more] who visits places of interest during travel. As

much as possible, the user avoids 800-numbers, travel agents and airport

employees, and instead relies on the modern tools of mobility: his/her

trusted smartphone, laptop, airport kiosks and a GPS system.

The Baby Boomer generation is the fastest growing percentage of the

United States population (source: US Census). Interactive mapping software

designed specifically for this audience does not exist. The target audience

may find this software useful because of an increased call to action for

unfamiliar duties.

As the Baby Boomer generation approaches retirement, obligations

arise regarding their declining health as well as their parents’ declining

health. Wayfinding assistance for transportation (i.e. from assisted living

facilities to doctors offices for routine evaluations or to hospitals for surgical

procedures) requires effort and attention. Improved designs of interactive

maps for handheld devices can provide wayfinding assistance by helping

the user navigate unfamiliar territories. This can be achieved by providing

visual information specifying the names, positions, shapes, and sizes of

(surrounding/destination) buildings, pedestrian walkways, street/traffic

signs, user controls (zoom in/out, toggle overhead/perspective view, clearly

labeled Exit/Help buttons), as well as the visibility of the system’s status

(including time/date, current/next action, route/progress/location indicator).

A 1999 article titled “Technology Needs of Baby Boomers” published in

Issues in Science and Technology states the following:

“Although people are living longer, the natural aging process does

affect vision; physical strength and flexibility; cognitive ability; and, for

many, susceptibility to illness and injury. These changes greatly affect

an individual’s capacity to interact with and manipulate the physical

environment. The very things that we cherished when younger, such as a

home and a car, may now threaten our independence and well-being as

older adults.”

PAGE 19

Which of the following handheld devices do you own?

Cell Phone PDA Mobile GPS

How often do you use your mobile device(s)?

Rarely Sometimes Often Frequently

What features do you utilize on your mobile device?

(please select all that apply)

phone [voicemail, voice dial, ring tones]

email [email, SMS/EMS/MMS text messaging]

connectivity [web browsing, webmail, instant messaging]

multimedia [audio & video playback, recording & streaming; camera; photos]

office [personal info manager, contacts, calendar, to-do list, MS Office

documents, calculator]

games

navigation [maps or directions]

downloaded 3rd party applications

other (please specify)

Which features does your device perform well?

phone [voicemail, voice dial, ring tones]



multimedia [audio & video playback, recording & streaming; camera; photos]

office [personal info manager, contacts, calendar, to-do list, MS Office

documents, calculator]

games




Qualitative Survey

PAGE 20

What features do you desire most from your mobile device?



multimedia [audio & video, recording & streaming; camera; photos]

office [personal info manager, contacts, calendar, Office documents]

games




Please rate the ease of use for the following features (if applicable):

email

n/a poor fair average good excellent

connectivity


multimedia


office applications


games


navigation






Please briefly describe an occurrence when one of these

features did not work correctly.

(be sure to specify the feature)

Qualitative Survey

PAGE 21

Emai

l

Con

nect

ivity

Mul

timed

ia

Offi

ce

Gam

es

3rd

Party

Nav

igat

ion

Extremely

Satisfied

Somewhat

Satisfied

Satisfied

Dissatisfied

Extremely

Dissatisfied

Qualitative Survey Results

This survey of 35 participants within the target audience was conducted

to learn what mobile applications are most valuable to the audience. As

shown in the results below, the participants are generally satisfied with

every application except navigation. This indicates that there is room for

improvement in the perception of mobile navigation.

Average Response

PAGE 22

Addressing the Needs of the Baby Boomer Generation

From early discussions with my advisor, I learned of both the rapidly

growing market for designing interfaces delivered on handheld devices and

the rapidly growing Baby Boomer population. In 2005, the Travel Industry

Association reported that the average age of a traveler was 46 years (U.S.

Travel Industry Association, Domestic Travel Market Report, 2006 Edition).

While the Baby Boomer generation is the fastest growing percentage of the

U.S. population and, moreover, the percentage of the U.S. population with

the highest income, interfaces for handheld devices designed specifically

for this market are virtually non-existent.

The intention of my initial survey was to determine an area of emphasis

between the following categories of software for handheld devices: Email,

Connectivity, Multimedia, Office, Games, 3rd Party, and Navigation. Each

survey participant was a member of the Baby Boomer generation. The

results indicated that the subjects were generally satisfied with all other

software for handheld devices except navigation/mapping (if I could

conduct this research again, I would ask this same audience “why are you

dissatisfied?”). Upon reviewing existing models, I discovered there was a

lack of attention to aesthetic and design principles.

In the book “Mobility and Transportation in the Elderly” (p1), Klaus Warner

states the following:

“…at older ages, speed of behavior becomes slower; the slowness affects

sensory function, mental activities, and motor activities such as walking,

controlling a vehicle, and making other skilled manual movements.”

While the above statement is applied to the elderly rather than this

research’s target audience of Baby Boomers, much can be learned from the

provided implications. To summarize Warner’s statements: as ages increase,

physical and cognitive performances decrease which require additional

assistance from available resources. In two of the aforementioned cases

(“walking, controlling a vehicle…”) this additional assistance can be

provided through interactive maps on handheld devices.

PAGE 23

Existing Systems

4

This section describes the Pros and Cons of existing systems. While

problems with interactive maps including connectivity and accuracy are

mentioned in this document, these are system problems which exceed the

scope of this study. Instead, this project focuses on communication problems

including legibility and visual hierarchy.

Internet Map Applications

Pros Easily Accessible to Internet users.

Free or inexpensive solutions to navigation.

Highlights points of interest.

Cons Visual information does not address parking, construction, or indicate the

location or size of most buildings.

Accuracy of Internet maps is uncertain (this is a system problem and

exceeds the scope of this research).

PAGE 25

MapQuest.com

Pros This web-based navigation application, like many others, is a free service

to anyone with Internet access. It allows users to quickly plan a route and,

over the years, its users have become familiar with the software.

Cons Representations of buildings and parking are not present. The strokes used

to represent streets can be simplified by using smoother lines; this will

facilitate quicker recognition. More attention can be given to the alignment

of street names.

Figure 4.1 http://www.mapquest.com ©2006

PAGE 26

Maps.Yahoo.com

Pros Yahoo! Maps was the first to utilize points of interest which help travellers

locate nearby destinations. The strokes are simplified so as to minimize a

user’s distraction and confusion.

Cons The address entered was “128 N Oval Mall Columbus, Ohio 43210.” The

star with outlines represents YahooMaps’ location (incorrect). The orange

circle represents the correct location.

Errors in location determination are not a design problem, but a system

problem. As a designer, recovery and orientation may be built into the

system through location/destination verification and/or easily accessible

rerouting capabilities.

Correct location of the input address:

128 North Oval Mall, Columbus, OH 43210

Figure 4.2 http://www.maps.yahoo.com ©2006

PAGE 27

GoogleMaps

Pros GoogleMaps was the first to provide a photo-realistic representation on a

web-based mapping service. GoogleMaps is perhaps the most popular

because the images provide a better sense of spatial orientation than any

other Internet mapping services.

Cons The address entered was “128 N Oval Mall Columbus, Ohio 43210.” The

red pointer represents GoogleMaps’ calculation (incorrect). The orange

circle indicates the correct location. The photograph displays information

(shaded areas, trees, etc.) which may cause data overload.

Correct location of the input address:

128 North Oval Mall, Columbus, OH 43210

Figure 4.3 http://www.maps.google.com ©2006

PAGE 28

Mobile Navigation

Pros Inexpensive mobile mapping solutions.

Indicates points of interest with reviews.

Cons Ambiguous graphic representation of space.

Connectivity affects usability (which is not a design issue, but a

system difficulty).

PAGE 29

Microsoft Pocket Streets

Pros Microsoft Pocket Streets is a cost-efficient solution to mobile mapping.

Furthermore, the software does not require high bandwidth speeds.

Cons This ambiguous graphic representation of the space does not indicate the

user’s position, a route path, or destination. The concentration of strokes

appears to prevent users from obtaining a sense of spatial orientation. The

high contrast of the blue and white squares (though the purpose of the

squares is unclear) may be considered unnecessary and distracting.

Figure 4.4 ©2006 Microsoft Pocket Streets

PAGE 30

Zagat To Go

Pros Zagat To Go features the famous Zagat reviews of fine dining in various

cities. The application also incorporates an interactive map, providing

assistance for users in reaching their destinations. The interactive map

approaches a minimalist design, supporting visual organization.

Cons The software provides only an overhead view of the space, which is

not a familiar view to most pedestrians and automobile drivers. Varying

placement of text may cause distractions.

Figure 4.5 ©2006 Zagat To Go

PAGE 31

Google Maps Mobile

Pros Google Maps Mobile is a free service which is compatible with more

handheld devices than any other mobile mapping software (source: Google).

The full version, Google Maps, is the most popular due to its frequent updates

and advancements. This mobile interface closely resembles the desktop

version with which most people are familiar.

Cons Currently, the coverage area for Google Maps Mobile is contingent upon the

coverage area of the cellular phone service provider and will not operate if a

data connection is unavailable.

Figure 4.6 ©2006 Microsoft Pocket Streets

PAGE 32

GPS Navigation Systems

Pros Realtime location indicator.

Perspective view of current location.

Points of interest are preloaded into software.

Rerouting for pedestrian or low traffic travel.

Strong connectivity in rural areas.

Cons Visual information does not address parking, construction, or indicate the

name, location, and size of most buildings.

PAGE 33

Magellan

Pros Points of interest are preloaded into software. Rerouting for pedestrian or

low traffic travel. Strong connectivity in rural areas.

Cons The wide color palette of the interactive map may not provide a sense of

organization; overlapping symbols and text could detract from legibility and

readability. The visual information does not address parking, construction,

or indicate the location, size, or name of surrounding buildings.

Figure 4.7 ©2006 Magellan

PAGE 34

TomTom

Pros TomTom offers mapping software that can be purchased and downloaded

from their website and used on most GPS-enabled smart phones.

Cons The strokes around many of the graphic elements may contribute to subtle

yet unnecessary distractions. Furthermore, the varying alignment and text

sizes may not support visual uniformity.

Figure 4.8 ©2006 TomTom

PAGE 35

TomTom

The photograph below was taken by a user of the TomTom software

while visiting The Colosseum in Rome. Here the user displays a view

of the software interface in relation to his current location. As shown,

The Colosseum, a world renown landmark, is not represented on the

user’s map.

Research

Figure 4.8.1 ©2006 TomTom

PAGE 36

Garmin

Pros The condensed color palette may provide the user with a better sense of

priority, allowing the user to quickly differentiate between the route path

and background.

Cons The visual information does not address parking, construction, or indicate

the location, size, or name of surrounding buildings.

Figure 4.9 ©2006 Garmin

PAGE 37

MapQuest GPS

Pros MapQuest was the first to introduce inexpensive subscription-based GPS

navigation software use (currently for as low as $4.17/month). Similar to

Garmin, the interactive maps utilize a condensed color pallete which may

provide the user with a better sense of priority and visual organization.

Cons The visual information does not address parking, construction, or indicate

the location, name, or size of most buildings.

Figure 4.10 ©2006 MapQuest

PAGE 38

Guidelines

5

This section contains guidelines for creating an interactive map for handheld

devices. Although many of Jakob Nielsen’s 10 Usability Heuristics for

Interactive Design are included, every guideline can not be used as some

are inapplicable to this specific context. Nielsen’s Heuristics are intended to

be quite general, which allows opportunities to provide specific guidelines

for creating interactive maps for handheld devices, which are shown on the

subsequent pages as well.

Visibility of system status

The system should always keep users informed about what is going on,

through appropriate feedback within reasonable time.

Match between system and the real world

The system should speak the users’ language, with words, phrases and

concepts familiar to the user, rather than system-oriented terms. Follow

real-world conventions, making information appear in a natural and logical

order.

User control and freedom

Users often choose system functions by mistake and will need a clearly

marked “emergency exit” to leave the unwanted state without having to go

through an extended dialogue.

Consistency and standards

Users should not have to wonder whether different words, situations, or

actions mean the same thing. Follow platform conventions.

Error prevention (removed from evaluation)

Even better than good error messages is a careful design which prevents

a problem from occurring in the first place. Either eliminate error-prone

conditions or check for them and present users with a confirmation option

before they commit to the action.

Recognition rather than recall

Minimize the user’s memory load by making objects, actions, and options

visible. The user should not have to remember information from one part of

the dialogue to another. Instructions for use of the system should be visible

or easily retrievable whenever appropriate.

Flexibility and efficiency of use (removed from evaluation)

Accelerators -- unseen by the novice user -- may often speed up the

interaction for the expert user such that the system can cater to both

inexperienced and experienced users. Allow users to tailor frequent actions.

Aesthetic and minimalist design

Dialogues should not contain information which is irrelevant or rarely

needed. Every extra unit of information in a dialogue competes with the

relevant units of information and diminishes their relative visibility.

Ten Usability Heuristics

by Jakob Nielsen

1

2

3

4

5

6

7

8

This usability heuristic is more

appropriate for the interface

design of desktop software.

This heuristic addresses

system problems that can not

be solved through design.

PAGE 40

Help users recognize, diagnose, and recover from errors

Error messages should be expressed in plain language (no codes), precisely

indicate the problem, and constructively suggest a solution.

Help and documentation

Even though it is better if the system can be used without documentation,

it may be necessary to provide help and documentation. Any such

information should be easy to search, focused on the user’s task, list

concrete steps to be carried out, and not be too large.

9

10

PAGE 41


Help Home

»

Visibility of system status

The system should always keep users informed about what is going on,

through appropriate feedback within reasonable time.


by Jakob Nielsen

Status bar indicates remaining

duration of route.

1

PAGE 42


Help Home

»

Match between system and the real world

The system should speak the users’ language, with words, phrases and

concepts familiar to the user, rather than system-oriented terms. Follow real-

world conventions, making information appear in a natural and logical order.


by Jakob Nielsen

2

Terminology from daily

conversation.

PAGE 43


Help Home

»

User control and freedom

Users often choose system functions by mistake and will need a clearly

marked “emergency exit” to leave the unwanted state without having to go

through an extended dialogue.


by Jakob Nielsen

3

Graphic icons allow the user to

easily change the map’s view

settings and return to the previous

state if necessary.

PAGE 44


Help Home

»

Consistency and standards

Users should not have to wonder whether different words, situations, or

actions mean the same thing. Follow platform conventions.


by Jakob Nielsen

4

Consistent indicators provide

feedback of current location.

PAGE 45


Help Home

»

Recognition rather than recall

Minimize the user’s memory load by making objects, actions, and options

visible. The user should not have to remember information from one part of

the dialogue to another. Instructions for use of the system should be visible

or easily retrievable whenever appropriate.


by Jakob Nielsen

6

Non-intrusive graphic icons

facilitate user control.

PAGE 46


Help Home

»

Aesthetic and minimalist design

Dialogues should not contain information which is irrelevant or rarely needed.

Every extra unit of information in a dialogue competes with the relevant units

of information and diminishes their relative visibility.


by Jakob Nielsen

8

Map design reduced to buildings

and walkways providing a

hierarchy of information.

PAGE 47

»


Help Home

»

Help users recognize, diagnose, and recover from errors

Error messages should be expressed in plain language (no codes),

precisely indicate the problem, and constructively suggest a solution.


by Jakob Nielsen

9

Clear and succinct error message

provided if/when a deviation from

route is detected.

Auto Reroute?

Yes No

PAGE 48


Help Home

»

Help and documentation

Even though it is better if the system can be used without documentation,

it may be necessary to provide help and documentation. Any such

information should be easy to search, focused on the user’s task, list

concrete steps to be carried out, and not be too large.

10


by Jakob Nielsen

Clearly marked access to the

“Help” menu.

PAGE 49

While many of the existing heuristics for interactive design are applicable

to this project, there are areas regarding the design of interactive maps

which can not be addressed from general concepts. The following pages

are standards that I have developed which apply strictly to interactive maps

for handheld devices; they are derived from technical specifications, studies

of typography on mobile devices, and design principles for legibility and

information organization.

PAGE 50

Original Map Campus Area Bus Systems

OSU’s Campus Map used for Campus Area Bus Systems (CABS) orientation directories. While

this map was intended to be used in print, the simplified geometric shapes and visual indication of

walkways make this map an ideal starting point for an interactive map.

PAGE 51

P

PRevised Map for Interactive Context

Revised map using web-safe colors and simplified graphics to optimize bandwidth speed and

visual clarity when viewed on handheld devices. The outlines were removed because the color

contrast between the buildings and background is now increased.

PAGE 52

WorldType® Font Suites for Mobile Devices

Monotype Studios has developed typefaces designed specifically for use on handheld devices.

Below are some of the typefaces availabe at the following URL:

www.monotypeimaging.com/ProductsServices/catalogresults.aspx?style=UI&usagecategory=Mobile

In the solution provided for this research the typeface used is “Univers MT Mobile Condensed”

PAGE 53

WorldType® Font Suites for Mobile Devices

For the solution developed from this research, Univers Mobile Condensed was selected; other

ideal typeface selections can be found at the following URL:

http://www.monotypeimaging.com/ProductsServices/ESQMobile.aspx

PAGE 54

P

Guidelines

An interactive map designed for handheld devices must possess the

following characteristics:

Minimalist Design

To eliminate confusion due to unnecessary visual elements or effects,

minimalist design must be utilized when creating graphic elements for the

interactive map. Visual effects (such as drop shadows, bevel/emboss, and

outlines) should be eliminated to avoid diverting the user’s attention from

the primary and most important information: wayfinding assistance via an

interactive map.

Most interactive maps fail to indicate a building’s size, location, position, or

shape. Thus, one may argue: drawing buildings onto an interactive map

refutes the idea of minimalist design. However, displaying buildings does

not refute the idea of minimalist design because this visual information

provides an increased sense of the user’s space. When creating graphic

representations of buildings, only the shape and area are displayed

creating a flat, two-dimensional representation allowing the user to

see behind the building and beyond. The map may also offer a three-

dimensional building option (indicating the building’s height) as well as

color and possibly even the building’s texture to provide the option of further

understanding the space based on their preference.

The graphics selected for the location/route indicator must also adhere to

the idea of minimalist design and refrain from using distracting visual effects

which may divert the user’s attention. Complex graphics—specifically for the

location indicator—are discouraged while simple arrows are ideal because

of their ability to accurately identify the users location without ambiguity.

Conformity to Technical Specifications

The design must conform to any and all technical specifications as provided

by the manufacturing/engineering/production team(s). In the context of

handheld devices, these specifications include

size (typically 240px x 320px, 3:4 aspect ratio)•

colors (typically web-safe, RGB, 16 bit)•

software (the application must be compatible with the device’s operating •

system)

figure 5.1 example of minimalist

design for map.

PAGE 55

the device’s hardware (the solution used in this research requires a fully

functioning QWERTY keyboard built into the device’s hardware)

Typography

In general, any typeface selected for interactive design must be legible at

small scales (as small as 8pt) and the characters must have clear distinctions

from other similar characters. As shown in the diagram on the left, the

similar characters from the typefaces in the left column are able to be

distinguished while the characters from the typefaces in the right column

are not easily distinguished (particularly Futura). Furthermore, monospaced

typefaced are not ideal because of the amount of screen real-estate needed

to display text.

The typefaces Georgia and Verdana were designed for use on screen

(specifically, computer monitors) and are ideal choices because of their

wide counterforms which facilitate legibility on screen.

As outlined on page 53 of this documentation, Monotype Studios has

developed typefaces specifically for use on handheld devices. For the

solution developed from this research, Univers Mobile Condensed was

selected; other ideal typeface selections can be found at the following URL:

http://www.monotypeimaging.com/ProductsServices/ESQMobile.aspx

Information Hierarchy

The interactive map must give attention to visibility of system status (time/

date, current/next action, location/route indicator), color palette (utilizing

system compliant colors for coding of buildings, pedestrian walkways,

streets/buildings names, street/traffic signs, water bodies, origin/destination

(dominant color, high contrast from other colors)

Hierarchy Distinctions During Pedestrian/Automobile Versions of Map

During Pedestrian mode, the location/route indicator and origin/destination

dominate visually followed by the buildings names.

During Automobile mode, the location/route indicator and origin/

destination dominate visually followed by the streets names then the

buildings names (the names of buildings should not compete with the names

of the streets).

1 i j l

1 i j lVerdana Futura

Georgia Copperplate

Helvetica LipoD

Univers Orator

1 i j l

1 i j l

1 i j l

1 i j l

1 i j l

1 i j l

figure 5.2 Examples of

typefaces. The column on the

left shows typefaces which are

ideal for use on screen while

the column on the right shows

typefaces which are not.

figure 5.3 Examples of hierarchy

distinctions between pedestrian

[R] and automobile versions [L].

PAGE 56

Required User Controls

Zoom (in/out)•

Exit button (allowing the user to exit the program from any screen)•

Toggle between overhead/perspective views•

Help menu•

Menu button (allowing the user to return to the Main Menu from any screen)•

Orientation/Position Consistency

The virtual orientation of map view must change to seamlessly match the

orientation and position of the user in the physical world as well as the

vertical or horizontal orientation of the handheld device. That is: if the user

turns to face a building on his/her left, the map must quickly and smoothly

reorient in accordance with the users orientation change. Also, if the user

turns the handheld device from a vertical position to a horizontal position

(or vice versa), the map must quickly and smoothly reorient from a vertical

application to a horizontal application (or vice versa) accordingly.

PAGE 57

Pedestrian vs Vehicular Navigation

When a user is traveling in a car compared to walking, the user’s conditions

change which affect the way the application is used. The major differences

between pedestrian and vehicular navigation are:

Route•

Since an automobile travels on a street, it is important that the names of the

streets are clear and visible at all times to the driver. Furthermore, since a

pedestrian travels on walkways, it is important that the walkways are clear

and visible at all times to the pedestrian.

Speed•

Another major difference between automobile travel and walking is speed.

Minimalist design for the interactive map (including restricted color palette,

simplified shapes for buildings and streets, etc) facilitates readability while

the user is moving at both high and low-speeds.

Destination•

Unlike a pedestrian, a user travelling in an automobile has two destinations:

an immediate destination (where to park) and a final destination (actual

location of building, etc). This means the automobile traveller must focus

more on the streets leading to a place for parking during travel while the

pedestrian’s attention will be focused on both streets and buildings while

searching for the final destination. This is why, while in pedestrian mode,

the building’s names are more legible than while in automobile mode and,

adversely, while in automobile mode, the street’s names are more legible

than while in pedestrian mode.

PAGE 58

Addressing Shortcomings of Existing Systems

Since the field of designing interactive visual wayfinding systems for

handheld devices is relatively new, an extensive knowledge-base

for creating such content does not yet exist. Some of the primary

issues concerning the design of interactive maps are shared with

mobile web usability such as scalability, effects of natural or artificial

lighting, bandwidth efficiency, and using a web-safe color palette.

The usability guidelines provided by Rolf Molich and Jakob Nielsen

for human-computer interaction (using natural dialogue, speaking the

user’s language, minimizing the user’s memory load, consistency, error

prevention, and providing feedback, appropriate error messages and

exits) definitely apply as well. Although fundamental design principals

and usability guidelines for interactive web-based experiences provide

a valuable basis for reaching any design solution, when creating

wayfinding information for handheld devices, unique issues which are

specific to the design of interactive maps arise. Those issues include

[but are not limited to] the following:

Legibility and Readability While in Motion •

Visual performance suffers from increasing walking speed (Mustonen,

Olkkonen, Häkkinen, p.1243) and mobile device software is intended

to be used while a person is stationary or en route. Interactive mapping

software is typically used while the user is in motion, therefore, strict

attention should be given to the software engineering involved.

Although mobile devices operate on lower rates of data transfer (than

personal computers, for example), advanced engineering is needed to

enable the system to run smoothly while in motion.

If Global Position System technology locates the longitude, latitude, and

altitude of a subject, the technology should also be capable of keeping

the map’s position constant while the user is in motion, thus displaying

a continuous and smooth animation regardless of external movement

(as shown in the project demonstration). This continuous and smooth

animation will help to optimize legibility and readability while the user

is in motion.

Spatial Orientation Awareness •

While viewing a perspective version of an interactive map, the content

must shift in accordance with the users position as well as the direction

PAGE 59

in which the user is facing. In the ideal, this adjustment will occur without

any delay.

Many of the shortcomings discovered are problems that are not able to

be solved by design alone and require engineering support. Specifically,

this includes the problem of many of the web-based mapping service’s

inaccuracies.

The difference between the proposed and existing solutions are as follows:

The proposed map utilizes simplified graphics which may provide the user

with a better sense of spatial orientation by indicating walkways and the

name and location of buildings.

The familiar parking symbol used in most physical wayfinding programs is

utilized so that the user is not forced to become familiar with a new set of

symbols.

All strokes (particularly strokes that enclose the shapes) within the map

were removed with the exception of the path indicating the user’s route.

The intention is to prevent unnecessary visual information from competing

with relevant information. This technique may also support an overall

positive visual experience through the use of minimalist graphic elements.

Furthermore, the screen resolution of handheld devices varies depending on

the model. While iPhone and PalmTreo are popular due to their high screen

resolution, all handheld devices do not support the same output resolution.

Since the proposed system is not device-specific, it is necessary to take

into consideration the platform of all handheld devices. Reducing strokes

(as well as other visual information) reduces the requirements for a device’s

screen resolution.

figure 5.1 pedestrian map

figure 5.2 pedestrian map

figure 5.3 automobile map

PAGE 60

Walkthrough

6

The following pages are screen shots from the solution developed from this

research. Each stage is a progressive walkthrough of the user (in pedestrian

mode) travelling from The Ohio State University’s Union Parking Garage to

Hopkins Hall.

The interactive map provides organization of visual elements along

the route; while the path of the user is always the most important, the

surrounding buildings and walkways are the next most distinct visual

elements in the following screen shots.

How to Launch the Demonstration

1 Visit the following website:

www.MFAdesignThesis.com

2 Turn the handheld device on by clicking the power button.

3 Click the icon next to the word uMove near the center of the screen.

4 Click the “Get Directions” button from the Main Menu screen.

5 Click the “Next” button from the Directions To: screen.

6 Click the “Next” button from the Directions From: screen.

7 Click the “Start” button from the Summary screen.

8 Enjoy the demonstration!

Prototype

PAGE 65

Conclusion

7

Results

From this project, I have developed a solution based on guidelines of

creating an interactive map for handheld devices. The results can be

summarized by the following:

If design principles and usability heuristics are incorporated into interactive •

maps for handheld devices, it is reasonable to presume that the application

will be more useful, usable, and desirable than the existing models and

ensure better responses to communication, quicker comprehension, and

longer retention. If more time is allocated, primary research and user testing

can be conducted to more accurately measure the solution’s effectiveness.

Reducing visual information (including outlines, color palette, and contrast) •

is beneficial to the visual hierarchy of interactive maps for handheld devices.

This reduction contributes to both the principal of minimalist design and also

to guiding a user’s attention to the important visual elements during travel.

The importance of visual elements is contingent upon whether the user is

traveling as a pedestrian or in an automobile (see page 45).

Typography on interactive maps for handheld devices is unique; while basic •

legibility issues are still applicable (including alignment and hierarchy),

typeface selection should be limited to typefaces which were designed

specifically for use on screen. While there are many typefaces designed

specifically for use on handheld devices, for the solution provided in this

research, Univers Mobile Condensed was chosen.

PAGE 67

Contribution

This project is a design for an interactive map to be used while moving that

demonstrates the differences between pedestrian and automobile travel

(see page 58). This project also provides guidelines on how to create an

interactive map for handheld devices which are intended to support ease

of use in the end product. Page 15 of this document describes the value

of this research. Since GPS navigation – which has so much to do with

visual communication design – is becoming more and more popular, it is

beneficial to describe how visual communication design can improve the

system. Currently, the standards for designing such a system are either

non-existent or inaccessible. While an interactive designer will benefit

primarily from the design recommendations provided in this document, a

general reader will understand both the context of navigation via handheld

devices and the importance of visual communication design as applied to

interactive maps for handheld devices.

PAGE 68

The Future

Mobile mapping technology has extended beyond merely reaching

destinations. Furthermore, advancements in technology no longer require

the complex structure of GPS for calculating one’s position as Wi-Fi

Positioning System (WPS), General Packet Radio Service (GPRS), and simply

cellular phone signals will provide cost-effective solutions to location-based

software applications.

With the appropriate amount of time and financial resources, future

research on this subject may include direct comparisons of this solution

to existing Portable Navigation Systems in realtime to obtain responses

from the target audiences. After these results are collected, further design

recommendations can be applied. These design recommendations can

then be compared to the solution provided in this documentation as well as

existing Portable Navigation Systems.

A future area for possible development may be an interactive map for

handheld devices that incorporates a digital calendar; that is: task oriented

reminders would be location based. Since so much of what we do is based

on time and location, maybe there is a way to better converge these two

popular smart phone applications. For example: this interactive map and

calendar could assist students in finding classes on a university’s campus

based on the current location and time of day.

PAGE 69

References

8

Books

Beckman, John. The Virtual Dimension: Architecture, Representation, and

Crash Culture. New York: Princeton Architectural, 1998. Print.

Brauer, Wilfried; Freksa, Christian; Habel, Christopher; Wender, Karl F.

Spatial Cognition II: Integrating Abstract Theories, Empirical Studies, Formal

Methods, and Practical Applications. Berlin: Springer, 2000. Print.

Cevik, Helsin. Map Usage in Virtual Environments. North Mankato:

Storming Media, 1998. Print.

Kane, John. A Type Primer. Upper Saddle River: Prentice Hall, 2002. Print.

Lynch, Kevin. The Image of the City. New York: Triliteral, 1960. Print.

Paul, Arthur. Wayfinding People, Signs, and Architecture. New York:

McGraw-Hill Book Co., 1992. Print.

Tufte, Edward R. Envisioning Information. Cheshire, Conn: Graphics, 2001.

Wurman, Richard Saul. Follow The Yellow Brick Road: Learning To Give,

Take, And Use Instructions. New York: Bantam Books, 1992. Print.

Eason, K. Information Technology and Organisational Change Bristol, PA:

Taylor & Francis Inc, 1988. Print.

Conference Proceedings

Bradley, A. Dunlap, M. A Pathway to Independence: wayfinding systems

which adapt to a visually impaired person’s context. Proc. of IEE Symposium

on Assistive Technologies, Glasgow. (2007) Strathprints. <http://www.cis.

strath.ac.uk/~mdd/research/publications/03bradleydunlop.pdf>.

Getting, I. The Global Positioning System. Proc. of IEEE SPECTRUM 30.12

(1993): 36.

Baijal, R. Arora, M. GPS: A Military Perspective Proc. of Asian GPS

Conference (2003) <www.gisdevelopment.net/technology/gps/

techgp0048.htm>

Mustonen, T. Examining Mobile Phone Text Legibility While Walking. Proc.

of Conference on Human Factors in Computing Systems, Austria, Vienna.

Special Interest Group on Computer-Human Interaction, 2004. Web.

Bibliography

PAGE 71

Articles

Carey, T. “User Differences in Interface Design,” Computer, vol. 15, no. 11,

pp. 14-20, Nov. 1982. Print.

Coughlin, Joseph. “Technology Needs of Aging Boomers.” Issues in Science

and Technology, 22 Sept. 1999. Print.

Darken, R.P., “Wayfinding in Large-Scale Virtual Worlds” Special Interest

Group on Computer-Human Interaction, Denver, CO: 1995

Bibliography

PAGE 72

matthew stanford's mfa project documentation

Documents