1
DEFINE YOUR GOALS
INFORMATION E-COMMERCE
SYSTEMS:
SERVICES:
PRODUCTIVITY CONVERSION

CONTENT
WEBSITES:
ENGAGEMENT
2
THE TARGET AUDIENCE
DILEMMA
WHO’S MORE
IMPORTANT?

THE BLOGGERS?
WHO’S MORE
IMPORTANT?

THE BLOGGERS?

THE READERS?
MEET DESIGNER’S

WORST

TARGET AUDIENCE

NIGHTMARE

GEN-Y
BORN IN THE

1980’S AND
FULL WITH

CONF
LICTS
•
•

TECHN SAVVY
CREATIVE

•
•

SOCIAL ANIMALS
ENVIRONMENTAL
AWARE

•
•

ENTREPRENEURS
RELATIONS OVER
MONEY

•
•

LONG TER...
NOBODY
REALLY
GETS
THEM
NOBODY
REALLY
GETS
THEM

US
3
THE NEED FOR
INFORMATION
VS.

A.D.D
3

T.M.I - OUT
T.L.D.R - IN
THE BIG

PARADOX

OF CONTENT
WRITING TEXTS

FOR PEOPLE
WHO

CAN’T READ
LIVING WITHOUT

FOCUS
Doing things while

MOVING
THE SOLUTION
ONE DIRECTION
ONE DIRECTION

>>>
‫"לא יודעים לאן‬
‫הולכים"‬

‫מי יצ‬
‫ביטו‬

‫רק קומץ מתוך 06 "מוזמנים"‬
‫למתקן חולות, התייצבו‬
‫בת"א. סלים מסודן: אני‬
‫עו...
‫"לא יודעים לאן‬
‫הולכים"‬
‫רק קומץ מתוך 06 "מוזמנים"‬
‫למתקן חולות, התייצבו‬
‫בת"א. סלים מסודן: אני‬
‫עושה מה שאומרים לי‬...
ANATOMY OF MAVEZE
BOULEVARD MODEL

CONTENT, VISUALS, MOVEMENT,
ONE DIRECTION.
LET’S GO THERE…
ABOUT

MENU

BLOGGER
PAGE
POST
PAGE

CATEGORY PAGE
CATEGORY PAGE
CATEGORY PAGE
CATEGORY PAGE
CATEGORY PAGE
CATEGORY PAGE
4
RESPONSIVE DESIGN:
THE HORIZONTAL TRICK
=

≠
5
BALANCE BETWEEN
CROWDED AND BORING
5

8

7

4 2 4

4

6

4

6
6
THINKING ABOUT CMS
AND MANAGEMENT
PLAYING WITH LEGO
7
THINK ABOUT READING
IN TERMS OF ROI
Attention deficit hyperactivity
disorder predominantly
inattentive (ADHD-PI), also
called attention deficit
disorder (ADD)...
Attention deficit hyperactivity
disorder predominantly
inattentive (ADHD-PI), also
called attention deficit
disorder (ADD)...
Attention deficit hyperactivity
disorder predominantly
inattentive (ADHD-PI), also
called attention deficit
disorder (ADD)...
vity

he
cit
HD).
nged
stic
Mental

WHAT IS ADD?
Attention deficit hyperactivity
disorder predominantly
inattentive (ADHD-...
ity

e
cit
D).
nged
tic
ental

WHAT IS ADD?

WHAT IS ADD?

WHAT IS ADD?

Attention deficit hyperactivity
disorder predomin...
?

WHAT IS ADD?

WHAT IS ADD?

ty

Attention deficit hyperactivity
disorder predominantly
inattentive (ADHD-PI), also
call...
READABILITY
100 CHARS FOR PRODUCTIVITY

45-74 CHARS FOR ENGAGEMENT
8
THINK ABOUT READING
IN TERMS OF
CONVERSION
ENGAGEMENT
LEVEL

MOVING TO
NEXT POST /
SHARING
PROVIDING
FEEDBACK

FINISH
READING
GOING ON
DECIDING
TO START

time
9
HELPING PEOPLE
CHOOSE USING
CONTENT HIERARCHY
RATING MODEL
‫מדד ההשפעה‬
10
THE CHALLENGE OF
CREATING
WRITER-READER
INTIMACY
11
CREATE A SENSE
OF TIME, PLACE, MOOD
12
THINK ABOUT
USING SOUNDS
LET’S GO THERE…
13
LET YOUR READERS
RESPOND
14
GIVE THE BLOGGERS
A RESPECTFUL PRESENCE
15
THINK ABOUT
BANNER BLINDNESS
16
THINK OF A RELEVANT
MOBILE EXPERIENCE
PROFESSINAL

SOCIAL PRESENCE
LEAVING THINGS
TO CHANCE
“WE DON’T
LOOK GOOD”
GROUP POWER
CHALLENGE:
CREATE A SITE FOR
A UX SPECIALIST
CHALLENGE:
CREATE A SITE FOR

A UX SPECIALIST
THE PROGRAM
THAT CREATES THEM!
14
PROVIDE EFFECTIVE
ONLINE PRESENCE
FOR YOUR WRITERS
17
USE GAMIFICATION,
BUT USE IT WISELY
WORLD’S

3 SECRET FORMULAS
18
RESPONSIVE DESIGN:
TRICK OF THE THIRDS
HEADER
HEADER
HEADER
HEADER

=

HEADER

≠

HEADER
19
CONTENT CREATION
VS.
CONTENT CURATION
20
THE BARRIER BEHIND
CONTENT CREATION
CREATING
CONTENT
HAS NEVER
BEEN
THAT
EASY!
THERE IS
SO MUCH MORE TO
TALK ABOUT…
‫הספר‬

‫מדהים!‬
‫אני גאה בך!!!‬

‫אמא.‬
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014
Upcoming SlideShare
Loading in...5
×

UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014

1,421

Published on

A double case study showing 2 success stories of UX design for leading content websites MaVeZe.co.il and UXVToday.co.il, together with a practical set of tips that everyone who's designing UX for content should think about during the process. Taking you behind the scenes of UX design.

Published in: Design, Health & Medicine
2 Comments
4 Likes
Statistics
Notes
No Downloads
Views
Total Views
1,421
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
0
Comments
2
Likes
4
Embeds 0
No embeds

No notes for slide

UXVision - 20 things you need to know about UX for Content - Tal Florentin | UX Salon | January 2014

  1. 1. 1 DEFINE YOUR GOALS
  2. 2. INFORMATION E-COMMERCE SYSTEMS: SERVICES: PRODUCTIVITY CONVERSION CONTENT WEBSITES: ENGAGEMENT
  3. 3. 2 THE TARGET AUDIENCE DILEMMA
  4. 4. WHO’S MORE IMPORTANT? THE BLOGGERS?
  5. 5. WHO’S MORE IMPORTANT? THE BLOGGERS? THE READERS?
  6. 6. MEET DESIGNER’S WORST TARGET AUDIENCE NIGHTMARE GEN-Y
  7. 7. BORN IN THE 1980’S AND FULL WITH CONF LICTS
  8. 8. • • TECHN SAVVY CREATIVE • • SOCIAL ANIMALS ENVIRONMENTAL AWARE • • ENTREPRENEURS RELATIONS OVER MONEY • • LONG TERM PLANS WANT QUICK WINS
  9. 9. NOBODY REALLY GETS THEM
  10. 10. NOBODY REALLY GETS THEM US
  11. 11. 3 THE NEED FOR INFORMATION VS. A.D.D
  12. 12. 3 T.M.I - OUT T.L.D.R - IN
  13. 13. THE BIG PARADOX OF CONTENT WRITING TEXTS FOR PEOPLE WHO CAN’T READ
  14. 14. LIVING WITHOUT FOCUS
  15. 15. Doing things while MOVING
  16. 16. THE SOLUTION
  17. 17. ONE DIRECTION
  18. 18. ONE DIRECTION >>>
  19. 19. ‫"לא יודעים לאן‬ ‫הולכים"‬ ‫מי יצ‬ ‫ביטו‬ ‫רק קומץ מתוך 06 "מוזמנים"‬ ‫למתקן חולות, התייצבו‬ ‫בת"א. סלים מסודן: אני‬ ‫עושה מה שאומרים לי‬ ‫(חדשות)‬ ‫בממשל‬ ‫9002 ש‬ ‫שנה קו‬ ‫האם יפ‬ ‫(כלכלה‬
  20. 20. ‫"לא יודעים לאן‬ ‫הולכים"‬ ‫רק קומץ מתוך 06 "מוזמנים"‬ ‫למתקן חולות, התייצבו‬ ‫בת"א. סלים מסודן: אני‬ ‫עושה מה שאומרים לי‬ ‫חדשות‬ ‫מי יצ‬ ‫ביטו‬ ‫בממשל‬ ‫9002 ש‬ ‫שנה קו‬ ‫האם יפ‬ ‫חדשות‬ ‫כלכלה‬
  21. 21. ANATOMY OF MAVEZE
  22. 22. BOULEVARD MODEL CONTENT, VISUALS, MOVEMENT, ONE DIRECTION.
  23. 23. LET’S GO THERE…
  24. 24. ABOUT MENU BLOGGER PAGE POST PAGE CATEGORY PAGE CATEGORY PAGE CATEGORY PAGE CATEGORY PAGE CATEGORY PAGE CATEGORY PAGE
  25. 25. 4 RESPONSIVE DESIGN: THE HORIZONTAL TRICK
  26. 26. = ≠
  27. 27. 5 BALANCE BETWEEN CROWDED AND BORING
  28. 28. 5 8 7 4 2 4 4 6 4 6
  29. 29. 6 THINKING ABOUT CMS AND MANAGEMENT
  30. 30. PLAYING WITH LEGO
  31. 31. 7 THINK ABOUT READING IN TERMS OF ROI
  32. 32. Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders
  33. 33. Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders WHAT IS ADD? Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders
  34. 34. Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders WHAT IS ADD? Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders WHAT IS ADD? Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders
  35. 35. vity he cit HD). nged stic Mental WHAT IS ADD? Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders WHAT IS ADD? WHAT IS ADD? Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). SOURCE OF THE TERM The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders
  36. 36. ity e cit D). nged tic ental WHAT IS ADD? WHAT IS ADD? WHAT IS ADD? Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). SOURCE OF THE TERM WHERE IT ALL BEGAN? The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders
  37. 37. ? WHAT IS ADD? WHAT IS ADD? ty Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). e t D). ged ic ental SOURCE OF THE TERM WHERE IT ALL BEGAN? The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental Disorders WHAT IS ADD? Attention deficit hyperactivity disorder predominantly inattentive (ADHD-PI), also called attention deficit disorder (ADD), is one of the two types of attention deficit hyperactivity disorder(ADHD). WHERE IT ALL BEGAN? The term was formally changed in 1994 in the new Diagnostic and Statistical Manual of Mental
  38. 38. READABILITY 100 CHARS FOR PRODUCTIVITY 45-74 CHARS FOR ENGAGEMENT
  39. 39. 8 THINK ABOUT READING IN TERMS OF CONVERSION
  40. 40. ENGAGEMENT LEVEL MOVING TO NEXT POST / SHARING PROVIDING FEEDBACK FINISH READING GOING ON DECIDING TO START time
  41. 41. 9 HELPING PEOPLE CHOOSE USING CONTENT HIERARCHY RATING MODEL
  42. 42. ‫מדד ההשפעה‬
  43. 43. 10 THE CHALLENGE OF CREATING WRITER-READER INTIMACY
  44. 44. 11 CREATE A SENSE OF TIME, PLACE, MOOD
  45. 45. 12 THINK ABOUT USING SOUNDS
  46. 46. LET’S GO THERE…
  47. 47. 13 LET YOUR READERS RESPOND
  48. 48. 14 GIVE THE BLOGGERS A RESPECTFUL PRESENCE
  49. 49. 15 THINK ABOUT BANNER BLINDNESS
  50. 50. 16 THINK OF A RELEVANT MOBILE EXPERIENCE
  51. 51. PROFESSINAL SOCIAL PRESENCE
  52. 52. LEAVING THINGS TO CHANCE
  53. 53. “WE DON’T LOOK GOOD”
  54. 54. GROUP POWER
  55. 55. CHALLENGE: CREATE A SITE FOR A UX SPECIALIST
  56. 56. CHALLENGE: CREATE A SITE FOR A UX SPECIALIST THE PROGRAM THAT CREATES THEM!
  57. 57. 14 PROVIDE EFFECTIVE ONLINE PRESENCE FOR YOUR WRITERS
  58. 58. 17 USE GAMIFICATION, BUT USE IT WISELY
  59. 59. WORLD’S 3 SECRET FORMULAS
  60. 60. 18 RESPONSIVE DESIGN: TRICK OF THE THIRDS
  61. 61. HEADER
  62. 62. HEADER
  63. 63. HEADER
  64. 64. HEADER = HEADER ≠ HEADER
  65. 65. 19 CONTENT CREATION VS. CONTENT CURATION
  66. 66. 20 THE BARRIER BEHIND CONTENT CREATION
  67. 67. CREATING CONTENT HAS NEVER BEEN THAT EASY!
  68. 68. THERE IS SO MUCH MORE TO TALK ABOUT…
  69. 69. ‫הספר‬ ‫מדהים!‬ ‫אני גאה בך!!!‬ ‫אמא.‬

×