Structured Content: Scaling Your Ideas To Create Better Experiences

Slides from Martina Welander and myself's workshop at UX Bristol 2016. This workshop looked at how domain, content and data modelling play a key part in creating brilliant user experiences.

Transcript

1. Structured  
   Content  
   Scaling  your  ideas  to  create  better  experiences  
   •••  
   Bonny  Colville-­‐Hyde  &  Martina  Welander  
   @almostexact                        @mhwelander  
   Please ask
   questions!
   

   View Slide

2. Greetings!  
   User  Experience  Architect  
   at  Immediate  Media  
   Developer  
   at  Sitecore  
   Bonny    
   Colville-­‐Hyde  
   Martina  
   Welander  
   

   View Slide

3. Our  Aim:  
   Give  you  a  basic  understanding  of  how  structured  data  
   can  scale  to  support  product  development  
    
   -­‐  and  -­‐  
    
   Understand  the  role  you  can  play  as  a  UX  to  ensure  the  
   information  stored  in  your  product  databases  meet  user  
   needs  
   

   View Slide

4. Overview  
   1.  Scaling  over  time:  Products  always  change  
    
   2.  Intro  to  Service  Oriented  Architecture  
    
   3.  Understanding  domains  and  content  
    
   4.  Problems  with  structuring  content  
    
   5.  Communicating  data  requirements  
   

   View Slide

5. Business,  Technology  &  User  Requirements  
   are  Guaranteed  to  Change  
   

   View Slide

6. Service  Oriented  
   Architecture  
   

   View Slide

7. View Slide

8. Information  
   

   View Slide

9. Data!  
   

   View Slide

10. The  strength  of  a  database  
    lies  in  it’s  data  model    
    

    View Slide

11. The  data  model  must  map  to  the  
    way  we  understand  relationships  
    between  pieces  of  information  
    

    View Slide

12. Exercise  1:  
    Become  a    
    Service  Oriented  Architecture!  
    

    View Slide

13. Become  a  Service    
    Oriented  Architecture  
    Each  team  will  become  its  own  Service  Oriented  
    Architecture  
     
    Within  each  team,  you  will  split  into  roles  following  
    the  instructions  in  your  team  pack  
     
    You’ll  either  play  the  part  of  a  user,  an  interface,  a  
    service  or  a  database  
    

    View Slide

14. View Slide

15. What  are  the  key  UX    
    points  to  consider  about    
    Service  Oriented  
    Architecture?  
    

    View Slide

16. The  interface  controls  what  
    queries  the  user  can  request  
    

    View Slide

17. The  service(s)  can  only  retrieve  
    information  from  the  database  if  
    it  exists  and  is  Aindable  
    

    View Slide

18. A  service  cannot  access  information  
    meaningfully  if  the  database  is  not  
    content  modeled  with    
    users  in  mind  
    EfAicient  
    Effective   Satisfying  
    USER  
    EXPERIENCE  
    

    View Slide

19. The  database(s)  need  to  be  
    planned  and  structured  to  
    ensure  all  the  data  needed  for  
    the  interface  &  user  is  present  
    Artist Group
    ALBUM SINGLE
    Chart position
    Country of
    release
    dates
    sales
    

    View Slide

20. If  we  want  to  create  brilliant  user  
    experiences,  we  have  to  understand  and  
    communicate  our  audience’s  data  
    requirements  so  they  can  be  built  
    

    View Slide

21. There  is  no  magic  to  a  
    database:  it’s  just  hard  work  
    

    View Slide

22. Why  don’t  we  just  use    
    free  text  search?  
    

    View Slide

23. Free  text  search  isn’t    
    a  silver  bullet  
    u   Natural  language  is  very  dif`icult  to  build  for,  and  is  
    probably  beyond  the  scope  of  our  teams  (unless  you  
    work  for  a  super  power  like  Google)  
     
    u   The  computing  power  required  to  do  this  well  is  also  
    beyond  the  scope  of  your  server  budgets  due  to  the  
    expense  involved  
     
    u   If  its  done  poorly  it’s  a  dreadful  user  experience  
    

    View Slide

24. Exercise  2:  
    Understanding  Content  &    
    Data  Relationships  
    

    View Slide

25. The  Scenario:  
     
    “Our  CMS  comes  with  built  in  
    tags  and  categories:    
    we’ll  use  those”  
    

    View Slide

26. An  author  at  MusicReviews.com  has  written  
    a  review  of  Madonna’s  1985  single    
    ‘Into  The  Groove’  
    In  your  teams  write  out  how  you  could  tag  
    and  categorise  this  review.  
    

    View Slide

27. Madonna
    Sire
    records
    1985
    7”
    Record
    Desperately
    seeking
    Susan
    Number
    1
    UK
    Billboard
    Dance
    single of
    the decade
    Drum
    machine
    Sonic
    Youth
    Steve
    Bray
    

    View Slide

28. Madonna
    

    View Slide

29. Question  your  
    choices!  
    

    View Slide

30. When  to  use  Tags  
    YES:  
    u Small  sites  (under  2000  
    pages)  
    u One  language  
    u One  /  very  few  editors  
    u Static  content  that  
    doesn’t  need  to  be  used  
    beyond  the  page  its  on  
    NO  /  BEWARE!:  
    u Medium  sites  and  larger  
    (or  those  likely  to  grow)  
    u More  than  one  language  
    u Multiple  editors    
    u Need  to  extend  or  
    syndicate  content  into  
    multiple  places  
    

    View Slide

31. In  just  14  Posts  I  managed  to  confuse  myself…  
    

    View Slide

32. Domain  and  Content  
    Modeling:  First  Steps  
    u   What  are  the  users  doing?  
    u   What  information  do  they  need  to  access?  
    u   What  information  do  they  need  to  store?  
    u   What  information  do  they  need  to  cross  reference?  
    u   What  are  the  constituent  parts  of  that  information?  
    u   What  relationships  do  different  types  of  information  have  
    with  each  other?  
    u   How  is  information  linked  together?  
    u   Where  does  the  information  come  from?  
    u   What  limitations  does  the  information  have?  
    

    View Slide

33. Exercise  3:  
    Mapping  and  Communicating  
    Relationships  between  Data  
    

    View Slide

34. Domain  Modeling  In  Practice  
    In  your  groups,  work  together  to  map  the  content  and  
    information  associated  with  music  albums    
     
    Use  a  post  it  note  to  deAine  each  of  the  constituent  
    pieces  of  information  (data)  
     
    Draw  lines  to  link  together  the  data  relationships  e.g:  
    singles  belong  to  an  album  (e.g:  ‘Artist’  <-­‐-­‐-­‐-­‐>  ‘Album’)  
    

    View Slide

35. Modeling  Information    
    in  the  Real  World  
    You  need  a  domain  expert  and  a  database  expert  –  
    this  is  not  something  to  do  on  your  own  –  it’s  a  team  
    sport  
    The  
    Domain  
    Model  
    The  
    Content  
    Model  
    The  
    Data  
    Model  
    

    View Slide

36. Information  
    is  messy!  
    

    View Slide

37. (Work  in  progress!)  
    

    View Slide

38. View Slide

39. Communication  Challenges!  
    u   Work  with  your  domain  expert  and  content  creators  to  
    understand  the  domain  
    u   Talk  through  what  you  learn  with  your  developers:  don’t  
    chuck  documentation  at  them    
    u   Be  patient:  this  is  a  collaborative  process  
    u   Expect  to  be  confused  
    u   Work  on  paper  and  whiteboards  
    u   Don’t  try  to  design  the  database!  
    

    View Slide

40. QUESTION!  
    What  happens  if  you  produce  wireframes  or  prototypes  
    for  your  developers  and  you’ve  not  modeled  the  
    domain,  the  content  or  data?  
    

    View Slide

41. ANOTHER  QUESTION!  
    How  can  a  developer  understand  the  relationships  
    between  information  in  a  domain  on  a  wireframe  if  you  
    have  not  explained  them?  
     
    And  how  can  a  developer  plan  and  structure  a  data  
    model  to  support  future  growth  if  you’ve  not  
    considered  it?  
    

    View Slide

42. Things  Change…  
    

    View Slide

43. Questions?  
    

    View Slide

44. Credits  
    Linear  Color  Icons:  Designed  by  Freepik  and  distributed  
    by  FlatIcon  
    Database  Essential  Icon:  Designed  by  Madebyoliver  and  
    distributed  by  FlatIcon  
     
    

    View Slide