DevRelCon London 2019 - Developer Experience Workshop

Slide 1

Slide 1 text

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

Slide 2

Slide 2 text

Welcome hoopy.io

Slide 3

Slide 3 text

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

Slide 4

Slide 4 text

betta.io

Slide 5

Slide 5 text

@cbetta cristiano@hoopy.io hoopy.io cbetta@box.com @PreciselyAlyss anoland@box.com

Slide 6

Slide 6 text

hoopy.io

Slide 7

Slide 7 text

Agenda • Deﬁning Developer Experience • Developer Experience Journey • Documentation Types • Break • Developer Life Cycle • Friction logs • Operations hoopy.io

Slide 8

Slide 8 text

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

Slide 9

Slide 9 text

Theory Exercises: Analysis + hoopy.io

Slide 10

Slide 10 text

Ask me anything hoopy.io

Slide 11

Slide 11 text

Oh, hi! hoopy.io

Slide 12

Slide 12 text

Developer Experience hoopy.io

Slide 13

Slide 13 text

What is DX? hoopy.io

Slide 14

Slide 14 text

“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

Slide 15

Slide 15 text

A platform

Slide 16

Slide 16 text

A platform A successful user

Slide 17

Slide 17 text

A developer platform A successful developer

Slide 18

Slide 18 text

A developer platform A successful developer A fresh new developer

Slide 19

Slide 19 text

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

Slide 20

Slide 20 text

Developer Experience 1st site visit Successful integration Outreach Advocacy

Slide 21

Slide 21 text

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

Slide 22

Slide 22 text

Developer Experience 1st site visit Successful integration Outreach Advocacy

Slide 23

Slide 23 text

Developer Experience 1st site visit Successful integration Outreach Advocacy • Support • Feedback • Ofﬁce hours • Beta Programmes Developer Advocacy

Slide 24

Slide 24 text

Developer Experience 1st site visit Successful integration Outreach Advocacy

Slide 25

Slide 25 text

APIs + SDKs Docs + Onboarding

Slide 26

Slide 26 text

APIs + SDKs Docs + Onboarding

Slide 27

Slide 27 text

APIs + SDKs Docs + Onboarding + External Developers

Slide 28

Slide 28 text

Usability + External Developers

Slide 29

Slide 29 text

Usability

Slide 30

Slide 30 text

“Simple”

Slide 31

Slide 31 text

Usability

Slide 32

Slide 32 text

Discoverable Forgiving Learnable Correct Predictable Usability

Slide 33

Slide 33 text

Correct hoopy.io

Slide 34

Slide 34 text

No content

Slide 35

Slide 35 text

No content

Slide 36

Slide 36 text

Predictable hoopy.io

Slide 37

Slide 37 text

Cognitive Load hoopy.io

Slide 38

Slide 38 text

Cognitive Overload hoopy.io

Slide 39

Slide 39 text

Cognitive Overload

Slide 40

Slide 40 text

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

Slide 41

Slide 41 text

_ Your name* hoopy.io

Slide 42

Slide 42 text

Who can see this? Your name* hoopy.io

Slide 43

Slide 43 text

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

Slide 44

Slide 44 text

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

Slide 45

Slide 45 text

Discoverable hoopy.io

Slide 46

Slide 46 text

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

Slide 47

Slide 47 text

No content

Slide 48

Slide 48 text

hoopy.io

Slide 49

Slide 49 text

“Scent of information” hoopy.io

Slide 50

Slide 50 text

No content

Slide 51

Slide 51 text

No content

Slide 52

Slide 52 text

Forgiving hoopy.io

Slide 53

Slide 53 text

hoopy.io

Slide 54

Slide 54 text

hoopy.io

Slide 55

Slide 55 text

hoopy.io

Slide 56

Slide 56 text

Learnable hoopy.io

Slide 57

Slide 57 text

No content

Slide 58

Slide 58 text

No content

Slide 59

Slide 59 text

Usability Discoverable Forgiving Learnable Correct Predictable

Slide 60

Slide 60 text

Usability hoopy.io

Slide 61

Slide 61 text

Exercise hoopy.io

Slide 62

Slide 62 text

No content

Slide 63

Slide 63 text

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

Slide 64

Slide 64 text

Usability Discoverable Forgiving Learnable Correct Predictable hoopy.io

Slide 65

Slide 65 text

Usability hoopy.io

Slide 66

Slide 66 text

Usability + External Developers hoopy.io

Slide 67

Slide 67 text

External Developers hoopy.io

Slide 68

Slide 68 text

External Developers hoopy.io

Slide 69

Slide 69 text

Understanding Developers hoopy.io

Slide 70

Slide 70 text

Understanding Developers

Slide 71

Slide 71 text

Understanding Developers Documentation Types

Slide 72

Slide 72 text

Understanding Developers Documentation Types Developer Journey

Slide 73

Slide 73 text

Understanding Developers Documentation Types Developer Journey Wider Developer Lifecycle

Slide 74

Slide 74 text

Understanding Developers Documentation Types Developer Journey Friction Logging Wider Developer Lifecycle

Slide 75

Slide 75 text

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

Slide 76

Slide 76 text

hoopy.io Understanding Developers

Slide 77

Slide 77 text

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

Slide 78

Slide 78 text

Developer Drivers • Market • Organisation • Technical • Developer

Slide 79

Slide 79 text

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

Slide 80

Slide 80 text

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

Slide 81

Slide 81 text

Developer Attributes • Experience • Motivation

Slide 82

Slide 82 text

Developer Journey Experience Motivation

Slide 83

Slide 83 text

Experience Motivation Your CTO Developer Journey

Slide 84

Slide 84 text

Experience Motivation Your CTO Starter Developer Journey

Slide 85

Slide 85 text

Experience Motivation Your CTO Convert Developer Journey Starter

Slide 86

Slide 86 text

Experience Motivation Your CTO Convert Try Now Developer Journey Starter

Slide 87

Slide 87 text

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

Slide 88

Slide 88 text

Experience Motivation Expert Convert Try Now Impl. Developer Journey Starter

Slide 89

Slide 89 text

Experience Motivation Developer Journey

Slide 90

Slide 90 text

Understanding Developers

Slide 91

Slide 91 text

Understanding Developers Documentation Types Developer Journey

Slide 92

Slide 92 text

Documentation Types hoopy.io

Slide 93

Slide 93 text

Exercise hoopy.io

Slide 94

Slide 94 text

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

Slide 95

Slide 95 text

Documentation Types hoopy.io

Slide 96

Slide 96 text

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

Slide 97

Slide 97 text

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

Slide 98

Slide 98 text

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

Slide 99

Slide 99 text

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

Slide 100

Slide 100 text

Documentation Types Experience Motivation

Slide 101

Slide 101 text

Reference Experience Motivation hoopy.io

Slide 102

Slide 102 text

No content

Slide 103

Slide 103 text

No content

Slide 104

Slide 104 text

Reference Experience Motivation hoopy.io

Slide 105

Slide 105 text

Reference Exploration Experience Motivation hoopy.io

Slide 106

Slide 106 text

No content

Slide 107

Slide 107 text

No content

Slide 108

Slide 108 text

No content

Slide 109

Slide 109 text

No content

Slide 110

Slide 110 text

Reference Exploration Experience Motivation hoopy.io

Slide 111

Slide 111 text

Getting Started Reference Exploration Experience Motivation hoopy.io

Slide 112

Slide 112 text

No content

Slide 113

Slide 113 text

No content

Slide 114

Slide 114 text

No content

Slide 115

Slide 115 text

No content

Slide 116

Slide 116 text

No content

Slide 117

Slide 117 text

Further Guidance Getting Started Reference Exploration Experience Motivation hoopy.io

Slide 118

Slide 118 text

No content

Slide 119

Slide 119 text

No content

Slide 120

Slide 120 text

Further Guidance Getting Started Reference Exploration Experience Motivation hoopy.io

Slide 121

Slide 121 text

No content

Slide 122

Slide 122 text

No content

Slide 123

Slide 123 text

No content

Slide 124

Slide 124 text

No content

Slide 125

Slide 125 text

Further Guidance Getting Started Reference Exploration Experience Motivation hoopy.io

Slide 126

Slide 126 text

Further Guidance Getting Started Reference Exploration Developer Journey

Slide 127

Slide 127 text

Understanding Developers Documentation Types Developer Journey

Slide 128

Slide 128 text

Break hoopy.io

Slide 129

Slide 129 text

Agenda • Deﬁning Developer Experience • Developer Experience Journey • Documentation Types • Break • Developer Life Cycle • Friction logs • Operations hoopy.io

Slide 130

Slide 130 text

Break hoopy.io

Slide 131

Slide 131 text

Agenda • Deﬁning Developer Experience • Developer Experience Journey • Documentation Types • Break • Developer Life Cycle • Friction logs • Operations hoopy.io

Slide 132

Slide 132 text

Understanding Developers Documentation Types Developer Journey

Slide 133

Slide 133 text

Understanding Developers Documentation Types Developer Journey Wider Developer Lifecycle

Slide 134

Slide 134 text

Wider Developer Lifecycle

Slide 135

Slide 135 text

Developer Experience 1st site visit Successful integration Outreach Advocacy

Slide 136

Slide 136 text

Activation Retention AAARRRP Acquisition Revenue Awareness Referral Product

Slide 137

Slide 137 text

Consideration Loyalty Customer Product Lifecycle Familiarity Purchase Awareness

Slide 138

Slide 138 text

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

Slide 139

Slide 139 text

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…

Slide 140

Slide 140 text

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

Slide 141

Slide 141 text

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

Slide 142

Slide 142 text

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

Slide 143

Slide 143 text

Slide 144

Slide 144 text

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

Slide 145

Slide 145 text

Slide 146

Slide 146 text

Exercise hoopy.io

Slide 147

Slide 147 text

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 ﬁll these gaps? On paper or on spreadsheet, create three columns: Engagement, Enablement, and Retention

Slide 148

Slide 148 text

Understanding Developers Documentation Types Developer Journey Wider Developer Lifecycle

Slide 149

Slide 149 text

Understanding Developers Documentation Types Developer Journey Friction Logging Wider Developer Lifecycle

Slide 150

Slide 150 text

Friction Logging hoopy.io

Slide 151

Slide 151 text

1st site visit Successful integration Engagement Retention

Slide 152

Slide 152 text

go.betta.io/dxgithub

Slide 153

Slide 153 text

Cristiano Betta - 9/12/2019 Upload a ﬁle 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

Slide 154

Slide 154 text

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 speciﬁc point in the docs and was unable to get a link as it’s an inﬁnitely 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

Slide 155

Slide 155 text

5/80 rule hoopy.io

Slide 156

Slide 156 text

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

Slide 157

Slide 157 text

Quantiﬁable product feedback hoopy.io

Slide 158

Slide 158 text

Product manager empathy hoopy.io

Slide 159

Slide 159 text

Exercise hoopy.io

Slide 160

Slide 160 text

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

Slide 161

Slide 161 text

Understanding Developers Documentation Types Developer Journey Friction Logging Wider Developer Lifecycle

Slide 162

Slide 162 text

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

Slide 163

Slide 163 text

hoopy.io Operationalization

Slide 164

Slide 164 text

hoopy.io The problem with DX

Slide 165

Slide 165 text

hoopy.io The problem with DX Create an easy on boarding ﬂow 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

Slide 166

Slide 166 text

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

Slide 167

Slide 167 text

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

Slide 168

Slide 168 text

hoopy.io SCOOP - framework

Slide 169

Slide 169 text

hoopy.io SCOOP CONTENT  OUTREACH OPERATIONS PROGAMMES speakerdeck.com/johndbritton/marketing-to-developers

Slide 170

Slide 170 text

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

Slide 171

Slide 171 text

hoopy.io Automation

Slide 172

Slide 172 text

hoopy.io Automation Instrumentation

Slide 173

Slide 173 text

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

Slide 174

Slide 174 text

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

Slide 175

Slide 175 text

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

Slide 176

Slide 176 text

hoopy.io Automation API Speciﬁcation • Automated spellchecks • Contract testing • Response sample generation

Slide 177

Slide 177 text

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

Slide 178

Slide 178 text

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

Slide 179

Slide 179 text

hoopy.io Automation Instrumentation

Slide 180

Slide 180 text

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

Slide 181

Slide 181 text

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

Slide 182

Slide 182 text

hoopy.io Sign up 100% Create app 80% API call 40% Measure deviation panic@example.com

Slide 183

Slide 183 text

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!

Slide 184

Slide 184 text

Exercise hoopy.io

Slide 185

Slide 185 text

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?

Slide 186

Slide 186 text

Recap hoopy.io

Slide 187

Slide 187 text

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

Slide 188

Slide 188 text

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

Slide 189

Slide 189 text

Moﬆ of the developer journey happens in four phases hoopy.io

Slide 190

Slide 190 text

Exploration Getting Started Further Guidance Reference hoopy.io

Slide 191

Slide 191 text

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

Slide 192

Slide 192 text

Friction logs created by new users can be a cheap yet eﬀective way to gather product feedback hoopy.io

Slide 193

Slide 193 text

DX is a product that can be scaled through automation and inﬆrumentation hoopy.io

Slide 194

Slide 194 text

Automation ensures your DX scales with your product hoopy.io

Slide 195

Slide 195 text

Inﬆrumentation protects the value of a DX by active monitoring key events hoopy.io

Slide 196

Slide 196 text

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

Slide 197

Slide 197 text

Queﬆions hoopy.io

Slide 198

Slide 198 text

FAQ hoopy.io

Slide 199

Slide 199 text

Which company does this the beﬆ? hoopy.io

Slide 200

Slide 200 text

Experience Motivation hoopy.io

Slide 201

Slide 201 text

Stripe Experience Motivation hoopy.io

Slide 202

Slide 202 text

No content

Slide 203

Slide 203 text

Stripe Twilio Experience Motivation hoopy.io

Slide 204

Slide 204 text

No content

Slide 205

Slide 205 text

Pusher Stripe Twilio Experience Motivation hoopy.io

Slide 206

Slide 206 text

No content

Slide 207

Slide 207 text

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

Slide 208

Slide 208 text

No content

Slide 209

Slide 209 text

How do I measure ROI? hoopy.io

Slide 210

Slide 210 text

Measure Change hoopy.io

Slide 211

Slide 211 text

hoopy.io

Slide 212

Slide 212 text

Measure Success hoopy.io

Slide 213

Slide 213 text

Marketing Metrics != DX Metrics hoopy.io

Slide 214

Slide 214 text

Measure Support Load hoopy.io

Slide 215

Slide 215 text

Should I own my SDKs? hoopy.io

Slide 216

Slide 216 text

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

Slide 217

Slide 217 text

No content

Slide 218

Slide 218 text

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

Slide 219

Slide 219 text

Tooling? hoopy.io

Slide 220

Slide 220 text

Queﬆions hoopy.io

Slide 221

Slide 221 text

Thank you hoopy.io cbetta@box.com cristiano@hoopy.io anoland@box.com Alyss Noland Cristiano Betta