Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
FIVE ELEMENTS
OF SUPERIOR
DEVELOPER PORTALSDEVELOPER PORTALS
@hadi_michael
#apidaysNZ
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
Are you failing to grow your
ecosystem, because of a
poor develo...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
MEI SYSTEM FOR UNPACKING TECHNICAL DECISIONS
Accessibility
• Des...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
Your API is an interface to
your data and services for
client de...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
FRONT-END DEVELOPER
Computer science graduate | 3 years experien...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
Product = API
Customers = DEVELOPERS
Store = DEVELOPER PORTAL
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS (Jim Sterne & Matt Cutler, 2000)
DIGITAL CUSTOMER LIFECYCLE
REAC...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
Jen will experience your portal,
whether you explicitly design f...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
Which elements should we design for
in our Developer Portal, to ...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
GATHERING INSIGHT
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
Portals that create superior
developer experiences, have
five ele...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
A list of apps that showcase how your API
could be used.
Key ele...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://developer.bestbuy.com/gallery
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://developer.spotify.com/showcase/
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://www.braintreepayments.com
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
A space where developers can experiment
and play with the API.
K...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://developers.facebook.com/tools/explorer/
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://us11.api.mailchimp.com/playground/
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://developer.vimeo.com/api/playground
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
A way for developers to get up and running with
a useful applica...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://parse.com/apps/quickstart
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
A “plain english” description of the API’s
features, functionali...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://www.flickr.com/services/developer/api/
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://developer.github.com/v3/
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://developers.soundcloud.com/docs
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://rackt.github.io/redux/
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://go.developer.ebay.com/
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
A well thought-out developer experience,
complemented by appeali...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://www.etsy.com/developers/documentation
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://www.dropbox.com/developers
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://developers.google.com/maps/
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://dev.twitter.com/
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
https://developer.uber.com/
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
Community
Forums
Blogs
IRC / Slack
Wiki
StackOverflow
THERE ARE M...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
YOUR DEVELOPER PORTAL IS WHERE YOU
SELL YOUR APIs TO CLIENT DEVE...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
Are you failing to grow your
ecosystem, because of a
poor develo...
@hadi_michael
FIVE ELEMENTS OF SUPERIOR
DEVELOPER PORTALS
You can (and should) influence developer
decision making.
Develop...
THANK YOU
@hadi_michael
https://hadi.io/apidays
For more information and these slides, please visit:
Upcoming SlideShare
Loading in …5
×

Five Elements of Superior Developer Portals (updated)

545 views

Published on

[With new examples for #apidaysNZ]
Are you failing to attract client developers and grow your ecosystem? Do you understand the human influence a developer portal can have? Our industry dedicates so much attention to building stellar user portals for clients, however regularly fails to deliver the same experiences on developer and API portals. We have the power to do better. As API designers and developers, we have the opportunity to influence developer experiences and decision making. In this talk, Hadi will explore the elements commonly found on developer portals, and identify those that consistently contribute to superior developer experiences.

Published in: Internet
  • Be the first to comment

Five Elements of Superior Developer Portals (updated)

  1. 1. FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALSDEVELOPER PORTALS @hadi_michael #apidaysNZ
  2. 2. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS Are you failing to grow your ecosystem, because of a poor developer portal?
  3. 3. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS MEI SYSTEM FOR UNPACKING TECHNICAL DECISIONS Accessibility • Design patterns • Code style • Unit tests Popularity • Stack Overflow posts • HackerNews arguments • Tutorials / Blog posts INTERFACE • Readme / Documentation • Developer tools • Feature list } Activity • Commits / issues • Release frequency • Maintainers INFLUENCED BY DEVELOPER PORTALS
  4. 4. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS Your API is an interface to your data and services for client developers.
  5. 5. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS FRONT-END DEVELOPER Computer science graduate | 3 years experience Advocate for ES2015 and modern web standards | Loves chocolate Is not interested... CORPORATE POLITICS VERSIONING MANAGING LOAD Legacy systems SQL queries Server costs Is interested... LEARNING CURVE DOCUMENTATION LATENCY Debugging Throttling SDKs JEN LI
  6. 6. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS Product = API Customers = DEVELOPERS Store = DEVELOPER PORTAL
  7. 7. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS (Jim Sterne & Matt Cutler, 2000) DIGITAL CUSTOMER LIFECYCLE REACH ABANDONMENT REACTIVATION ATTRITION CHURN LOYALTY ACQUISITION CONVERSION RETENTION
  8. 8. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS Jen will experience your portal, whether you explicitly design for that experience or not!
  9. 9. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS Which elements should we design for in our Developer Portal, to offer Jen a superior developer experience and improve Customer Lifecycle Value?
  10. 10. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS GATHERING INSIGHT
  11. 11. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS Portals that create superior developer experiences, have five elements in common…
  12. 12. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS A list of apps that showcase how your API could be used. Key elements - Featured apps - List of existing customers - Case studies - Testimonials and success stories 1. APP GALLERY
  13. 13. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://developer.bestbuy.com/gallery
  14. 14. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://developer.spotify.com/showcase/
  15. 15. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://www.braintreepayments.com
  16. 16. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS A space where developers can experiment and play with the API. Key elements - API Explorer - Trial Console - Mock API endpoints - Working sample code on CodePen | Plunker | JSBin 2. PLAYGROUND
  17. 17. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://developers.facebook.com/tools/explorer/
  18. 18. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://us11.api.mailchimp.com/playground/
  19. 19. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://developer.vimeo.com/api/playground
  20. 20. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS A way for developers to get up and running with a useful application of your API. Key elements - Quick custom build - Pre-configured SDK - Interactive tutorials - Easy access to developer tools 3. QUICK START
  21. 21. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://parse.com/apps/quickstart
  22. 22. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS A “plain english” description of the API’s features, functionality and implementation. Key elements - API Overview and declaration - Best practices and ‘gotchas’ - Inline example code (that can be edited) - Tutorials | Screencasts | Video Presentations 4. DOCUMENTATION
  23. 23. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://www.flickr.com/services/developer/api/
  24. 24. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://developer.github.com/v3/
  25. 25. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://developers.soundcloud.com/docs
  26. 26. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://rackt.github.io/redux/
  27. 27. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://go.developer.ebay.com/
  28. 28. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS A well thought-out developer experience, complemented by appealing creative design. Key elements - Information architecture - Subtle and helpful interaction design - Attractive visual design - Using design to highlight key features 5. KILLER UX AND VISUAL DESIGN
  29. 29. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://www.etsy.com/developers/documentation
  30. 30. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://www.dropbox.com/developers
  31. 31. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://developers.google.com/maps/
  32. 32. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://dev.twitter.com/
  33. 33. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS https://developer.uber.com/
  34. 34. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS Community Forums Blogs IRC / Slack Wiki StackOverflow THERE ARE MANY OTHER ELEMENTS TO CONSIDER API Status Uptime Response times Current status Twitter account Pricing Subscription information Cost calculators Price tables Management Key provisioning Analytics Permissions Company info About us Product list Vision / roadmap
  35. 35. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS YOUR DEVELOPER PORTAL IS WHERE YOU SELL YOUR APIs TO CLIENT DEVELOPERS KILLER UX AND VISUAL DESIGN ACQUISITION CONVERSION RETENTION APP GALLERY PLAYGROUND QUICK START DOCUMENTATION
  36. 36. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS Are you failing to grow your ecosystem, because of a poor developer portal?
  37. 37. @hadi_michael FIVE ELEMENTS OF SUPERIOR DEVELOPER PORTALS You can (and should) influence developer decision making. Developers will experience using your APIs and developer portal, whether you design for it or not. Consider which elements are important to your client developers. KEY TAKEAWAYS
  38. 38. THANK YOU @hadi_michael https://hadi.io/apidays For more information and these slides, please visit:

×