with Brian Fling Rules for
Building Amazing Apps for Mobile & Tablet 61. 2. 3. 4. 5. 6.

The Puget Sound Region

The Puget Sound Region “They
have the best coffee, computers and smack” —Robyn Hitchcock Viva Sea-Tac

STREETS CARTOGRAPHY CALIPER CRANE ESCAPEMENT
TUMBLER_LOCK GEARS PLUMBING SPIRAL_STAIRCASE URBAN_PLANNING CROSSBOW WINCH WHEELBARROW SHOWERS CENTRAL_HEATING LIGHTHOUSE ALARM_CLOCK CHAIN_DRIVE CANNON LEVERS WATER_MILL GIMBAL DRY_DOCK ANALOG_COMPUTERS FIRE_HOSE VENDING_MACHINE WIND_VANE CLOCK_TOWER AUTOMATIC_DOORS Ancient Greek Technology

POLITICAL_PHILOSOPHY ETHICS METAPHYSICS ONTOLOGY LOGIC
BIOLOGY RHETORIC & AESTHETICS

“Greek philosophy has shaped the
entire Western thought since its inception.”

ABACUS AMPHITHEATER AQUEDUCT ARCH BOOK
BRASS BRIDGE CAMEOS CAST_IRON CEMENT CRANE DAM DOME LOOM FLAMETHROWER GLASS BLOWING HAND_SOAP HYDRAULICS HYDROMETER KNIFE LIGHTHOUSES LEATHER MILLS STEAM_ENGINE NEWSPAPER ODOMETER PADDLE_WHEEL PEWTER POTTERY REAPER SAILS RUDDER SAUSAGE SEWERS SPIRAL_STAIRCASE STENOGRAPHY STREET_MAPS SURGICAL_INSTRUMENTS Some Innovations from the Roman Empire

“In an economy where the
only certainty is uncertainty, the one source of lasting competitive advantage is knowledge. When markets shift, technologies proliferate, and products become obsolete almost overnight, successful companies are those that consistently create new knowledge, disseminate it widely throughout the organization and quickly embody it in new technologies and products”

with Brian Fling Rules for
Building Amazing Apps for Mobile & Tablet 61. UNDERSTAND THE MEDIUM Get to know what your tablet means to your users and how they will use them. 2. GET YOUR DATA DIALED Data is the new content, and it comes from everywhere. 3. BE A MASTER OF CONTEXT Dive into context, it is the easiest way to level up to awesomeness. 4. DESIGN FOR INTERACTION Chances are you’ve never done anything like it before. 5. FOCUS ON THE DETAILS A gift for pixel perfection and psych degree can come in handy. 6. ALLOW AMPLE TIME It takes a lot longer than you might think. #1

Phones are about making the
most of the moment, simple tasks, & context.

Tablets are about focus, consumption,
simple tasks & portability.

...or just think of your
app as a great book.

with Brian Fling Rules for
Building Amazing Apps for Mobile & Tablet 61. UNDERSTAND THE MEDIUM Get to know what your tablet means to your users and how they will use them. 2. GET YOUR DATA DIALED Data is the new content, and it comes from everywhere. 3. BE A MASTER OF CONTEXT Dive into context, it is the easiest way to level up to awesomeness. 4. DESIGN FOR INTERACTION Chances are you’ve never done anything like it before. 5. FOCUS ON THE DETAILS A gift for pixel perfection and psych degree can come in handy. 6. ALLOW AMPLE TIME It takes a lot longer than you might think. #2

1 out of 3 projects
gosidewaysbecauseof BAD DATA

Content is Data

thereisno
Design without Data

1 out of 3 projects
gosidewaysbecauseof BAD DATA

“A new form of Web
content that is meaningful to computers will unleash a revolution of new possibilities.”

Push or Pull?

Figure out how your app
will Push & Pull data before you begin.

with Brian Fling Rules for
Building Amazing Apps for Mobile & Tablet 61. UNDERSTAND THE MEDIUM Get to know what your tablet means to your users and how they will use them. 2. GET YOUR DATA DIALED Data is the new content, and it comes from everywhere. 3. BE A MASTER OF CONTEXT Dive into context, it is the easiest way to level up to awesomeness. 4. DESIGN FOR INTERACTION Chances are you’ve never done anything like it before. 5. FOCUS ON THE DETAILS A gift for pixel perfection and psych degree can come in handy. 6. ALLOW AMPLE TIME It takes a lot longer than you might think. #3

JARGON ALERT Context The circumstances
that form the setting for an event, statement, or idea, and in terms of which it can be fully understood and assessed.

Events TV Billboard Radio Live
Auditory Kinesthetic Visual Word of Mouth Print Ad Mobile Device QR

Events TV Billboard Radio Live
Website Auditory Kinesthetic Visual Word of Mouth Print Ad Mobile Device WAP SMS QR Cod SMS QR Code WAP SMS SMS Bluetooth WAP MMS MMS

Events TV Billboard Radio Live
Website Auditory Kinesthetic Visual Word of Mouth Print Ad Mobile Device IVR SMS IVR SMS WAP SMS QR Code SMS QR Code SMS MMS SMS WAP SMS SMS Bluetooth Notify WAP WAP MMS Email Send to Friend W No B WAP Site WAP Site Join Buy MMS ify d to nd Discuss Send to Friend Notify Buy Send to Friend Notify

Events TV Billboard Radio Live
Website Auditory Kinesthetic Visual Word of Mouth Print Ad Mobile Device IVR SMS IVR SMS WAP SMS QR Code SMS QR Code SMS SMS MMS SMS WAP SMS SMS Bluetooth Notify WAP WAP MMS Email Send to Friend WAP Site Notify Buy WAP Site WAP Site Send to Friend Join Buy Notify Notify Send to Friend Post WAP Site MMS Send to Friend Notify Send to Friend Join Discuss Send to Friend Notify Down load Down loadNotify Vote Join Vote Notify Buy Send to Friend Notify

Always add value to the
users context*

Always add value to the
users context* *Doing so requires a little Psych 101

with Brian Fling Rules for
Building Amazing Apps for Mobile & Tablet 61. UNDERSTAND THE MEDIUM Get to know what your tablet means to your users and how they will use them. 2. GET YOUR DATA DIALED Data is the new content, and it comes from everywhere. 3. BE A MASTER OF CONTEXT Dive into context, it is the easiest way to level up to awesomeness. 4. DESIGN FOR INTERACTION Chances are you’ve never done anything like it before. 5. FOCUS ON THE DETAILS A gift for pixel perfection and psych degree can come in handy. 6. ALLOW AMPLE TIME It takes a lot longer than you might think. #4

CONTEXT
MEDIUM
(Mobile)
INTERACTION
?

JARGON ALERT Needs The circumstances
in which something is necessary, or that require some course of action.

Abraham Harold Maslow (April 1,
1908 – June 8, 1970) was an American psychologist. He is noted for his concept- ualization of a "hierarchy of human needs", and is considered the founder of humanistic psychology.

“Unlike personality, attitudes are expected
to change as a function of experience.”

Affect.

JARGON ALERT Affective Response The
emotional response that expresses an individual's degree of preference for an entity.

Affect.
Behavior.

JARGON ALERT Behavioral Intention The
verbal indication or typical behavioral tendency of an individual.

Affect.
Behavior.
Cognition.

JARGON ALERT Cognitive Response The
evaluation of the entity that constitutes an individual's beliefs about the object.

The “deck” is still very
much alive and doing incredibly well.

with Brian Fling Rules for
Building Amazing Apps for Mobile & Tablet 61. UNDERSTAND THE MEDIUM Get to know what your tablet means to your users and how they will use them. 2. GET YOUR DATA DIALED Data is the new content, and it comes from everywhere. 3. BE A MASTER OF CONTEXT Dive into context, it is the easiest way to level up to awesomeness. 4. DESIGN FOR INTERACTION Chances are you’ve never done anything like it before. 5. FOCUS ON THE DETAILS A gift for pixel perfection and psych degree can come in handy. 6. ALLOW AMPLE TIME It takes a lot longer than you might think. #5

with Brian Fling Rules for
Building Amazing Apps for Mobile & Tablet 61. UNDERSTAND THE MEDIUM Get to know what your tablet means to your users and how they will use them. 2. GET YOUR DATA DIALED Data is the new content, and it comes from everywhere. 3. BE A MASTER OF CONTEXT Dive into context, it is the easiest way to level up to awesomeness. 4. DESIGN FOR INTERACTION Chances are you’ve never done anything like it before. 5. FOCUS ON THE DETAILS A gift for pixel perfection and psych degree can come in handy. 6. ALLOW AMPLE TIME It takes a lot longer than you might think. #6

Mobile Design = Web Design

Mobile Design = Web Design

The Elements of User Experience
A basic duality: The Web was originally conceived as a hypertextual information space; but the development of increasingly sophisticated front- and back-end technologies has fostered its use as a remote software interface. This dual nature has led to much confusion, as user experience practitioners have attempted to adapt their terminology to cases beyond the scope of its original application. The goal of this document is to define some of these terms within their appropriate contexts, and to clarify the underlying relationships among these various elements. Jesse James Garrett jjg@jjg.net Visual Design: graphic treatment of interface elements (the "look" in "look-and-feel") Information Architecture: structural design of the information space to facilitate intuitive access to content Interaction Design: development of application flows to facilitate user tasks, defining how the user interacts with site functionality Navigation Design: design of interface elements to facilitate the user's movement through the information architecture Information Design: in the Tuftean sense: designing the presentation of information to facilitate understanding Functional Specifications: "feature set": detailed descriptions of functionality the site must include in order to meet user needs User Needs: externally derived goals for the site; identified through user research, ethno/techno/psychographics, etc. Site Objectives: business, creative, or other internally derived goals for the site Content Requirements: definition of content elements required in the site in order to meet user needs Interface Design: as in traditional HCI: design of interface elements to facilitate user interaction with functionality Information Design: in the Tuftean sense: designing the presentation of information to facilitate understanding Web as software interface Web as hypertext system Visual Design: visual treatment of text, graphic page elements and navigational components Concrete Abstract time Conception Completion Functional Specifications Content Requirements Interaction Design Information Architecture Visual Design Information Design Interface Design Navigation Design Site Objectives User Needs User Needs: externally derived goals for the site; identified through user research, ethno/techno/psychographics, etc. Site Objectives: business, creative, or other internally derived goals for the site This picture is incomplete: The model outlined here does not account for secondary considerations (such as those arising during technical or content development) that may influence decisions during user experience development. Also, this model does not describe a development process, nor does it define roles within a user experience development team. Rather, it seeks to define the key considerations that go into the development of user experience on the Web today. task-oriented information-oriented 30 March 2000 © 2000 Jesse James Garrett http://www.jjg.net/ia/

Mobile Design is Software Design

Mobile Design is Software Design

Mobile Design is an entirely
new breed of design. Of which the rules and best practices are still being defined.

Over 10 years in mobile
& I still feel like it’s the first day in school

Planning Interactions Design Integration Development
Testing Fixes Deployment DESIGNERS DEVELOPERS

Case Studies

Get in Touch Find Out
How We Can Help You. Brian Fling Founder & President brian@pinchzoom.com +1 206 351-6060 Charlie Barr Client Director charlie@pinchzoom.com +1 206 395-5085 My name is Brian Fling and Iʼm a Mobile Designer twitter.com/fling bookmobiledesign.org companypinchzoom.com blogflingmedia.com THANK YOU