Date post: | 24-Mar-2016 |
Category: |
Documents |
Upload: | matthew-stanford |
View: | 219 times |
Download: | 3 times |
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
PAGE 13
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).
PAGE 14
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]
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)
Qualitative Survey
PAGE 20
What features do you desire most from your mobile device?
email [email, SMS/EMS/MMS text messaging]
connectivity [web browsing, webmail, instant messaging]
multimedia [audio & video, recording & streaming; camera; photos]
office [personal info manager, contacts, calendar, Office documents]
games
navigation [maps or directions]
downloaded 3rd party applications
other (please specify)
Please rate the ease of use for the following features (if applicable):
n/a poor fair average good excellent
connectivity
n/a poor fair average good excellent
multimedia
n/a poor fair average good excellent
office applications
n/a poor fair average good excellent
games
n/a poor fair average good excellent
navigation
n/a poor fair average good excellent
downloaded 3rd party applications
n/a poor fair average good excellent
other (please specify)
n/a poor fair average good excellent
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
11:00am 17mph 0.7 miles: Hopkins Hall Right on Woodruff AveLeft on College Ave
Help Home
»
Visibility of system status
The system should always keep users informed about what is going on,
through appropriate feedback within reasonable time.
Ten Usability Heuristics
by Jakob Nielsen
Status bar indicates remaining
duration of route.
1
PAGE 42
11:00am 17mph 0.7 miles: Hopkins Hall Right on Woodruff AveLeft on College Ave
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.
Ten Usability Heuristics
by Jakob Nielsen
2
Terminology from daily
conversation.
PAGE 43
11:00am 17mph 0.7 miles: Hopkins Hall Right on Woodruff AveLeft on College Ave
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.
Ten Usability Heuristics
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
11:00am 17mph 0.7 miles: Hopkins Hall Right on Woodruff AveLeft on College Ave
Help Home
»
Consistency and standards
Users should not have to wonder whether different words, situations, or
actions mean the same thing. Follow platform conventions.
Ten Usability Heuristics
by Jakob Nielsen
4
Consistent indicators provide
feedback of current location.
PAGE 45
11:00am 17mph 0.7 miles: Hopkins Hall Right on Woodruff AveLeft on College Ave
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.
Ten Usability Heuristics
by Jakob Nielsen
6
Non-intrusive graphic icons
facilitate user control.
PAGE 46
11:00am 17mph 0.7 miles: Hopkins Hall Right on Woodruff AveLeft on College Ave
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.
Ten Usability Heuristics
by Jakob Nielsen
8
Map design reduced to buildings
and walkways providing a
hierarchy of information.
PAGE 47
»
11:00am 17mph 0.7 miles: Hopkins Hall Right on Woodruff AveLeft on College Ave
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.
Ten Usability Heuristics
by Jakob Nielsen
9
Clear and succinct error message
provided if/when a deviation from
route is detected.
Auto Reroute?
Yes No
PAGE 48
11:00am 17mph 0.7 miles: Hopkins Hall Right on Woodruff AveLeft on College Ave
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
Ten Usability Heuristics
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.
PAGE 62
PAGE 63
PAGE 64
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