$30 off During Our Annual Pro Sale. View Details »

DevRelCon London 2019 - Developer Experience Workshop

DevRelCon London 2019 - Developer Experience Workshop

Cristiano Betta

December 09, 2019
Tweet

More Decks by Cristiano Betta

Other Decks in Technology

Transcript

  1. Developer Experience
    December 9th, 2̸19
    hoopy.io

    View Slide

  2. Welcome
    hoopy.io

    View Slide

  3. Cristiano Betta
    Associate Consultant @ Hoopy
    Senior Developer Advocate @ Box
    hoopy.io
    Senior Developer Advocate @ Box
    Alyss Noland

    View Slide

  4. betta.io

    View Slide

  5. View Slide

  6. hoopy.io

    View Slide

  7. Agenda
    • Defining Developer Experience
    • Developer Experience Journey
    • Documentation Types
    • Break
    • Developer Life Cycle
    • Friction logs
    • Operations
    hoopy.io

    View Slide

  8. Goals
    • Understand what makes for a great
    Developer Experience
    • Train your eye to spot bad Developer
    Experience
    • Provide you with the vocabulary to
    explain why something is bad DX
    • Inform what automation and
    instrumentation can be created to scale
    a developer experience hoopy.io

    View Slide

  9. Theory
    Exercises: Analysis
    +
    hoopy.io

    View Slide

  10. Ask me anything
    hoopy.io

    View Slide

  11. Oh, hi!
    hoopy.io

    View Slide

  12. Developer Experience
    hoopy.io

    View Slide

  13. What is DX?
    hoopy.io

    View Slide

  14. “Developer experience is an extension of UX that
    focuses on the developer, who can either be the
    intermediary or, as is the case with many APIs, the end
    user. Whether or not you focus on DX design, your
    developers are always experiencing your API, and that
    experience may either be positive or negative.”
    - Jennifer Riggins | @jkriggins
    hoopy.io

    View Slide

  15. A platform

    View Slide

  16. A platform
    A successful
    user

    View Slide

  17. A developer platform
    A successful
    developer

    View Slide

  18. A developer platform
    A successful
    developer
    A fresh new
    developer

    View Slide

  19. A developer platform
    A fresh new
    developer
    Long
    term success
    A successful
    developer

    View Slide

  20. Developer Experience
    1st site
    visit
    Successful
    integration
    Outreach Advocacy

    View Slide

  21. Developer Experience
    1st site
    visit
    Successful
    integration
    Advocacy
    Outreach
    • Hackathons
    • Conferences
    • Talks
    • Blog posts
    • Tutorials
    Developer Outreach

    View Slide

  22. Developer Experience
    1st site
    visit
    Successful
    integration
    Outreach Advocacy

    View Slide

  23. Developer Experience
    1st site
    visit
    Successful
    integration
    Outreach Advocacy
    • Support
    • Feedback
    • Office hours
    • Beta Programmes
    Developer Advocacy

    View Slide

  24. Developer Experience
    1st site
    visit
    Successful
    integration
    Outreach Advocacy

    View Slide

  25. APIs + SDKs
    Docs + Onboarding

    View Slide

  26. APIs + SDKs
    Docs + Onboarding

    View Slide

  27. APIs + SDKs
    Docs + Onboarding
    + External Developers

    View Slide

  28. Usability + External Developers

    View Slide

  29. Usability

    View Slide

  30. “Simple”

    View Slide

  31. Usability

    View Slide

  32. Discoverable
    Forgiving
    Learnable
    Correct
    Predictable
    Usability

    View Slide

  33. Correct
    hoopy.io

    View Slide

  34. View Slide

  35. View Slide

  36. Predictable
    hoopy.io

    View Slide

  37. Cognitive Load
    hoopy.io

    View Slide

  38. Cognitive Overload
    hoopy.io

    View Slide

  39. Cognitive
    Overload

    View Slide

  40. What can I do?
    What will happen?
    Will I break anything?
    Can I change my decision?
    hoopy.io

    View Slide

  41. _
    Your name*
    hoopy.io

    View Slide

  42. Who can see this?
    Your name*
    hoopy.io

    View Slide

  43. Can I change this later?
    Your name*
    hoopy.io

    View Slide

  44. What can I do?
    What will happen?
    Will I break anything?
    Can I change my decision?
    hoopy.io

    View Slide

  45. Discoverable
    hoopy.io

    View Slide

  46. Where am I?
    What can I do?
    Where can I go?
    Where did I come from?
    hoopy.io

    View Slide

  47. View Slide

  48. hoopy.io

    View Slide

  49. “Scent of information”
    hoopy.io

    View Slide

  50. View Slide

  51. View Slide

  52. Forgiving
    hoopy.io

    View Slide

  53. hoopy.io

    View Slide

  54. hoopy.io

    View Slide

  55. hoopy.io

    View Slide

  56. Learnable
    hoopy.io

    View Slide

  57. View Slide

  58. View Slide

  59. Usability
    Discoverable
    Forgiving
    Learnable
    Correct
    Predictable

    View Slide

  60. Usability
    hoopy.io

    View Slide

  61. Exercise
    hoopy.io

    View Slide

  62. View Slide

  63. Are there any usability issues?
    What type of usability problems are they?
    Discoverability, Predictability, Correctness, Learnability
    Or Forgiveness?
    What tricks can you see that make things
    more learnable, discoverable, etc?
    Teams of 2
    Sign up for each other’s products

    View Slide

  64. Usability
    Discoverable
    Forgiving
    Learnable
    Correct
    Predictable
    hoopy.io

    View Slide

  65. Usability
    hoopy.io

    View Slide

  66. Usability + External Developers
    hoopy.io

    View Slide

  67. External Developers
    hoopy.io

    View Slide

  68. External Developers
    hoopy.io

    View Slide

  69. Understanding Developers
    hoopy.io

    View Slide

  70. Understanding Developers

    View Slide

  71. Understanding Developers Documentation Types

    View Slide

  72. Understanding Developers Documentation Types
    Developer Journey

    View Slide

  73. Understanding Developers Documentation Types
    Developer Journey
    Wider Developer Lifecycle

    View Slide

  74. Understanding Developers Documentation Types
    Developer Journey
    Friction Logging
    Wider Developer Lifecycle

    View Slide

  75. Understanding Developers Documentation Types
    Developer Journey
    Friction Logging
    Wider Developer Lifecycle
    Operationalization

    View Slide

  76. hoopy.io
    Understanding Developers

    View Slide

  77. Understanding Developers
    • Enterprise Developers
    • Startup Developers
    • Hackers
    • Junior
    • N00bs
    • Senior

    View Slide

  78. Developer Drivers
    • Market
    • Organisation
    • Technical
    • Developer

    View Slide

  79. Developer Drivers
    • What we’re trying to understand
    • What we’re trying to overcome

    View Slide

  80. Developer Drivers
    • Product Experience
    • Industry Experience
    • Technical Experience
    • Life Experience
    • Motivation

    View Slide

  81. Developer Attributes
    • Experience
    • Motivation

    View Slide

  82. Developer Journey
    Experience
    Motivation

    View Slide

  83. Experience
    Motivation
    Your CTO
    Developer Journey

    View Slide

  84. Experience
    Motivation
    Your CTO
    Starter
    Developer Journey

    View Slide

  85. Experience
    Motivation
    Your CTO
    Convert
    Developer Journey
    Starter

    View Slide

  86. Experience
    Motivation
    Your CTO
    Convert
    Try Now
    Developer Journey
    Starter

    View Slide

  87. Experience
    Motivation
    Your CTO
    Convert
    Try Now
    Impl.
    Developer Journey
    Starter

    View Slide

  88. Experience
    Motivation
    Expert
    Convert
    Try Now
    Impl.
    Developer Journey
    Starter

    View Slide

  89. Experience
    Motivation
    Developer Journey

    View Slide

  90. Understanding Developers

    View Slide

  91. Understanding Developers Documentation Types
    Developer Journey

    View Slide

  92. Documentation Types
    hoopy.io

    View Slide

  93. Exercise
    hoopy.io

    View Slide

  94. What types of documentation can you recognise?
    For what level of experience and motivation
    is that documentation intended?
    How does the documentation
    flow from one type to the other? (Bonus)
    Using the same products you looked at before

    View Slide

  95. Documentation Types
    hoopy.io

    View Slide

  96. Documentation Types
    • Get Started Guides
    • QuickStarts
    • Tutorials
    • Guides
    • Samples
    • Demos
    • Reference
    • Use Cases
    • Examples
    • Libraries & SDKs

    View Slide

  97. Documentation Types
    • Get Started Guides
    • QuickStarts
    • Tutorials
    • Guides
    • Samples
    • Demos
    • Reference
    • Use Cases
    • Examples
    • Libraries & SDKs

    View Slide

  98. Documentation Types
    • Get Started Guides
    • QuickStarts
    • Tutorials
    • Guides
    • Samples
    • Demos
    • Reference
    • Use Cases
    • Examples
    • Libraries & SDKs

    View Slide

  99. Documentation Types
    • Get Started Guides
    • QuickStarts
    • Tutorials
    • Guides
    • Samples
    • Demos
    • Reference
    • Use Cases
    • Examples
    • Libraries & SDKs

    View Slide

  100. Documentation Types
    Experience
    Motivation

    View Slide

  101. Reference
    Experience
    Motivation
    hoopy.io

    View Slide

  102. View Slide

  103. View Slide

  104. Reference
    Experience
    Motivation
    hoopy.io

    View Slide

  105. Reference
    Exploration
    Experience
    Motivation
    hoopy.io

    View Slide

  106. View Slide

  107. View Slide

  108. View Slide

  109. View Slide

  110. Reference
    Exploration
    Experience
    Motivation
    hoopy.io

    View Slide

  111. Getting Started
    Reference
    Exploration
    Experience
    Motivation
    hoopy.io

    View Slide

  112. View Slide

  113. View Slide

  114. View Slide

  115. View Slide

  116. View Slide

  117. Further Guidance
    Getting Started
    Reference
    Exploration
    Experience
    Motivation
    hoopy.io

    View Slide

  118. View Slide

  119. View Slide

  120. Further Guidance
    Getting Started
    Reference
    Exploration
    Experience
    Motivation
    hoopy.io

    View Slide

  121. View Slide

  122. View Slide

  123. View Slide

  124. View Slide

  125. Further Guidance
    Getting Started
    Reference
    Exploration
    Experience
    Motivation
    hoopy.io

    View Slide

  126. Further Guidance
    Getting Started Reference
    Exploration
    Developer Journey

    View Slide

  127. Understanding Developers Documentation Types
    Developer Journey

    View Slide

  128. Break
    hoopy.io

    View Slide

  129. Agenda
    • Defining Developer Experience
    • Developer Experience Journey
    • Documentation Types
    • Break
    • Developer Life Cycle
    • Friction logs
    • Operations
    hoopy.io

    View Slide

  130. Break
    hoopy.io

    View Slide

  131. Agenda
    • Defining Developer Experience
    • Developer Experience Journey
    • Documentation Types
    • Break
    • Developer Life Cycle
    • Friction logs
    • Operations
    hoopy.io

    View Slide

  132. Understanding Developers Documentation Types
    Developer Journey

    View Slide

  133. Understanding Developers Documentation Types
    Developer Journey
    Wider Developer Lifecycle

    View Slide

  134. Wider Developer Lifecycle

    View Slide

  135. Developer Experience
    1st site
    visit
    Successful
    integration
    Outreach Advocacy

    View Slide

  136. Activation Retention
    AAARRRP
    Acquisition Revenue
    Awareness Referral Product

    View Slide

  137. Consideration Loyalty
    Customer Product Lifecycle
    Familiarity Purchase
    Awareness

    View Slide

  138. Consideration Loyalty
    Customer Product Lifecycle
    Familiarity Purchase
    Awareness
    Tutorials, social media,
    traditional marketing…
    White papers, trials,
    testimonials, sample apps,
    webinars, quick starts…
    Beta programmes,
    newsletters, champion
    programmes…
    Developer Experience

    View Slide

  139. Enablement Retention
    Customer Product Lifecycle
    Engagement
    Developer Experience
    Tutorials, social media,
    traditional marketing…
    White papers, trials,
    testimonials, sample apps,
    webinars, quick starts…
    Beta programmes,
    newsletters, champion
    programmes…

    View Slide

  140. Engagement
    Tutorials, social media,
    traditional marketing…
    Developer Engagement
    “To create content and perform activities
    intended to raise awareness and familiarity of
    the product amongst the wider developer
    community”
    Mostly External Facing
    Often a marketing activity

    View Slide

  141. Enablement Retention
    Engagement
    Tutorials, social media,
    traditional marketing…
    White papers, trials,
    testimonials, sample apps,
    webinars, quick starts…
    Beta programmes,
    newsletters, champion
    programmes…

    View Slide

  142. Enablement
    White papers, trials,
    testimonials, sample apps,
    webinars, quick starts…
    Developer Enablement
    “To create content and perform activities
    intended to enable internal and external
    developers to use your product, as well as
    enable go-to-market facing colleagues to enable
    others to use the product.”
    Both internal and external facing
    Generally an educational activity

    View Slide

  143. Enablement Retention
    Engagement
    Tutorials, social media,
    traditional marketing…
    White papers, trials,
    testimonials, sample apps,
    webinars, quick starts…
    Beta programmes,
    newsletters, champion
    programmes…

    View Slide

  144. Retention
    Beta programmes,
    newsletters, champion
    programmes…
    Developer Retention
    “To create content and perform activities
    intended to ensure developers and customers
    understand the continued value of the product
    and are early adopters new value add-ons”
    Both internal and external facing
    Combination of marketing
    and educational activities

    View Slide

  145. Enablement Retention
    Engagement
    Tutorials, social media,
    traditional marketing…
    White papers, trials,
    testimonials, sample apps,
    webinars, quick starts…
    Beta programmes,
    newsletters, champion
    programmes…

    View Slide

  146. Exercise
    hoopy.io

    View Slide

  147. What kind of activities or content does your company
    deliver for each of these?
    Where are the gaps? Is there an in-balance
    of focus?
    What would be a good next programme to fill these gaps?
    On paper or on spreadsheet, create three columns:
    Engagement, Enablement, and Retention

    View Slide

  148. Understanding Developers Documentation Types
    Developer Journey
    Wider Developer Lifecycle

    View Slide

  149. Understanding Developers Documentation Types
    Developer Journey
    Friction Logging
    Wider Developer Lifecycle

    View Slide

  150. Friction Logging
    hoopy.io

    View Slide

  151. 1st site
    visit
    Successful
    integration
    Engagement Retention

    View Slide

  152. go.betta.io/dxgithub

    View Slide

  153. Cristiano Betta - 9/12/2019
    Upload a file to ImgApp
    * Go to developer.imgapp.com
    This took me to the Get Started Guide but

    then wasn’t clear on next steps

    * Made the sample API call but received a 400
    I copied the command literally from the tutorial

    and I got a 400 response with zero guidance on
    what I did wrong. No idea how to proceed.
    * Click on “Get Started”

    The animated gif on the front-page showed me
    exactly what I can do with the API within 5 seconds.
    Discoverable
    Unpredictable
    Unforgiving
    Exploration
    Getting Started
    Reference

    View Slide

  154. Reference I copied the command literally from the tutorial

    and I got a 400 response with zero guidance on
    what I did wrong. No idea how to proceed.
    I wanted to share a link to a specific point in
    the docs and was unable to get a link as it’s an
    infinitely scrolling page without clear anchors
    Unforgiving
    Inaccessible
    Get Started Nullam id dolor id nibh ultricies vehicula ut id
    elit. Morbi leo risus, porta ac consectetur ac,
    vestibulum at eros.
    Nullam id dolor id nibh ultricies vehicula ut id
    elit. Morbi leo risus, porta ac consectetur ac,
    vestibulum at eros.
    Nullam id dolor id nibh ultricies vehicula ut id
    elit. Morbi leo risus, porta ac consectetur ac,
    vestibulum at eros.
    Discoverable
    Forgiving
    Unpredictable

    View Slide

  155. 5/80 rule
    hoopy.io

    View Slide

  156. 5 friction logs
    ===
    80% of major issues
    hoopy.io

    View Slide

  157. Quantifiable product feedback
    hoopy.io

    View Slide

  158. Product manager empathy
    hoopy.io

    View Slide

  159. Exercise
    hoopy.io

    View Slide

  160. 1. Create a friction log for this use case
    2. Document on paper or in an online doc
    3. Log the moments of delight, frustration, and anger
    “Send an Tweet with Nexmo”
    developer.nexmo.com
    Alternative for non-developers
    “Send a tweet with a new Twitter account”
    twitter.com

    View Slide

  161. Understanding Developers Documentation Types
    Developer Journey
    Friction Logging
    Wider Developer Lifecycle

    View Slide

  162. Understanding Developers Documentation Types
    Developer Journey
    Friction Logging
    Wider Developer Lifecycle
    Operationalization

    View Slide

  163. hoopy.io
    Operationalization

    View Slide

  164. hoopy.io
    The problem with DX

    View Slide

  165. hoopy.io
    The problem with DX
    Create an easy on boarding flow
    Write amazing guides and tutorials
    Maintain the API spec
    Create sample code for every API
    Create useful SDKs
    Create white papers
    Speak at conferences
    Keep in contact with existing customers
    Maintain a changeling
    Maintain social media
    Launch an ambassador programme
    Engage developers on the forum
    Work with partners on integrations

    View Slide

  166. hoopy.io
    It’s a lot of work that doesn’t scale

    View Slide

  167. hoopy.io
    No they won’t let you hire 30 people
    Unless you are Nexmo

    View Slide

  168. hoopy.io
    SCOOP - framework

    View Slide

  169. hoopy.io
    SCOOP
    CONTENT

    OUTREACH
    OPERATIONS
    PROGAMMES
    speakerdeck.com/johndbritton/marketing-to-developers

    View Slide

  170. hoopy.io
    OPERATIONS
    speakerdeck.com/johndbritton/marketing-to-developers
    “Make checklists,
    automate, refactor”
    - John Britton, DevRelCon 2017

    View Slide

  171. hoopy.io
    Automation

    View Slide

  172. hoopy.io
    Automation Instrumentation

    View Slide

  173. hoopy.io
    Automation
    1. Anything that can be turned into a
    checklist should.
    2. Checklists can be turned into an
    automated process.

    View Slide

  174. hoopy.io
    Automation
    Documentation
    • Spellchecking
    • Translation
    • External and internal link validation
    • Cross-linking of related content
    • Create reports to provide other teams with
    insights into documentation coverage of APIs
    • Content Matrix

    View Slide

  175. Exploration
    Get Started
    Guides
    Reference
    Content Matrix Example
    Install
    Initialize
    Create Keys
    Create Cards
    Register Cards
    Find Cards
    Encrypt
    Decrypt
    Sign
    Verify
    ✅ ✅ ✅ ✅ ✅
    ✅ ✅ ✅ ✅ ✅
    ✅ ✅
    ✅ ✅
    ✅ ✅
    ✅ ✅


    ✅ ✅ ✅ ✅








    Store Keys

    View Slide

  176. hoopy.io
    Automation
    API Specification
    • Automated spellchecks
    • Contract testing
    • Response sample generation

    View Slide

  177. SDKs
    • Autogeneration from API spec
    • Feature parity checking
    • Request sample generation
    • Standardization
    hoopy.io
    Automation

    View Slide

  178. hoopy.io
    Automation Pipeline
    Product
    API Spec Documentation Change
    SDKs Change
    CLI Change
    Onboarding
    Changelog
    Newsletter
    Contract Validation

    View Slide

  179. hoopy.io
    Automation Instrumentation

    View Slide

  180. hoopy.io
    Instrumentation
    1. Measure key moments in the developer
    journey as well as the wider developer
    lifecycle
    2. Set up automated process to track
    improvements and actively warn of
    deterioration of key indicators

    View Slide

  181. hoopy.io
    Measure deviation
    Sign up
    100%
    Create app
    80%
    API call
    60%

    View Slide

  182. hoopy.io
    Sign up
    100%
    Create app
    80%
    API call
    40%
    Measure deviation
    [email protected]

    View Slide

  183. Create app
    100%
    Make API Call A After 2 weeks
    10% active
    Discover Retention
    20% active
    Make API Call B
    50% active
    Make API Call A+B
    Prioritize!

    View Slide

  184. Exercise
    hoopy.io

    View Slide

  185. Determine 3 key events in your developer lifecycle
    Pick an early moment of engagement,
    a moment of enablement,
    and a later moment of retention.
    Which indicator could be best used
    to drive further growth?
    Which indicator could be best used
    as an indicator of potential deterioration?

    View Slide

  186. Recap
    hoopy.io

    View Slide

  187. DX is where
    your product and
    external developers collide
    hoopy.io

    View Slide

  188. External developers
    can be characterised
    by experience and motivation
    hoopy.io

    View Slide

  189. Most of the developer
    journey happens
    in four phases
    hoopy.io

    View Slide

  190. Exploration
    Getting Started
    Further Guidance
    Reference
    hoopy.io

    View Slide

  191. The wider developer
    lifecycle can be described in terms
    of engagement, enablement, and
    retention
    hoopy.io

    View Slide

  192. Friction logs created by new
    users can be a cheap yet effective
    way to gather product feedback
    hoopy.io

    View Slide

  193. DX is a product that can be
    scaled through automation and
    instrumentation
    hoopy.io

    View Slide

  194. Automation ensures your DX
    scales with your product
    hoopy.io

    View Slide

  195. Instrumentation protects the
    value of a DX by active
    monitoring key events
    hoopy.io

    View Slide

  196. Understanding Developers Documentation Types
    Developer Journey
    Friction Logging
    Wider Developer Lifecycle
    Operationalization

    View Slide

  197. Questions
    hoopy.io

    View Slide

  198. FAQ
    hoopy.io

    View Slide

  199. Which company does
    this the best?
    hoopy.io

    View Slide

  200. Experience
    Motivation
    hoopy.io

    View Slide

  201. Stripe
    Experience
    Motivation
    hoopy.io

    View Slide

  202. View Slide

  203. Stripe
    Twilio
    Experience
    Motivation
    hoopy.io

    View Slide

  204. View Slide

  205. Pusher
    Stripe
    Twilio
    Experience
    Motivation
    hoopy.io

    View Slide

  206. View Slide

  207. Twilio???
    Pusher
    Stripe
    Twilio
    Experience
    Motivation
    hoopy.io

    View Slide

  208. View Slide

  209. How do I measure ROI?
    hoopy.io

    View Slide

  210. Measure Change
    hoopy.io

    View Slide

  211. hoopy.io

    View Slide

  212. Measure Success
    hoopy.io

    View Slide

  213. Marketing Metrics
    != DX Metrics
    hoopy.io

    View Slide

  214. Measure Support
    Load
    hoopy.io

    View Slide

  215. Should I own my SDKs?
    hoopy.io

    View Slide

  216. How can you determine the DX
    of something you don’t own?
    hoopy.io

    View Slide

  217. View Slide

  218. “…in reality, whatever people can
    pull down from their favorite
    package manager is their
    developer experience…”
    - Square’s Tristan Sokol @ DevXCon SF 2̸17
    About SDKs
    hoopy.io

    View Slide

  219. Tooling?
    hoopy.io

    View Slide

  220. Questions
    hoopy.io

    View Slide

  221. Thank you
    hoopy.io
    [email protected]
    [email protected]
    [email protected]
    Alyss Noland
    Cristiano Betta

    View Slide