Understanding
Designers
Erika Hall Je rey Veen
Mule Design Small Batch, Inc.

What Design Is
How It Proceeds
How Not to Screw it up

Design and development
can seem at odds.

Design is a* problem
solving methodology.
* mostly rational

Where the journey begins

Optimization Innovation
Launch
Build Explore
Refine Create

Tip: If you catch
yourself saying
“Let’s get a
designer to jazz
this up a bit” you’re
doing it wrong.

Define your goal!

Is a functional
prototype
enough?

Will neglecting design confuse your users?

Design Visual Information Interaction
Strategist Designer Architect Designer Writer
Interface Design Roles
Will neglecting design confuse your users?

Visual Design

Interaction Design

Information
Architecture

Using Analytics to Understand My Visitors Analyze Incoming Traffic Sources E
Measure Success
Define
Legend unique measure Measure value of
of success Compare and sort sources those sources
Advertising tasks
uses regional Identify value Identify low-
Publishing tasks Show year-to- of traffic for Remove low
Build data to combat performing
Understand Check in on Understand specific date numbers each media AdWords
demographic fraud AdWords Connect offline Watch for
Ecommerce tasks current state regular growth user segments source abnormalities
understanding to online
Existing Features make design
Explore Classify measure Segment Track Use custom
decisions help Identify and Connect Monitor
current metrics watch for visitors by task interactions visitors by Track AdWord spending for URLS to track
Planned Features based on advertisers cultivate phone sales to competitors
to identify spikes rather than per minute (in content of converstions each offline
browser/ target regions reciprocal links online leads AdWords buys
opportunity segment rich media) advertisement campaign impressions
screen support
Define separate
\"Micromanage Drive print
success Communicate pages from compare blog connect track
Monitor growth find out where \" traffic/ Drill compare jan to find value of readers to watch for
metrics rather user behavior visitors & find traffic to site search engine promotions to
by country users are from down on feb each referrer more details spikes
than site to advertisers ratio traffic traffic to leads registration
segment online
metrics
not cost per balance
define communicate Determine view visitors Watch traffic wish we cold
set segment visit. rather quantitative
monitor overall behavior user history of Compare Jan. per keyword sources by connect web watch top
benchmarks to audience by cost for metrics with
traffic patterns as demographics visitors across 05 to Jan. 06 grouped by dollars usage to box keywords
drive goals ISP lifetime of rich media
\"visitor type\" to advertisers sessions region generated office
customer qualitative
Network Referring Threshold
Threshold Integration Connections
Discovery of Browser Platform Bounce rate triggers to
triggers to Maps as a JS goal location sources with AdWords to CRM
reports via versions versions per keyword email, SMS,
email, SMS, cross-segment triggers Report Center systems
seamless nav RSS, etc.
RSS, etc.
Referring Overall
Affiliations Show position
Connection New vs Keywork
Custom Languages Hostnames source of ad on
dashboards speed returning search engine conversion
Browser and CPC vs
Campaign
platform Java enabled Domains Visitor Organic
API-based conversion
iGoogle tool combos loyalty conversion
Keyword Keyword
Country Screen Visitor consideratio Specific
Flash version
drilldown resolutions Geo location recency ns testing
Screen New vs. CPC Program
Top cities colors returning
Visits and
Daily Visitors Pageview
Tracking
Absolute
unique
visitors

Account
Overview
2.0.0 Traffic
1.0.0 Visitor 3.0.0 Content 5.0.0 Ecommerce
Sources 4.0.0 Goals
Overview Overview overview
Overview
# of Visitors new and
Top Content % of Goals Completed Revenue
retruning % visitors came
2.1.0 Direct Traffic
N directly Overview
Aver. Length of
N # of visitors N Visit Goal Conversion? 4.1.0 Goal Detail
Total Direct Trafic
N Total Revenue
N Pages/Visit N Aver. Depth of Visit
N Total Completion
N Total Transactoins
1.2.0 Total # of visitors that
N New vs. Retruning Pageviews
N came directly N Aver. Time on Page
4.2.0 Reverse
N Conversion %
Goals
S Direct Visitors N # of products
Aver. N Total Value
Funnel Visualization
Pageviews/ 1.1.0 Average PV/ % Bounce
Visite visit N Product Categories
T Top Content N Average Value Product Overview
Pageviews Pages/Visits
# of visits new 1.3.0 New vs. Avg. Time on Site
Uniq. Views
N Abandoned Funnel
% of Total
and returning
returning Pageviews Transactions for
% First Visit To Site 4.3.0 Funnel Page each product
Loyality 3.2.0 Average Time
Ave. Time on Page
% Goal 1 N Product Categorie
Recency 1.4.0 Loyalty % Exit Funnel Visualization
% Goal 2 Product
Make \"Entrance\" and T Performance
$ Index
Segmentation \"Exit\" numbers hidden
% Goal 3 3.1.0 Content 3.1.3 Site Overlay Items
until asked for by
1.5.0 Recency Detail Detail
User Defined Keyword user.
% Goal 4 Entrance & Trans
T Bounce
Content Campaign # of Transactions Total Visitors for Revenue
Uniq. Views Page
Total Revenue Ave. Price
Pageviews 3.3.0 Average
Design Criteria N # of Visitors
Bounce Rate
# of Products Aver QTY
Source
Ave. Time
Medium]
Campaign Aver. Time on
Page
% Exit
2.2.0 Referring 2.2.1 Referring 3.4.1 Percent who
Keyword Content % visitors came 2.2.2 Link Detail Aver. Bounce
started
N from other links Sources Source Detail $ Index
% who started
Country Region 5.2.0 Transaction
Visitors from list
Total Referral Trafic Visitors from Link
City
Network Source T Exit
Traffic Source 3.1.1 All Navigation
3.1.2 Initial
Location Navigation
Initial
Browser N # of sources N # of visitors N # of visitors Uniq. Views
T Referring source T
All Navigation
T Navigation
Total Transactions
Language (came from)
popularity ranking popularity ranking (Starting Page)
N # of visitors N and % of visitors N and % of visitors
Pageviews
Platform
Connection
Visits Visits Visits
N # of Transactions
Speed iff source has one link points to content
T Referring sources referral: N page
Ave. Time
Goal/Visit Goal/Visit Goal/Visit
Product
Screen
points to content % Exit T Performance
Resolution Colors
Source Domain Name N page S
Visitors from this
source
T/Visit T/Visit T/Visit
Items
else: $ Index
Java Visits % Bounce $/Visit $/Visit $/Visit
Flash
Source's Link Trans
T Referrals
Bounce Rate Pages/Visits
Revenue
URL
Pages/Visits Avg. Time on Site
Ave. Price
Visits
Time on Site % First Visit To Site
Aver QTY
Bounce Rate
First Visit To Site % Goal 1
Pages/Visits Overlay
Goal 1 % Goal 2
Time on Site
Goal 2 % Goal 3
5.3.0 Average
First Visit To Site
Revenue
Goal 3 % Goal 4
Goal 1
Goal 4 # of Transactions
Goal 2 Total Revenue
Transactions Total Revenue
Goal 3
Revenue # of Products N Revenue
Goal 4
link to geo map for this Product
segment T Performance
Transactions
link to language list for
this segment Items
Revenue
Trans
Visitors from this
S source Revenue
% Bounce
Ave. Price
Pages/Visits Aver QTY
Avg. Time on Site
% First Visit To Site
% Goal 1
% Goal 2
% Goal 3
% Goal 4
# of Transactions
Total Revenue
# of Products
link to geo map for this
segment
link to language list for
this segment
2.3.0 Search 2.3.2 Search 2.3.4 Top 2.3.1 Search 2.3.3 Search 2.3.5 Top
% visitors from 2.3.6 Keyword
Engines Overview Engine Detail Keywords Engines Overview Engine Detail Keywords
N search engines (all) (all) (all) (paid) (paid) (paid)
Detail
% of engine's paid segmentable by paid/organic
% of each search % of engine's traffic % of search traffic % of each search % of search traffic
traffic for top 5 segmentable by engine
engine for top 5 keywords for top 5 keywords engine for top 5 keywords
keywords
N % of total traffic N # of visitors N # of keywords N % of total traffic N # of visitors N # of paid keywords visitors from
keyword
traffic rank among traffic rank among
N # of keywords N your engines N
# of paid
keywords
N # of keywords N your paid search N # of keywords
N # of visitors
# of paid # of paid
N keywords N # of keywords
T Keywords N keywords N # of keywords
T Keywords traffic rank among
N your keywords
# of visitors from
T Search Engines N
# of visitors from
paid keywords Keyword
T Search Engines N paid keywords Keyword
points to content
N page(s)
Search Engine Name Visitors from this Visits Search Engine Name Visitors from this Visits
S S
Search Engine Search Engine
N is part of campaign
Bounce Rate Bounce Rate
Total # of Keywords % Bounce # of Paid Keywords % Bounce
if from Google AdWords:
Pages/Visits Pages/Visits link to AdWords
Visits
Pages/Visits
Visits Pages/Visits N keyword details
Bounce Rate Time on Site Bounce Rate Time on Site
Avg. Time on Site Avg. Time on Site Visitors from this
S Keyword
Pages/Visits First Visit To Site Pages/Visits First Visit To Site
% First Visit To Site % First Visit To Site
% Bounce
Goal 1 Goal 1

Writer

Front-end
Developer

Design Strategist

Case Study:
Measure Map

\"What's up with \"That name is taken\"
that crappy URL? or \"That password sucks\"
No No
Blog
Home Page - Ask for URL Valid? Yes
Good
Yes Getting
verificatrion data?
unregistered (or login) Started Page
and sign-up
Tour Login \"Try it out\"
No
Valid? We found the
Intercept Posts Data badge!
page
Yes
NO
Home page
User Weblog Home Page -
cookie? YES Logged In
Date Data
Badge
System Pages
Event
Account Settings
Description
Alerts Help/FAQ

Good
- very friendly. type, icons, language all contribute
- simple message \"Simple & SECURE web document sharing\"
- screenshot
- 1 2 3 steps
- obvious Get Started link
Bad
- tabs at the top are unnecessary. feels like I have to learn the
home page to use the app. who cares?
- visual hierarchy - what do I look at first?
what's most important here?
- colors are shit
Good
- RED! Hurray! Bold but friendly.
- Logotype - icon - search box. I love how they've included
their core functionality into a clever identity. love this.
- Attention to detail. Content boxes have tiny, clean drop
shadows. look at those subtle dotted underlines on links,
styled form elements. gorgeous.
- great layout, whitespace, simplicity.
- This is my favorite design of all of these. I love the
sensibility, and think it matches the directions we've been
moving very well.
Bad
- so damn red. seriously, I kinda get sick of looking at it

Common Pitfalls

Common Pitfalls
1. Poorly Defined Goals
2. Lack of Process
3. Subjectivity

I hate orange.

What we talked about
Design is: making and documenting
decisions about the experience of your
audience/users/customers
Design requires: knowledge, skills, and
thoughtful feedback
Design works: if you are clear about your
expectations, priorities, and goals

Thank you!
erika@muledesign.com je @veen.com