Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Vancouver Words & pixels workshop

Louder Than Ten
October 28, 2016

Vancouver Words & pixels workshop

We've brought it all home, folks. Learn how a content and design together approach can transform and augment your content and launch your messages into space.

Louder Than Ten

October 28, 2016
Tweet

More Decks by Louder Than Ten

Other Decks in Design

Transcript

  1. PIXELS
    WORDS+

    View Slide

  2. Rachel Gertz Travis Gertz Kenneth Ormandy
    @TheStrayMuse @TravisGertz @KennethOrmandy
    @louderthanten
    louderthanten.com kennethormandy.com

    View Slide

  3. washrooms
    recycling/garbage
    exits
    buzzer
    food
    afterparty
    Housekeeping

    View Slide

  4. Wifi
    Network
    PullFocus Auditorium-5G
    Password
    PullFocus8306

    View Slide

  5. Agenda
    10 to 1:30 pm
    Part 1: Play it as it lays
    Part 2: Polishing content turds
    LUNCH (45 min)
    1:30 to 5 pm
    Part 3: After a little spruce
    Part 4: Extracting emotion
    BREAK (15 min)
    Part 5: Making content & design love
    QA
    5:15 to 7:30 pm
    After party at Revel

    View Slide

  6. Anything you want us to cover?

    View Slide

  7. Louder Than Ten wants to provide a fun, safe event experience
    for all of you regardless of your gender, gender identity and
    expression, sexual orientation, ability, physical appearance, body
    size, race, age or religion. We won’t tolerate harassment of
    participants. If you break these rules, you may be asked to leave
    and barred from future events.


    Need help?
    Talk to Travis, Rachel, or Anna directly, or email us at
    [email protected]
    Code of conduct

    View Slide

  8. heroimages.com

    View Slide

  9. craftcms.com

    View Slide

  10. teamgantt.com

    View Slide

  11. teampassword.com/words

    View Slide

  12. fairgoods.com

    View Slide

  13. get.cushionapp.com/louderthanten

    View Slide

  14. webflow.com

    View Slide

  15. Let’s begin

    View Slide

  16. you?
    Who’s

    View Slide

  17. Gathering
    Curating
    Maintaining
    Content
    Strategy
    Content

    View Slide

  18. Express
    information
    Design

    View Slide

  19. Content
    nightmares

    View Slide

  20. Content first.

    View Slide

  21. Play it as it lays
    15–20 minutes
    Part 1

    View Slide

  22. Example

    View Slide

  23. What did you struggle with?
    What’s it like to work with content first?
    How did it go?

    View Slide

  24. Part 2
    How to polish a
    content turd
    45–60 minutes

    View Slide

  25. Example

    View Slide

  26. What did you struggle with?
    How did it feel to strip things down?
    How did it go?

    View Slide

  27. Show & tell

    View Slide

  28. Research
    Content
    Design
    Development

    View Slide

  29. Talk about it…
    Content: creates value
    Writers: estimate & scope
    Contract: build writing in

    View Slide

  30. The writer
    starts the show
    Kickoff
    Research
    Design
    Strategy
    Launch

    View Slide

  31. Define your
    GOALS

    View Slide

  32. Collaborate on content
    Write your draft

    View Slide

  33. LUNCH
    BREAK
    45 minute

    View Slide

  34. View Slide

  35. View Slide

  36. EVERYTHING
    LOOKS
    THE SAME

    View Slide

  37. EVERYTHING
    SOUNDS
    THE SAME

    View Slide

  38. Our product is boring.
    We create terrible experiences
    Every Company

    View Slide

  39. Web content is boring.
    We create terrible experiences
    Every Company
    Stop reading this crap we’ve produced
    and sign up for our crappy newsletter
    so you can receive more crap.

    View Slide

  40. Web content is boring.
    We create terrible experiences
    Every Company
    Stop reading this crap we’ve produced
    and sign up for our crappy newsletter
    so you can receive more crap.
    I see you didn’t buy
    our crap.
    Do you need help
    trying our crap? I’m
    here if you need me
    to go over any crap
    with you…

    View Slide

  41. View Slide

  42. View Slide

  43. View Slide

  44. View Slide

  45. We don’t care
    about content.
    We only care about what it
    can do for us.

    View Slide

  46. But what if we did?

    View Slide

  47. Content first.

    View Slide

  48. Content first.
    So we know how big to
    make the boxes.

    View Slide

  49. Content
    Design

    View Slide

  50. Content
    Design
    Do we even
    need boxes?

    View Slide

  51. Design with expression
    to augment the
    message of the content

    View Slide

  52. Content &
    design
    working
    together

    View Slide

  53. View Slide

  54. AMPLIFIES
    Design
    the message.

    View Slide

  55. We can do this
    on the web…

    View Slide

  56. COLOUR

    View Slide

  57. View Slide

  58. TyPe

    View Slide

  59. View Slide

  60. size
    style
    and

    View Slide

  61. View Slide

  62. Media that rides with the content.

    View Slide

  63. View Slide

  64. INTER

    ACTIVITY

    View Slide

  65. Kenneth!
    Show us how?

    View Slide

  66. type

    View Slide

  67. Web type specimens

    View Slide

  68. Web type specimens
    are web type specimens

    View Slide

  69. The web is
    not print

    View Slide

  70. The web is
    not “not print”

    View Slide

  71. The web is
    a medium

    View Slide

  72. View Slide

  73. View Slide

  74. View Slide

  75. https://www.instagram.com/p/8iwizngVbJ

    View Slide

  76. View Slide

  77. View Slide

  78. View Slide

  79. moriston.losttype.com
    Design & Dev
    Type design
    Editing
    Distributor
    Kenneth Ormandy
    Riley Cran
    Danelle Cheney
    The Lost Type Co-op
    Moriston type specimen site

    View Slide

  80. View Slide

  81. You be the
    copy writer

    View Slide

  82. View Slide

  83. 1403.slantedhall.com
    Design & Dev
    Type design
    Distributor
    Kenneth Ormandy
    Jeff Kellem
    Slanted Hall
    1403 Vintage Mono Pro site

    View Slide

  84. View Slide

  85. View Slide

  86. View Slide

  87. View Slide

  88. View Slide

  89. View Slide

  90. escafina.losttype.com
    Design & Dev
    Type design
    Additional design
    Distributor
    Kenneth Ormandy
    Riley Cran
    Danelle Cheney,
    Dan Gneiding
    The Lost Type Co-op
    Escafina type specimen site

    View Slide

  91. View Slide

  92. View Slide

  93. View Slide

  94. View Slide

  95. tofino.losttype.com
    Design
    Development
    Type design
    Distributor
    Alanna Munro,
    Kenneth Ormandy
    Kenneth Ormandy
    Alanna Munro
    The Lost Type Co-op
    Tofino type specimen site

    View Slide

  96. View Slide

  97. View Slide

  98. View Slide

  99. View Slide

  100. View Slide

  101. regina-black.losttype.com
    Design
    Development
    Type design
    Distributor
    Charles&Thorn,
    Kenneth Ormandy
    Kenneth Ormandy
    Charles&Thorn
    The Lost Type Co-op
    Regina Black site

    View Slide

  102. View Slide

  103. View Slide

  104. View Slide

  105. sadmag.ca/secrets
    Art direction
    Emoji design
    Design
    Development
    Pamela Rounis
    Kenneth Ormandy
    Pamela Rounis
    Kenneth Ormandy
    SAD Mag #sadsecrets

    View Slide

  106. View Slide

  107. View Slide

  108. View Slide

  109. Your medium

    View Slide

  110. Copy process,
    not results

    View Slide

  111. Have some fun
    with it!

    View Slide

  112. Have some fun
    with it!
    Make

    View Slide

  113. Extracting
    emotion
    45–60 minutes
    Part 3

    View Slide

  114. EMPATHY
    is not a phase

    View Slide

  115. MAKE IT
    SING

    View Slide

  116. What were the challenges?
    What were the rewards?
    How do you think your audience would feel?
    How can this work for other projects?
    How did it go?

    View Slide

  117. Take a
    BRE AK
    15 minutes

    View Slide

  118. Making content &
    design love
    Part 4
    60–80 minutes

    View Slide

  119. Let’s re-humanize

    View Slide

  120. What were the challenges?
    What were the rewards?
    How do you think your audience would feel?
    How can this work for other projects?
    How did it go?

    View Slide

  121. Show & tell

    View Slide

  122. We have
    the tools

    View Slide

  123. Build systems that
    anticipate variation.

    View Slide

  124. Systems that augment humanity.
    Not replace it.

    View Slide

  125. Prototype with
    content
    Good content that says
    something, but doesn’t
    need to be final.

    View Slide

  126. livewires.io

    View Slide

  127. View Slide

  128. craftcms.com

    View Slide

  129. View Slide

  130. View Slide

  131. View Slide

  132. View Slide

  133. View Slide

  134. View Slide

  135. ?

    View Slide

  136. louderthanten.com
    @louderthanten
    Rachel Gertz

    @TheStrayMuse
    Travis Gertz
    @TravisGertz
    Resources
    lt10.co/words-and-pixels

    View Slide

  137. AFTER
    PARTY!
    Revel Room
    Across the street
    Upstairs

    View Slide