Larry Rosenthal on the Transition from 2D to 3D Interfaces

Today's post is a great one from Larry Rosenthal (Cube Inada), a virtual thought leader and creator of Cube3, a front-line design and consulting firm founded in 1990. Larry has been active across a broad spectrum of virtual worlds for nearly two decades, and brings a wealth of industry expertise to his subject matter. Larry originally explored these ideas in the virtual world magazine Maxping,

It's been almost 25 years since the GUI of the MACINTOSH was
unleashed on the design community in 1984. It's black and white
"icons" led to the death of the "text-dos" interface and the birth
of the 2D GUI interface. First used by the public on the Mac, then
almost everywhere else with the introduction of "Windows", the 2D
GUI and its language of metaphors and iconography has become the
standard for computer-user interface in today's world.

The inherent
strengths of the 2D GUI created a medium where the tool maker and
tool user both learned to understand the media by "how to get
around" and "what the story is " and "how this thing is to work "
from the use of visual cues and relationships. These cues became so
obviously more effective than the text-only interfaces that had
been offered to do the same before as a text only interface.

Today, 25 years later, the interface, tools, and digital medium
are again at a crossroads. Following the burst of activity that
multi-user 3d virtual worlds and virtual object economies brought
to the mainstream in 2006, Web3D and real time 3d media has become
poised to provide the immersive and game related interface to the
mass page based metaphor internet.

At this time when the virtual
worlds and realtime3d "fever" seems stalled and new models and
functions for the 3d web medium need to be discovered, it seems
like a good time for designers to ask the questions about the 2D
interface and communications, the capabilities and differences of a
3D interface and communications and how, why each does what they do
and how and why and when a designer/developer now working with 3D
communications and Web3D should be aware of each disciplines
strengths and weakness when utilizing each.

This article is a start to examine where and when 3D interfaces
and communicative designs can or should be used:

  • The 2D HTML WWW
    The rules and laws of 2D interface design and communications have
    with the GUI been implemented in mass and a community of computer
    users have learned to communicate and work via a 2D-interface
    metaphor. Pictures, words, pages, windows on the flat screen have
    been accepted as how to work on a computer. In 1994 the www
    exploded into the digital consciousness and it was 2D HTML and its
    pictures, words, click-able zones and 2d page metaphor of interface
    that "made the Internet" easy to navigate for everyone". The
    discipline of "Graphic Design" over the last 60 years had taught
    everyone, the creator and audience alike, the principles of
    "understanding" 2D design and communications and the 2D html web
    used that understanding to succeed. Today millions are using the
    www and principles of 2D interface and communications are being
    used by trained designer/developers to create an understandable and
    usable tool and medium out of the WWW Internet.
  • The New 3D WWW
    In 1994, a 3D version of the http protocol was developed. Named
    VRML, it would offer during the next few years the ability to
    create and distribute 3 dimensional information, models, and
    environments on the Internet as freely as the 2D html interface
    presented text and images. 3D communications and interfaces also
    follow basic principles many which flow from the established 2D
    principles. During the last few years the latest tools and services
    for designers that create Web3D have arrived and like the
    "PageMaker and Photoshop" designers before them did with 2D,
    designers are now flooding the internet with 3D avatars, worlds,
    spinning logos, objects and places/scenes. All of this "Web3D"
    content for the most part will be successful or not based on the
    content's development and design according to the principles of
    2D/3D interfaces and communications, and basic design. All of what
    developers/designers will and have placed on the WWW have been
    affected, knowingly or not by the content's interface.

 

The principles of 2D and 3D interfaces and
communications:

Web3D developers/designers should become familiar with the
differences and similarities of 2D and 3D interfaces and
communications. The basis of any "interface" as defined here, is to
let the user communicate with the computer as transparently as
possible in order to let the content be the message, not the effort
involved in using the medium or tools. "Interface" is that layer
between the user and the tool or task to be accomplished.

The
"visual interface " being discussed here can be considered the
device to tell the "story of how to work this thing" with "this
thing" being the screen based information presented on the
computer. A 2D GUI conveys this information very effectively as the
successful and growing 2D HTML www demonstrates but the 3D
interface offers new elements and communications that effect the
experience of the user differently and in ways that a 2D interface
cannot.

For developers and designers to discuss the relative values of a
2D or 3D interface, a definition of basic design principles and
elements must first be established. These Basic Design elements and
principles have developed not over the last "digital" decades, but
over the entire time of the existence of humans. They exist as a
part of our "human condition" and because of this, they effect and
control the "implementation" of any interface or communication,
either 2D or 3D.

The Elements and Principles of design are complex and much has
been written about them, for the purposes of this article, I
provide the following (incomplete) list and brief descriptions so
that the thoughts of how it relates to the difference between 2D
and 3D and the benefits of each can be examined. I suggest that all
Web3D developers and designers begin to learn more about these
issues as they truly are the basis of successful 3D or 2D
interface.

The Basic 2D Design Elements:

  • Line
  • Color
  • Shape
  • Direction

3D Design Elements Adds to 2D Elements:

  • Form
  • Texture

Modifying Elements: Each can exist as "animation" in
2D.

  • Time
  • Movement
  • Audio

The Principles of Design Order For Both 2D and
3D:

  • Dominance
  • Subdominance
  • Recessiveness
  • Scale
  • Position

2D is great, why do we need 3D on the web?

What 2D Interface and Communications do
well:

The 2D HTML Interface and communication of today is primarily a
product of text and image, although audio and animation are
becoming more prevalent, the majority of the WWW is text and image.
An effective 2D interface and communication is usually created by
the balance and interaction of these elements and according to the
principles of design above. These 2D design principles can create
very effective interfaces and communications. Some of the most
effective uses for 2D communications are:

1. Charts and Diagrams

2. Text

3. High Resolution imaging-photography

Why are these types of information ideal for 2D communications?
Because analytical examinations are the best candidates for a 2D
interface. Actions and Interactions that require thought and
rational logic to be carried out seem to be well suited for the
"focused" interface that the 2D offers. With no "world" to distract
the interaction, the message in a flat 2D interface can be studied,
examined and acted on. 2D interfaces can only offer a limited
amount of information per "page or window" this is its strength as
an "intellectual" type of interface experience.

Simplifying information in graphic 2D:

2D interfaces and communications are ideal to simplify and can
"cartoon" visual information for easy comprehension by the user.
This is why text and charts are so effective in 2D representations.
Both only require clear line and shape to usually get their message
across. If a developer or designer's goal is to provide an
interface that quickly "speaks" organizational image to a user than
2D interfaces contain all the elements to create successful
solutions. The same can be said for "immediate call to action" type
interfaces

In the real world, the traffic "STOP" Sign can be used as a good
example of this type of effective 2D interface since the text, and
shape and color create an "instantly recognized call to
interaction" with the understanding user. Successful 2D interfaces
on the computer utilize the same principles and the "caution, stop
or bomb" icon message windows on a computer interface can best
communicate their meanings the same way.

Photography simulating 3D reality:

High-resolution screens led to the ability to use
high-resolution photography as an interface element. Photography as
well as video or moving image can often be confused for the "3D"
that an interface can be. Photography can capture detail and
representation to such a high degree that as a 2D interface element
it can offer such "depth of simulation" that, to many, a photograph
of a street scene is more "real" on the screen than a 3D modeled
navigational model. The detail of this 2D-interface element can be
though its major problem in conveying the designer's real
intentions.

What if the street scene presented on a kiosk is meant to be a
map to show walking directions between the buildings in a mall?
Then the photographic details of the actual floor tile patterns of
each buildings lobby may have no importance to the users main
question posed to the kiosks interface: "Is my building to the left
or right of where I'm standing?". Photographic images and moving
video can now look great on a high-resolution computer screen- they
both offer an ability to simulate a 3D world within the 2D flat
desktop metaphor. When aided by audio and movement, they offer many
of the elements that 3D look to offer.

So the next questions that have to be asked are what does 3D
really add to an interface?

What 3D Interface and Communications Add:

Immersion, more powerful than an Intellectual
Engagement.

The addition of the "3rd" dimension to an interface brings with
it the new elements as listed above and the often mentioned
"Z-axis" Depth, to the 2D screen that is physically an object of
the y- height and the x- width. The 2D interface that has developed
over he last decade has adopted the "desktop" metaphor stating that
although "pages" or windows can stack up over each other. There is
always a "back surface" or "desktop" below providing a final border
to the interface in the z-axis. This "final border" provided with
it a device to simplify the usage of the computer and how much
information could be presented to viewer at one time. The user
would always be "above" or in front of the screen desktop and in
the same "still" seated position. This addition of "depth" to the
screen and the change from "desktop" to a "window onto an extended
world" brings with it the major changes to interface and
communications that 3D brings.

It is this "illusion" and "presence" that the user can now " be
in" an environment as opposed to just "viewing it from above" that
provides the greatest challenges for developers and designers. This
"immersion" factor requires that developers/designers provide an
interface that is completely consistent since the user will be
"thinking" that they are within this world and reality. This
"illusion of immersion " can be so much more effecting to the user
than the "intellectual" involvement that 2D interfaces offer so
well. They can become so effective that any element that seems out
of place with the users' understanding of the 3D interface, can
destroy the illusion thus the interfaces usability.

If its a "real/virtual world" in the computer? What am I
supposed to do? How does the "virtual world" work? And all of a
sudden "I'm working in it?"

A "3D world" simulation brings with it two elements: those of
Navigation and Emotional involvement. Although they can be part of
a 2D interface, they are overwhelmingly more a part of creating a
successful 3D interface.

We are beings of movement and motion within 3 dimensions. We
walk from place to place in the physical 3D world. We navigate from
position to position with our eyes in front of us. We see forward
and rely on memory to tell us what we have walked past. We live in
a 3D world of up/down/front back/right/left with each direction
with its own outcome and new confrontations. All of this
stimulation has evolved us into beings that "feel" and "react"
based on the ever-changing environments and confrontations before
us. We use devices like "interfaces" to "clean up" those
confrontations and distractions to focus our attention and do a
task.

Creating and developing a 2D interface allows us to immediately
"cut out" the "backside" of our concerns in accomplishing a task.
The real 3D world does not. The new 3D virtual worlds of interface
available to the masses via web3D will undoubtedly be recreations
of rooms, cities and spaces meant to "surround" the virtual
presence of the user. The 3D spaces created will then require
navigational devices within them to tell the user where and when
they exist in this 3D world. The user will need to exist within the
3D space able to comprehend the space's rules and laws that will
very much be the users "reality" during their time "within" the
interface. The users ability to understand and use the 3D world
presented to them will be the mark of a "good" 3D interface.

Navigation as Interface element:

The mechanics of navigation for the web3D masses have become the
immediate domain of the toolmakers. Each takes their "best shot" at
how to "offer navigation in 3D space". Most developers/designers
will have to utilize one/all of their solutions during this early
period of web3D integration into the WWW. Lets then discuss some
questions about navigation that comes from within the world itself
that's offered by the developer/designer.

An Object's Consistency in the World:

Inanimate objects around us do not move around and navigate as
we do. A chair cannot instantly become a lamp, or grow an arm.
Objects in the real world also have properties of mass and
existence that define them as "real". The digital world does not
have such guarantees and offers such miracles. It is the
application of such events and the status of the user to comprehend
the change that is the major factor as an interface device. In a 2D
interface the change of an object can occur and most likely be
witnessed within the framed window. In a 3D virtual world the user
can be looking 180 degrees in the opposite direction at the time of
an object's change. The challenge of the interface is to make the
change known so that whatever purpose is served by the objects
transformation, its "history" must be known by the user so that the
object is useful for them.

Audio to suggest spatial relationships:

The ability to localize audio and effect is volume within the 3D
world allows audio interface to become as important as any visual
cue to understanding the world you're within. Just as in the real
world where you can "listen" to a conversation of the person you're
with in a crowded bar and only "hear" the sounds of the distant
others around the bar, such audio localization's can be an
effective interface element to communicate to a user in the 3D
world. Audio has been used by 2D interfaces to offer at best an
"ambience" or "direct input feedback" to flat www interfaces, but
audio as a localizing element to an object you cannot see (ex.
behind you.) is a interface device that only the 3D medium
offers.

The user's effectiveness to alter the
environment.

We affect and alter our real environment constantly. There are
things we can do, like move a chair over to sit on, and things we
cannot, like move a car over, sideways to fit into a too tight
parking space. The same rules and laws are offered to exist with 3D
web worlds. The user's ability to create "cause and effect" will
immediately place them in the world and define its rules. When a
rule about an object is broken, consistency is lost and the user
cannot be sure of an action's reaction.

Time, Scale, and Distance as an Interface
device:

When using a 2D interface the user is kept for almost all
actions outside of the computer's "clock" and is functioning within
"real" time. The 2D interface is an element of the computer
(object) on the desk in the users real world. Time may seem
different as many experience when interacting with a computer but
the rules of time are set by reality. Within the 3D interface
elements like time can become altered and elements like distance
that are associated with time can also be affected to behave
"unreal".

Scale also becomes a variable for a developer/designer to effect
in relationship to distance and time. Is the castle far away or
just small? Or both as you navigate closer? The manipulation of
time and its relation to 3D space can become a navigational
nightmare within the 3D interface. Our body size in the real world
sets many of our notions of time, scale, and distance. It's no
coincidence that we measure distance in "feet". We use our own mass
and size to "fit" into our real world. Within a flat screen on our
desktops 3D offers the world paradigm but to most at small scale (a
screen that's about 15 inches across:). Interface designers working
with 3D will have to confront the issue of scale, speed, and
distances in a way never required in 2D windowed interfaces.

The Addition of EMOTION:

The developers/designers use of the 3D space and the objects
within will when coupled with the discussed elements of navigation
cause an emotional response within the user. Immersion within the
(real) world will, by the nature of our being, cause an emotional
response. Simulated 3D interfaces and worlds will offer the same
responses. The "feelings" brought on by 3D immersion will be of an
entirely different nature then those of the simple 2D interfaces
immersion capabilities. The "roller coaster" IMAX film experience
is very different than even the most well written and acted action
movie presented on a normal movie screen. "Being there" within the
world will effect our thoughts and feelings in a different way than
the detached "windowed" 2D interface can offer. 3D interfaces offer
the developer/designer the reaction of "I was there" to add too "I
did/saw that" or "I read about that" when a user is recounting an
interactive experience.

Conclusion:

Each new year will be another year "looking for the killer app"
for web3D media. Virtual Worlds, Avatars, Social Games MMO's,
Corporate Meetings, Virtual Objects Sales, etc. will all be in
vogue for a few months at a time, But the differences between 2D
and 3D media discussed in this article should, I hope, assist
developer/designers in the choice to utilize one or the other media
in their web projects. The 2D interface has always existed within
the natural 3D world as a way to simplify and organize the
information of world around us.

The 3D interface can simulate that
world and offer the beginnings of it's properties and our natural
reactions and emotions to them. The capability to offer 3D
interfaces to the WWW via all these web3D technologies should offer
designers and developers a way to offer communications and
interfaces that can be used for certain applications more
effectively than ever before. For Web3D though to succeed as a
widely used web media it must be used to its inherent interface
strengths and not as just adding the latest technology to a web
page or the internet.

In closing, always let "The task define the interface and the
experience define the medium" The designer/developer should define
the technologies required to create the interface needed to fulfill
the task. Real time web3D as one of those technologies offers the
complexities of the 3D interface, with it the benefits and
challenges of communicating within the 3D environment. When
properly adopted, Web3D can provide a unique interactive experience
that may in fact become deeper than what the 2D Interface can and
have for now provided.

2 thoughts on “Larry Rosenthal on the Transition from 2D to 3D Interfaces”

  1. We live in 3D both in space and time, and for those of us already exploring this medium,the urge to scan the horizon is like coming home to a tool we all knew was coming, but did not visualize it till the birth of platforms like secondlife, twinity and the many others.
    Like 2D web, it all boils down to content that fills these horizons, be it new vistas to stimulate the mind, or mirrors of places and themes we cannot get to due to geographical distance. Julius Sowu Virtually-Linked

  2. Not just geographical distance. 🙂 Virtuality allows for mediated experiences that defy many natural boundries. But in the end nature, and human nature (at leat when its us, not a puppy wearing the vr googles;) will define the mediums of our future.

Comments are closed.