Barrel CSL ux presentation

Three Common Mistakes
Clients Make with UX
(with some DIY Tips & Techniques sprinkled in there)

2BARREL Columbia Startup Lab UX Workshop
Hi, my name is Peter Kang.

I run a digital agency in NYC called Barrel.

Some of Our Clients

Before we start...
What is User Experience (UX)?

Jakob Nielsen & Don Norman:
“‘User experience’ encompasses all aspects
of the end-user’s interaction with the
company, its services, and its products.”

What falls under UX?
User Interface Design
Interaction Design
Information Architecture
User Research
Usability
Content Strategy
Copywriting
Optimization
Prototyping

Mistake #1
Not investing enough time, money, and energy
into planning.

“Here are a few pages that I sketched up.
Could your developer build it?”

“Yes, yes, everything looks great. When do
we get to check out the visual designs?”

Take brilliant idea
and create some
sketches of the core
functionality.
Hand off sketches
to a design/
development firm
and let them go at it
for a few months.
The results are
beautiful and launch
is perfect.Client
makes money.
What some clients think:
Client has an idea
and creates some
sketches of the core
functionality.
A comprehensive UX
phase reveals that
the idea has many
holes that need to be
addressed.
Planning reveals that
the idea is a lot more
complicated and
expensive to execute.
What’s more likely:

Embrace these activities upfront:
RESEARCH PROTOTYPING
» Take the time to understand the
competitive landscape and study similar
products/services in-depth
» Try to thoroughly audit a similar type
of website or app by creating a site map
that organizes all the pages that show up
» Create user flow charts to help you
understand the path of the user
» Use a tool like UXPin or Invision to link
up sketches, wireframes, and designs to
simulate user flows
» Test the prototypes on people to see
how they interact and understand

Example: Site Map
This detailed site
map shows the
number of pages
that will need to be
considered for a
relatively small site.

Example: User Flow Diagrams
Creating user flow
diagrams can help
you get a high-level
understand of the
steps a user needs
to take to execute
an action on your
website.

Example: UXPin Interactive Wireframe Prototype
With UXPin, you
can drag and
drop shapes to
create interactive
prototypes. This
is a great way to
validate ideas and
test user flows.

Example: Invision Prototype
Invision lets you
upload designs and
create clickable
hotspots to
string together a
prototype that can
be used to test user
flows.

Resources:
» UXPin (http://www.uxpin.com)
» Invision (http://www.invisionapp.com)
» UX Project Kits (http://www.uxprojectkits.com)
» Wireframes the Barrel Way (http://www.barrelny.com/blog/wireframes-the-barrel-way/)
» 5 Blind Spots to Consider When Designing Web Apps (http://www.barrelny.com/blog/5-
blind-spots-to-consider-when-designing-web-apps/)
» 25 Must-Have Pages for Your E-commerce Website (http://www.barrelny.com/blog/25-
must-have-pages-for-your-e-commerce-website/)

Mistake #2
Spending too much time on the “look and feel.”

“I need our website to look just right so it
evokes a certain feeling about the brand
and attracts customers.”

“I don’t think the site feels warm and inviting
enough. Could we try a beige background?”

New visitor comes
across beautiful
website.
New visitor loves
how it looks and
feels and becomes
a customer.
Client makes
money.
New visitor is
looking for a
solution to a
problem.
New visitor finds
the site through
search, word of
mouth, or PR.
New visitor pokes
around the website
and leaves after a
couple of minutes.
What’s more likely:

Shift some of the focus to:
COPYWRITING & CONTENT LONG-TERM LEAD NURTURING STRATEGY
» Is the value proposition clear? What’s
in it for the new visitor? Is there product-
market fit?
» Does the new visitor have the key
information to make a decision? Pricing,
process, features, next steps?
» Any content that assures the new visitor
that your offering is legit or the right one?
» Is there an incentive for the new
visitor to sign up and receive future
communication?
» Is there a process in place to offer
helpful content over time, build trust, and
convert the new visitor into to trying the
product or becoming a paid customer?

Example: Joyable.com

Example: Launch Effect

Resources:
» Kopywriting Kourse (http://kopywritingkourse.com/)
» Copyblogger (http://www.copyblogger.com/blog/)
» Hubspot Blog (http://blog.hubspot.com/marketing)
» “Five Content Ingredients for Designing Successful Marketing Websites”
(http://www.barrelny.com/blog/five-content-ingredients-for-designing-successful-
marketing-websites/)

Mistake #3
Thinking that every user comes through the
homepage.

“The homepage is the first page the visitor
sees, so it has to be impactful.”

“We have a limited budget, so just focus
on the homepage and we’ll keep the other
pages simple.”

New visitor enters
website through
homepage.
New visitor
checks out every
section across the
navigation.
Client makes
money.
New visitor
stumbles on to a
page on the site
(search or referral).
New visitor checks
out content on the
page.
New visitor goes
back to searching
or browsing
elsewhere.
What happens more times than you think:

Shift some of the focus to:
ANALYTICS & SEO DESIGNING OTHER PAGES
» Spend time analyzing your analytics
data to see which pages new visitors land
on and how they’re spending their time
on the website.
» Use Webmaster Tools to figure out
which queries are leading to traffic.
» Create content to target keywords
that’ll bring relevant new visitors
» Do other pages on the website make it
easy for new visitors to understand who
you are and what you offer?
» Are there clear calls to action or value
proposition content?

Example: Launch Effect Analytics
On Google
Analytics, go to
Behavior » Site
Content » Landing
Pages to see where
your visitors land.

Example: Launch Effect Webmaster Tools
Google Webmaster
Tools lets you see
the queries that
lead to traffic and
the pages that are
ranked.

Example: BuzzFeed
Have you seen
the BuzzFeed
homepage before?
Due to the socially
driven traffic, the
homepage isn’t as
dominant.

Example: Quick Sprout Blog

Resources:
» Google Analytics (http://www.google.com/analytics)
» Google Webmaster Tools (http://www.google.com/webmasters/tools)
» Moz Blog (http://moz.com/blog)
» Quick Sprout Blog (http://www.quicksprout.com/blog)

MISTAKE #1:
Not investing
enough time,
money, and energy
into planning.
Focus on:
Research &
Prototyping
MISTAKE #2:
Spending too
much time on the
“look and feel.”
Focus on:
Content/Copy
Lead Nurturing
MISTAKE #3:
Thinking that
every users comes
through the
homepage.
Focus on:
Analytics/SEO
Designing Other Pages

Questions?
@peterkang34
peter.kang@barrelny.com
www.peterkang.com

Questions?

Thank you.
CONTACT INFORMATION
Barrel
212.239.2072
info@barrelny.com
197 Grand Street, Suite 7S
New York, NY 10013
www.barrelny.com

Barrel CSL ux presentation

More Related Content

Viewers also liked

Similar to Barrel CSL ux presentation

Recently uploaded

Barrel CSL ux presentation