字幕表 動画を再生する
KENT: Hello everyone, and welcome to our April
webinar "Intro To User Experience Design:
Rethinking the Design Process".
Today, I am happy to introduce to you one of
the Cardinal Path UX team members,
also known as a major force in the
Cardinal Path design team, Mike Jones.
Mike is based out of our Phoenix
office where he works closely with
both internal teams and with clients to ensure striking and,
more importantly, effective design.
For those of you who have not attended a
Cardinal Path webinar yet,
though looking through the attendee list
it looks like most of you have,
my name is Kent
and I will be sitting in on this presentation and taking
any questions asked in the GoToMeeting's
question pane in the
overall GoToMeeting panel.
Then, at the end of this webinar,
I will feed these back to Mike
and we will see if we can answer as
many of them as we can.
So, without further ado... Mike
take this away.
MIKE: Hi everybody, this is Mike Jones.
We'll be doing an intro to user experience design
webinar this morning
hopefully you guys find it
helpful
and engaging.
uh
Real quick, just a couple of
things about me.
As Kent already mentioned, I'm a UX
and user interface designer here at Cardinal Path.
Those are some of my contact handles
if you want to reach out to me after the webinar,
that would be awesome and I can answer any
further questions you guys might have.
There will be another slide at
the end so you guys can get that info.
So, we'll jump right in.
Three main things we are going to cover today are:
What is user experience, or UX
and why should we care?
Secondly is
websites and UX.
So, how does user experience
deal with websites and website design.
And finally, breaking down UX into five planes.
We will get into that in a little bit.
We'll start with "What is User Experience?"
Or UX.
As you'll see in the industry,
UX is generally the term or the
acronym you'll see most for "User Experience".
So, what is user experience?
Seems like everyone is throwing this
word around right now, I see it
all over
blogs, and not just design blogs,
but also
blogs centered around
business and start ups
centered around
big companies like Apple.
Apple's been a huge
force in bringing
user experience to the
forefront of business.
But what is it?
What the heck is this term
people are throwing around?
I thought
a good place to start is the
all-knowing Wikipedia.
Because they're the source
of everything useful.
</sarcasm>
But actually, in this case,
it's pretty relevant.
I thought their explanation, they're
synopsis of User Experience was really helpful.
Basically, they said,
"User Experience, or UX,
is the way a person
feels about using a product,
system or service."
I think that sums it up
pretty well.
So,
basically,
what we want to say
user experience is
is "UX equals Feelings".
How people feel about
using whatever it is you are putting in front of them.
Let's break this down a little bit.
before we jump into
the design of UX.
I want to make sure we understand
user experience and what goes into that.
First up is
let's break down a user.
Ultimately, a user is a person.
So, it's a real human being.
They have
dreams
They have goals.
They have thoughts and desires.
And ultimately, when they
use something they're
generally doing it with
something in mind that
they want to accomplish at the end of it.
Whether that's a product,
or a website
or some service that you provide,
that has a user at some level.
And these users
are people, so they're
emotional, they have feelings.
And ultimately, it's these
feelings about your product that
become the user experience.
Everyday we make decisions,
based on how we feel.
So, the decisions that people make
about your product
or the final conclusion
they make about your website
are generally based on what they feel
and not so much
based on
what we like to think of as
the very logical steps of
did they accomplish exactly what
they were looking to do.
That's a big part of it
but
ultimately, it's feelings and emotions that
build that user experience.
And finally,
it's about experience,
it's about using something.
Ultimately, it's about accomplishing a goal.
So, when we talk about users
who have feelings,
when they're using something like
your product or your service,
ultimately,
they're trying to accomplish something
at the end of that.
So, we'll talk more about that in a minute.
A great example is
making a phone call
and making a reservation at a restaurant.
So, the user in this case is
someone making a phone call.
And ultimately their goal or their desire is to
book a reservation.
But there's a lot of things that
go into that experience, such as:
the phone they're using,
or
how the person answers the call
on the other end,
and then that whole conversation,
that experience with that other person,
all comes together to build the user experience.
All in the blink of,
you know, 5 minutes at the most.
Another example might be
a day trader, someone who trades stock all day.
A lot of these people do that online
and
they're using a system
that's built. They're using a
product that's built
for doing just that.
And they're using it all day, so
8, 10, maybe even 16 hours a day,
they're sitting in front of a computer,
trading stocks.
What kind of user experience are they
building over that
8, 10, 16 hour block of time?
That's a lot of time to be using
a system or a product
and so, over the course of that amount of time they're
building up a lot of emotion about it.
Either they're building a lot of positive emotion
or they're building a lot of negative emotion
as they continue to run into
frustrations or
hiccups or
things that they just
don't really like.
So, I want to kind of give a little
example of user experience
and a little story.
So, this is a story about getting a flat tire.
So, you're going to put yourself
in someone else's shoes
for just a moment.
So, pretend that you have
a big presentation at work.
and you really want to "Wow"
your boss and the client.
And so you
you get up early, you get ready,
you jump in the car,
in this case you have
a car and will drive to work,
so, you're not mass commuting
and saving the environment
and all that fun stuff.
So, you're going to hop into your car
and drive to work.
And on your way there, you get a flat tire.
And
the great thing about
getting a flat tire this day is you
have never changed a flat tire in your life.
So, you've never done it before,
don't really know how it works,
maybe understand a bit of the gist but
for the most part, you're pretty clueless.
So, you do what everybody does,
you grab the owner's manual, right?
And, you open it up
and you find the index and you look up,
"How to change my tire."
And there are some instructions in there about
where to put the jack and how to do it, so you
grab everything out of the trunk and
you get the jack set up and do everything.
And as you are jacking the car up
it doesn't work,
and the car actually falls
and it falls on the jack weird and
it breaks something.
The next thing you know, you're sitting
3 hours on the side of the road
waiting for a tow truck
He's got to tow your car,
find out you've got hundreds of dollars in repairs,
you've lost all this time,
you missed your big presentation,
and you're really frustrated.
All because
the owner's manual
told you to do something that wasn't right
for that car.
So, what do you do?
You're obviously really frustrated and angry.
And you pretty much make
a decision you're never going to
buy a car of that brand ever again.
And don't use the Honda example in the picture
as gospel here, I'm a huge Honda fan,
So, not saying this happened to me or
this is a problem with Honda's [EVIL LAUGH]
just, it was an easy image to grab.
But not only are you frustrated about
brands, but you also go and tell
all your friends about your
horrible experience you had.
And you tell them about how
when you opened up the owner's manual,
it told you one thing,
and it totally didn't work.
and even though you were inexperienced,
and you never changed a tire before,
you expected the owner's manual to tell you what to do.
And you expected it to tell you what to do
in a way that would protect your car.
And not only did you tell all your friends,
you decided to go online
go to a couple forums,
go to a couple review sites,
and write some pretty nasty words.
So, this is a great example of
a negative user experience.
And this long story,
at the end of the day, the user is you,
a person who is trying to get
to work, on time.
And you've got a big presentation,
so there's a lot of emotion involved.
And at the end of the day, the product,
you felt like the product failed you.
And regardless of the reasons
why the product failed you,
in your mind, it did.
And, so, when we talk about users,
we want to make sure that we're always looking
through their lens,
their eyes and what they see.
How they're interacting with your
product, service or website.
So, that's a negative example.
Probably good to have a positive example
just to
make sure we're
balancing everything out.
This is actually a personal story
Moocards.com
I don't know if anyone is familiar with that,
but it's a great little site.
Basically, they sell business cards.
They have a couple other products but
primarily business cards.
So, a couple years ago,
I got an offer
to come to MooCards.com
and get some free business cards.
I never really heard of them before and
thought, man, I may as well check it out.
So, I come to the site,
it's really nice, it's clean,
easy,
easy to see what's going on and
find what I'm looking for.
I find the business cards in the
dropdown menu and I head over to it.
I start looking at the product
and what they offer and what's different about it,
and, you know, another online print shop,
I find out that I can
customize my design, I can even
upload a bunch of my own
photography, or my own images,
and it'll randomly
print them on the back of the cards
in a random order,
and I was like, "That's really cool,"
a nice extra I wasn't expecting when I got there.
So, I go ahead and like,
"Well, it's free, so I might as well do it,
I'll get 50 free business cards."
And, uh, so I
go and
go through the order and
it's real easy and I upload my
photos and that's really easy and I
get to the order form
now I can check out,
pay with a credit card,
I can put my shipping information,
and off it goes.
and about 30 minutes later,
I get an auto-email
as expected to confirm that my order went through.
And what was cool and what I wasn't expecting
was that
that actually came from
an email address they set up called LittleMoo
the print robot.
So, they created this little character who
sends out all their automated emails
that
provided some personality
to this straight mechanical automated robotic
auto-email type system.
Something I think most humans kind of go "ugh"
another auto-email, I know this is just
from their system, it's not even
a person on the other end and they went
"You're right, it's not,
so we're going to make a little character
and pretend their is some identity behind him.
That was pretty cool, I liked that.
And then, when I finally got the product,
And you'll see there's a little
image there, that's not the
the final product I got,
that was one I grabbed online,
same exact experience though,
I got this cool little box,
it was nicely wrapped,
this outer design thing, and then inside it said,
Yay, youíre our new best friend.î
So, hereís a little congratulations
for a new customer relationship
that they have with me.
Theyíre excited,
Iím kind of excited, I check it out,
cards look great,
feel great,
product is really nice.
So, overall, I had a really great experience
and that actually led to me
continue to order business cards from them
for, like, the next couple years.
I still have a bunch of them sitting at home.
I still hand them out.
So, hereís a great example of a
positive user experience
specifically with a website.
And how all these little touch points that we have
with the user, in this case
MooCards.com is thinking about
not just the design,
not just the copy,
but what are those little things that they can do
to add a little personality
to add a little bit extra
to create this great, wonderful,
exciting, fun,
user experience.
So, why should we care about user experience?
I think we kind of already know but
Iíll say it anyway,
ìUser Experience
builds brand loyalty, if you do it well.î
If you have users who are having
great experiences on your website
or with your product,
theyíre going to want to continue to come back,
theyíre going to want to tell other people about it,
and most of the time, theyíre going to
continue being a great customer of yours.
And thatís exactly what you want.
Thatís business done well.
When we have returning customers and people who
want to continue to use our
products, thatís
a great sign that
we are doing things well and that
we have a healthy business
or providing something very useful.
Throwing up a couple logos
just because I can, obviously
Appleís a big one.
Theyíve really defined user experience
as a core part of
everything that they do.
From every little touch point of their product,
Steve Jobs always had a great saying about
ìUser experience is not just the design,
itís how the product is actually built.î
So, they incorporate user experience
principles all the way down to the
engineering and manufacturing
of their products.
And you got Nike, another
great example of
a user experience centered company.
Iíd highly encourage you guys
to go and check out some of the little apps.
Theyíve got some great apps for iPhone and Android
for athletics and running.
Lots of cool stuff going on over at Nike.
Mini Cooper
this is kind of an
interesting niche brand. I know
most people donít own a Mini
donít really see a Mini cooper a lot of times but
Iíve got some good friends who are involved
in the Mini Cooper
realm of users,
customers,
and theyíve built
really really
great brand loyalty
with their products.
And a lot of it comes down to
the user experience
of not only their cars,
but how they sell their cars,
and that whole process of
going and checking it out,
ordering your car,
customizing it,
tons of options,
highly recommend
checking them out,
following them to kind of see
more of how a business
thinks about user experience
through the whole process of a product.
So, moving on,
we want to talk specifically
today about
websites and user experience.
So, weíve kind of got the big general
ìWhat is user experience?î
and we saw examples
of how that works with the product,
but we really want to nail down
what are we talking about with websites.
Ultimately,
most of us work in the web industry
we run sites,
or have clients who run sites,
and this is where we really need to
be on our (?) to user experience.
So, websites and UX.
Websites are not just text anymore.
They are really becoming applications and
anyone who has worked with any
cus.. excuse me, anyone who
has run a site thatís
you know, sells product,
online is really starting to understand this
Thereís lots of sites out there
that provide content
but even at that, thereís a lot
of interaction with users,
functionality thatís
becoming more and more application like.
And so
because of this
we really need to start thinking
more and more about
user experience
when weíre designing or
planning or building websites.
So, a great place to start is
how do we break down
user experience at websites, in particular.
So,
users have
lots of experiences with their websites,
positive and negative
and a lot of them are affected by
a whole bunch of different elements
and different reasons
why they have a positive or negative experience.
I am going to list out a few
so bear with me.
One
great one
Itís always
think should be at the forefront of your mind
and when youíre thinking about your website is
ìWas the user able to
accomplish what they came to do?î
Thereís a lot hidden in that little
phrase but were they able
to accomplish what they came to do?
Weíll talk more about that in a minute.
Did they find what they were looking for?
So, when they came to the site, did they
find what they were expecting to find?
Did they find more than they were looking for,
in a good way?
So, maybe you provided more information
or more features or
more options than they were expecting,
and they found that really helpful.
Did they find what they were looking for easily?
So, easy to find.
Or was it, at least
easier than other
sites or products they have used?
Or was it really hard to find?
Or maybe the process of
getting what they wanted was
really long and laborious.
They felt like
that was way too many
steps for what I was trying to accomplish.
Was your
site a new experience for them?
And this can be both
positive and negative.
Sometimes, people might
enjoy a new experience.
Or other might be like
mmm, that was too different for me.
That was
outside of the box
and I didnít really understand what
what was going on.
This is where really understanding
who your users are
and what they like
is great for understanding
how to build a website
that really caters to them.
Maybe youíve designed and
built a website thatís
pleasantly familiar and comfortable.
A visit is really easy for them because
it feels like
theyíve been here before,
even if theyíve never been there.
They know exactly what theyíre looking for,
how to find it.
Things make sense.
Does your site
stand out from other sites
that these users have been to?
So,
a great, you know,
thing to be thinking about is
does your site
differentiate?
Are there tons of other sites that
look and feel
act and
have the same exact
thing that your site
has and a user comes to your site and goes
ìIím not really sure
if Iím where Iím supposed to be.î
Or
ìThis really isnít
any different than that other site
that I always use,
so why should I
continue using this one?î
And thereís a whole bunch
more of these and actually
Iíve got a whole bunch
more, maybe some time Iíll
throw these into a blog post and we can
continue the conversation on that.
For the sake of time, I going to
Iím going to move on.
So,
how can we provide user experiences
that are both effective
and delightful
when there are so many
elements involved
in the user experience?
A great place to start
is to break down the user
experience of a website
into bigger chunks.
or as weíre going to call them today
îPlanes of UX.î
ìFive Planes of UX.î
And these are:
Strategy,
Scope,
Structure,
Skeleton,
and Surface.
And Iíll be flat out with you guys,
I did not come up with these names,
or the structure,
I totally ripped this from another
guy, Jesse James Garrett.
He wrote a book called the
ìElements of User Experienceî
and I highly recommend you check that out,
if you get a chance.
He wrote this book in 2000.
and heís got some great insight
into how to break down UX.
And he breaks down UX into these 5
components: Strategy, Scope,
Structure, Skeleton, Surface.
And today I am going to break those
down a little bit further.
Give us a little more information about them.
And hopefully make it all make sense.
So, some important
points as weíre talking about these,
and as you see in the little diagram,
again, ripped right from his book,
and I promise Iím not
ripping everything from his books,
plenty of original content in here,
but I thought this diagram was too good
Strategies at the bottom
itís really the foundation
of everything you and then you
build on that from there.
And because of that
you canít skip around and leave stuff out.
It just doesnít work that way.
Itís really important that you
start with Strategy,
and you move your way
your way upwards
all the way through to Surface.
And these are also going to move from
abstract concretes.
When youíre working through the Strategy plane
youíre probably going to
feel a little bit out of
your element if
youíre not used to working
in an abstract thought.
But know that
as you continue to work
up that chain
start building on Strategy
building on Scope,
building on Structure,
things are going to
become more and more solid.
Youíre going to feel like
your ideas are more concrete, as you move up.
And thatís a good thing.
The abstract thought
that you start with
in the Strategy plane
is really important for
defining and creating
really concrete designs
and user experiences
that make sense.
That said,
each of these planes is going to
overlap a little bit into the next.
Itís not like youíre going to finish Strategy
completely wrap it up
tie a little bow on it
and then move on to Scope.
The reality is
as you work through Strategy, you
will begin to creep into Scope,
and as you work through Scope,
youíre going to creep into Structure.
And thatís great.
Each of these has a little bit
of fluidity to it, and thatís great.
So, letís break these down.
First up is Strategy.
So,
what do we mean when we say
Strategy?
The word gets tossed around a lot.
I see it everywhere,
and it really just means
ìWhatís the goal?
Whatís the purpose?
Whatís the big Why for your website?î
And this is where itís really
important that we start with users.
What are maybe the one
two or
three core
things that your users want
to get out of your site?
What is the desire or
goal that theyíre trying to accomplish
that your site is going to meet for them.
And in turn, what are the ones
two, or maybe three things that
you and your business
want your site to accomplish.
So what do users want
and what do you want?
Hopefully, at the end of the day, what
they want and what you want match up.
So,
a great example
and weíll actually look a little bit more at
Amazon in a little bit, but
Amazon sells books.
So, ultimately their
big why, their
big goal, their
big purpose is to sell books.
So, hopefully theyíre
users want to
buy books.
So, if we flip that around and we say
ìMy users want to buy books,
and I want to sell books,
that sounds like a great match.î
And that sounds like
you have a great start
to a successful website.
So, what does Strategy do?
Ultimately, it provides
focus and foundation.
Itís going to inform
every decision you make
after it, so when
all those other
planes that follow
your Strategy is what youíre
always going to be
coming back to you and saying
ìDoes this
meet that end goal of our users?î
Does this meet that
end goal of our business?
Hopefully, those two things match up.
If they donít,
you probably need to rethink things.
If your users want
something that your siteís not
providing, you either need
to change what your siteís
providing, the big Why, the big Goal,
or you might need
to find different users.
So,
thatís part of that whole strategy, is
really figuring out who your users are,
the big Why,
and focusing on all of that.
So, letís move into Scope.
Weíre going through these quickly,
Hopefully, there will be some more opportunities
in the future to really delve
deeper into these 5
planes of UX.
Thereís a lot to unpack in each of these.
but for now, weíre just going to do
quick overviews, so,
moving on to Scope.
Simply put, this is
the list of things users
should be able to accomplish on your site.
So, all the tasks,
or all the userís stories.
What are all those little things that
get the user to the final goal of
what they really want out of your site.
So,
buying books
is a great example.
What are all those things
that are going to lead up
to them buying books?
What are the extra things that
you might want to tack onto that
to provide
for what your business needs out of it?
Hopefully, selling more books.
So, a great example
talking about books, letís talk about Amazon.
So,
strategic goal, we already talked about this,
Amazonís probably their big
strategic goal, Iím guessing here,
I donít actually work for Amazon,
but Iím pretty sure this is
one of them
is to satisfy userís
desire to buy books.
So, what are all the ways that
theyíre going to do this?
Well, hereís a short little
user story to kind of give you an example.
So,
users can search for books
and be provided best matches of books
based on their search keywords.
That makes sense.
I want to buy a book,
Iíve got to find the book first.
So, letís give them a way to find it.
Theyíll be able to search by author,
title, ISBN, maybe some other things.
Thatís all part of that task.
And then,
as Amazon.com,
weíre going to provide
some extra information about
the book when they find it.
So, maybe theyíll be able to
view the cover artwork,
maybe read some reviews,
see a synopsis,
and actually if you check
Amazon.com,
Iím sure you all have been there,
and you click on any product,
but especially books,
thereís tons of extra
information that they provide.
So, theyíve really built out that task
and really said, ìWe want to make
sure that our users have
a lot
of different options of content to be
engaged with
when they find the book they are looking for.
And then, moving on,
they can save them to a cart
for later purchasing, so they can
continue to search,
add books to their cart,
thatís a great user task.
And then they might even be able to see
related books,
when you kind of have to go
ìHow are they related, like,
how do we determine what
other books to show them based on something
they have already looked at or
already put in their shopping cart?
Well, maybe itís based on
all the other users on our site.
So, as Amazon.com,
theyíre tracking what people are looking at,
what people are putting in their shopping cart,
and theyíre saying,
ìHey,
you, you just looked at this book,
why donít you check out some of these other
books that a lot of our other users have looked at
who also looked at the book that you saw.î
Itís a great example of adding some
an extra feature, an extra task,
that a user might find really helpful
in the process of buying a book.
And then, moving on from there, obviously
being able to checkout,
pay with a credit card,
and get an estimate for shipping,
those are all additional user stories,
user tasks,
that
can all be part of that
that long string of
that user going from
I come to your site
and now Iím going to accomplish
the goal that I came to do.
Thatís all part of that big Scope.
tsk
Sorry, there we go...
So, the next one is Structure.
So, weíve talked about Strategy,
talked about Scope.
Now, weíre getting a little bit
finer, weíre going to talk about
the Structure of our site.
What do we mean by Structure?
Well, you kind of need a plan for how
those users are going to
flow through your site.
So, ultimately, Structure is talking about
the flow of your site.
So, as a user,
how do I find what Iím looking for,
whatís the flow of actions
or interactions that Iím going to take on the site?
A great way to visualize this
is mind maps or flowcharts.
Couple examples here,
the one on the left
is more of a content oriented site,
thereís not a lot of
everythingís pretty much just
a static screen for the most part, itís just
content on pages.
We want to organize that
in a way that makes a lot of sense.
Maybe provide some categories
for different sections.
how are those categories related to one another.
And a mind map or some kind of
chart like that usually makes
that very easy to visualize
and really helps as you continue to move
through the 5 planes of user experience.
The one on the right is more of a flowchart.
So, itís kind of, what are the interactions
that a user is going to take,
so they might click on the curiousity button,
and then they have some options
and then they have
more options that they can choose
from, and then whatís going to be provided
if they click yes versus if they click no.
Kind of just the whole flow of your site
or the different functionalities within your site.
It doesnít really matter what you end up
using or what tool you use,
the more important thing is you are really
thinking these things through
in a very logical manner
and youíre thinking through as
as much detail as you possibly can.
You can spend a lot of time on the Scope,
or excuse me, the Structure phase,
and thatís really important.
Itís really important to solidify these things
before you move on to the next planes
of user experience.
The next one being Skeleton.
So, weíve figured out the Strategy,
figured out the big Why, big Goal,
and weíve figured out the Scope,
figured out what are all the functionality that
weíre going to allow our users to have.
And weíve kind of figured out a
flow of our site.
And so the next thing is the
first kind of visual element
of our site.
And thatís
wireframes, itís like the layout of sites.
What are all the elements
that are going to go on each of these
pages or each of these
views that the user is going to see?
What images are they going to see?
What copy are they going to see?
Where is that button going to go?
Is there going to be a call to action?
Where is that going to go?
A great way to visualize this
is with wireframes.
This can be as simple as a little
sketch in a sketch book.
I actually use those a lot.
Theyíre really nice, just really quick
quick and dirty explanations of
how a user is going to
see and visualize the site.
Where things are going to go,
how we communicate effectively.
The one on the right
is a little bit more fleshed out.
Obviously, itís been rendered in some kind of
computer graphics program.
You can still tell itís not focused on
the aesthetics of the site,
itís focused on just layout.
Where things are going to go,
whatís going to have the most emphasis,
things that are dark
versus whatís going to have less emphasis,
things that are light.
What content is going to be on the site?
Ultimately, the Skeleton stage is
all about creating
kind of a package from which you can build out
the skin, or the visual aesthetics, of your site.
And it also ensures that youíre
creating a site that communicates really well.
That things are clearly
defined of where theyíre going to be
so the user has a very logical and
pleasant experience as they work through your site.
And that leads us to the last
plane of user experience,
and thatís Surface.
Basically, Surface is the interface.
Itís the visual elements,
itís the copywriting,
itís the eye candy that the user is
going to experience as they
are on your site.
I kind of like to think of it as
the packaging of your site,
if your site was a product.
As they
play with your site,
theyíre going to open it up,
theyíre going to play with the packaging,
and even beyond that,
theyíre going to actually play with your product,
if your website is your product,
and theyíre going to touch it, theyíre going to feel it.
So, itís really important to be thinking through like
the copywriting on your site,
is it engaging?
Does it
really speak to the user?
This is where itís really important to understand
who your users are.
People communicate in different ways.
Great example, a really simple one,
I think weíd all be like, Ugh,
duh, thatís an easy one, but
do your users speak English,
or do they speak Spanish?
If they primarily speak English,
itís probably a good idea to have your site in English.
And if they primarily speak Spanish,
itís probably a good idea to have a site
thatís built with Spanish.
Or at least give them the option
to switch back and forth
because maybe your users are multi-lingual.
But it could be even more specific
in that you could be looking at users who
maybe theyíre an older generation,
and so
if you throw around a bunch of slang terms,
that are really catchy with
people in their teens,
then you might have a hard time engaging
people of an older generation
who donít really
understand what you mean,
or find that maybe that slang term is
maybe a little offensive or
maybe it just doesnít resonate with them.
Same thing with a lot of
business sites that I see.
A lot of them write copy
thatís industry related.
So, theyíll use catchy
industry related terms
or theyíll use an abbreviation
thatís familiar within their industry
and
thatís great if youíre talking to your competitors
but
a lot of times
businesses are not
talking with people who are familiar with
all the industry jargon
within your industry.
And so,
they might find that actually kind of off-putting, like
ìMan, youíre using all these
words and I have no idea what they mean.
And, not only do I not know what they mean, but
you havenít really given me anyway to figure out
what they mean.î
So,
no definitions,
so if you are going to use industry jargon like that,
great idea is
to at least provide some explanation.
Donít assume that your user understands
all the terminology
and vocabulary that
you would normally use in your everyday life.
Again, it all comes back to the user.
Who is your user?
How do you build an experience that
really resonates with them?
Moving on from copy,
you can also talk about design.
And thatís going to be everything from
typography, like
what fonts do you use,
is it going to be big or small,
are you going to use bold or
italics to emphasize certain things?
Building some typographical Structure
for your site.
Iím just going to include what images
maybe you have specific styles for your images,
I love this example on the right.
This is a
to be honest, I donít remember what site this was,
oh, itís the eyeglasses,
ya, so their product
is eyeglasses, theyíre trying to sell eyeglasses,
and
theyíve created a really cool Structure of
typography, so they have
some interesting fonts theyíre using and
but beyond that,
theyíve really gone to the next step
and they said, ìYou know what,
letís have photography thatís all
done in the same style.î
And itís an engaging style,
you kind of see thereís kind of this
kind of quirkiness,
slight quirkiness to it, like each of the
the models they are using
can have these quirky expressions,
It really
built the brand into
everything theyíre doing with
the design of their site,
the aesthetics of their site,
this interface that
users are going to interact with.
And even moving beyond just
the static style of your site,
is even transitions, animations,
what are those little
interactions when someone
click on something or
they roll over something.
those are all part of the user experience.
And while they might be really small
and minor
in our eyes,
a lot of times,
users find those
things really engaging and fun.
And not only fun but
when you have buttons that
feel like real things,
people are probably more likely to click on them.
When
an interface
has functionality that
feels like Iím hitting a key on my keyboard,
at least somewhat,
thereís a connection there.
People can go,
ìOh, this feels like something
Iím already familiar with.î
That makes sense
that I get to click on it and it
and it looks like what would happen
when I click a button on my computer.î
Or,
ìI use the power button
on this other device that I have,
that makes a lot of sense to me.î
Lots of things to be thinking about
in all these different planes
as you can see
I would love to
dive into more detail on those in the
future, so hopefully there will be some
more opportunities for that.
So, just a quick wrap up:
what have we talked about today...
First up, what is UX?
Itís the feelings that a user comes away with
when using our product,
specifically, our website.
So, why does UX matter?
Are users feelings affecting immensely the
likelihood of making a purchase?
Continuing to use our product
or website again and again.
And even if theyíll
recommend it to others.
If people have great experiences
more likely than not,
theyíll find a way to share it.
And thatís
great for our product,
means that we get to grow and build it,
and itís also great for our business.
Usually more users means
weíll put more money in our pockets
and the ability to continue to
grow and expand as a business.
And finally,
we talked about
what is our user experience design framework.
So, we talked about number 1, Strategy,
which is the goal of our site or product.
We talked about Scope,
which are all the tasks that users
can accomplish on our site.
Itís the Structure
kind of that map
how things are going to work.
Itís the Skeleton, or the
layout of out pages,
or our views.
And finally itís the Surface,
itís the interface.
Itís how it all looks and
feels when the user interacts with it.
Last slide Iíve got here,
just some other resources
that you guys can check out.
And Iíll make sure that we provide a link
to a PDF download so that you guys can
click these links and check them out.
Obviously, first off,
ìElements of User Experienceî
we already talked about this book,
by Jesse James Garrett.
Itís a great book to check out,
thereís even a free chapter you can download
that talks about some of the stuff
we talked about today.
Check that out there on the link.
Another great book to check out,
really short, really easy to digest,
great for anyone working within
a company who has got a site,
where you want to
be more user experience centered with
the design and the build,
of that site.
Itís called ìThe Undercover User Experience Designî.
I definitely recommend checking that out.
Cardinal Path blog, of course,
Weíve got lots of posts about UX, as well as
lots of other
digital
analytics and digital marketing
topics on there.
Definitely check that out.
ì52 Weeks of UXî
If youíre looking for kind of a crash course on UX,
this is a series of
great essays and
little brief thoughts that the writers have put together.
There are guys that
are UX industry
professionals and they built a site
and for 52 weeks, they posted once a week,
on there, thereís some great stuff to learn.
Wonít take too long to get through either,
theyíre pretty short,
but very insightful.
UX Mag, or UX Magazine,
itís got lots of great stories from the
field of user experience
of study and designs,
so you get some research topics in there.
as well as actual implementation of
design and build.
And across a whole bunch
of different industries, youíll see everything from
website designs and
website builds, all the way through to
healthcare applications and software.
Itís a great example of
how to see a lot of whatís going on
across multiple industries with user experience.
LittleBigDetails,
I love this site
itís just a little Tumblr blog, basically
the author just posts little screenshots of
small little user interface
details that they find inspirational.
If youíre a designer or
you work with a website,
this is a great way to get
some little inspiration on how you can make,
those little things that make
your website stand out
that can make an experience
just a little bit better for your users.
And finally, 90PercentOfEverything,
this is a fantastic
blog by Harry Brignull.
Heís a senior UX designer at Clearleft over in England.
which is a top UX design firm.
He just blogs about
anything and everything that comes to
his mind as a UX designer
and itís brilliant.
I definitely recommend checking him out.
So,
weíll wrap up with
questions and thereís
contact information if you want to hit me up
later today or whenever,
but Iíll
hand this back over to Kent
and see what questions you guys have.
KENT: Oddly, we seem to have no questions right now, Mike.
Letís give everyone a minute or two to
to think things over and ask whatever they care.
MIKE: Definitely.
KENT: A good question and itís for me actually,
Will the slides be available for download?
Yes.
I will see if I can get these slides through Mike
soon,
and theyíll be up on our blog
in a new post either tomorrow or the next day,
along with a recording of this webinar.
I think thatís it.
Mike... o wait...
MIKE: Awesome.
Thanks everybody.
KENT: Thereís actually one last question,
just popped in here.
What Iím going to
guess the question is is
what are your favorite strategies for testing
user experience?
MIKE: For testing user experience?
Great question.
A/B testing is always good if youíre wanting to test
one off type things like
a call to action button.
Multi-variate is also a great way,
you can test multiple options over time.
Thereís a ton of different ways to do that.
I highly recommend checking out a site
called ABTests.com
Youíll see tons of examples of
A/B tests and multi-variate tests
on landing pages and website designs.
I also highly recommend focus testing.
So,
getting a more subjective
view from users of
the experience that theyíre having on your site.
You can do that as generally as
you know, play with your site,
give them a few tasks to accomplish through it,
and see how they do.
Notice the touch points where they get hung up.
And ask them to talk through it a lot.
Thatís a great way to get, like, just kind of
down and dirty like
what experience are users really having with your site.
Data, you know,
doing an A/B test,
doing a multi-variate test
with tons of people is a great way to test things.
But a lot of times
youíll get so narrowly
focused on just
one little element that youíre trying to test,
that you donít see the bigger picture of
ìOh my goodness,
this whole series of
checkout pages just doesnít make sense to people.î
We had, you know,
Ten different users go through it and
everyone of them got hung up on it somewhere
in that process.
And so focus testing is a
great way to, to really
for you to experience how your
users are experiencing your site.
So, that was a great question, Iím sure thereís
more we can talk about, hit me up if you got more
regarding testing.
KENT: One more here, and I quite like this one,
how do you overcome clients who say things like
ìI want it this way
despite UX recommendations.î
MIKE: [Evil Laugh]
That is a great question.
Well, first off, if youíre starting with Strategy,
and hopefully you are,
and you and the client have come to an agreement,
on that Strategy,
you can always point them back to that.
and say, look,
weíre making decisions based on
this goal, this main
reason why this site exists.
Letís make sure weíre making
decisions that make sense with that.
Ultimately, youíre
going to run into stuff
or like, hey, the client wants a specific little thing
or a specific
desire on their part
that you feel doesnít make sense
itís always going to happen.
Itís just the nature of
human communications and
just working with clients.
Ultimately,
I say, as a consultant,
itís your job to tell them what you believe,
to hopefully
prove it with
some experience or data to back it up.
But at the end of the day, itís their site.
itís their product and itís their decision, so
Iíd say let them know a couple times
ìI firmly believe this is the right way to go.î
And if they continue to push back, Iíll say,
ìNo what? Alright, weíll go with your route.î
A great way to kind of justify yourself on this is
start doing some testing once you launch.
Say, ìHey
letís try it your way, but do you mind if
we do an A/B test or some multi-variate testing
or some focus testing that
focuses in on that
specific user interactions
just say, ìMaybe this actually doesnít
work and letís find out
just be sure. Great question.
KENT: Weíll give a minute here and see
if any more roll in.
Doesnít look like it.
Alright, I think we can wrap this up.
Mike.
MIKE: Cool.
Thanks everybody.
Hit me up if you got anymore questions,
but otherwise
hopefully weíll be doing another webinar on UX
soon and we can dig more into this stuff.
KENT: Bye everyone.