Web site Developer I Advertising I Social Media Advertising I Content material Creators I Branding Creators I Administration I System SolutionDeveloping An Award-Profitable Onboarding Course of (Case Examine) — Smashing Journal

Web site Developer I Advertising I Social Media Advertising I Content material Creators I Branding Creators I Administration I System SolutionDeveloping An Award-Profitable Onboarding Course of (Case Examine) — Smashing Journal

Web site Developer I Advertising I Social Media Advertising I Content material Creators I Branding Creators I Administration I System Answer

Fast abstract ↬
This text is a case research of how the platformOS staff has researched, developed, and iteratively adjusted their onboarding processes over greater than three years to finally create the a number of award successful developer expertise they supply immediately.

The notion of onboarding is all about serving to customers rapidly and simply discover worth in your providing. Velocity and ease of use are equally vital as a result of customers may lose curiosity if going by way of an onboarding takes extra time or is extra sophisticated than what they anticipated. Velocity and ease of use are additionally relative to an individual’s standpoint: a salesman can have vastly completely different expectations for an onboarding than a developer.

A well-constructed onboarding course of boosts engagement, improves product adoption, will increase conversion charges, and educates customers a few product. Optimizing the onboarding expertise is a journey. You must have a plan however be agile, using processes and instruments to garner suggestions from goal customers in a bid to continually enhance.

On this article, we are going to stroll you thru how we developed the onboarding processes for platformOS from the very starting. It is possible for you to to observe how we carried out consumer expertise analysis, how our onboarding has modified over time, what assumptions we made, and the way we adjusted them. We are going to discuss all of the instruments we used as examples, however the identical processes could be carried out with all kinds of different instruments. You’ll get sensible examples and a whole overview of how we constructed our onboarding, with insights into UX analysis and the specifics of working with completely different viewers segments.

Our viewers has at all times mixed technical folks with varied ranges of programming abilities, and non-technical individuals who come to our docs to guage if platformOS can be a superb match for his or her initiatives like Venture Homeowners, Enterprise Analysts, and Venture Managers. As a result of our important audience is split into completely different segments, additionally, you will get a glimpse of the processes we developed for our documentation, developer schooling, and developer relations.

Problem: Onboarding For Totally different Goal Audiences

platformOS is a model-based utility improvement platform aimed toward front-end builders and web site builders automating infrastructure provisioning and DevOps.

DevOps is a mix of improvement methodologies, practices, and instruments that allow groups to evolve and enhance merchandise at a quicker tempo to higher serve their prospects and compete extra successfully available in the market. Beneath a DevOps mannequin, improvement and operations groups are merged right into a single staff the place the engineers work throughout the complete utility lifecycle, from improvement and check to deployment to operations.

Our important audience is builders, and the inspiration for his or her onboarding, schooling, and help is our developer portal — however our onboarding has to cater to different audience segments as properly.

Defining Our Goal Viewers Segments

We outlined our audience in the course of the discovery part of the Design Pondering course of that we used to plan our developer portal. Since then, now we have often revalidated the outcomes to see if we’re heading in the right direction as a result of we wish to make sure that we perceive the individuals who will likely be utilizing our product, and what motivates them. We additionally know that within the lifecycle of a product this viewers can change on account of product positioning, and the way properly we are able to deal with their wants.

Our audience presently has 4 segments:

  • Skilled builders,
  • Junior builders,
  • Company Proprietor, Gross sales/Advertising,
  • PM, Enterprise Analyst.
Four photos and names of people with detailed descriptions of our proto-personas goals, behavior, and dos and don'ts.
Descriptions of our proto-personas with pattern pictures and names to make them simpler to narrate and check with. (Massive preview)

Person Base Shifts

We created the primary audience map after we began planning our developer portal. Within the discovery part, we mapped out 4 proto-personas that coated the next segments: Skilled Builders, Junior Builders, Web site Builders, and Market Homeowners.

We revalidated these outcomes a 12 months later, and we realized that our viewers had shifted a bit.

  • The Skilled Builders and the Junior Builders stayed as the primary goal audiences. Nonetheless, we collected new data associated to the wants of the junior devs. They wanted extra element to have the ability to perceive and begin working with the product. This new data helped us specify their consumer journey.
  • At this level, the Web site Builders have been the smallest group. We recognized we would have liked to deal with the wants of the builders group first, creating a robust basis to help web site builders within the platform.
  • The non-technical phase shifted on the best way. The Market Homeowners phase was divided into two separate audiences: the Company Homeowners, who’ve a gross sales and advertising and marketing background, and the Enterprise Analysts, who’ve an enterprise background in enterprise administration or transformation — a brand new viewers who began to indicate curiosity in our product.

Alongside the best way, we have been capable of specify the wants of those audiences in additional element. These particulars helped with the prioritization of the onboarding duties and stored our give attention to the wants of the viewers.

Defining Entry Factors For Goal Viewers Segments

Attending to know the wants of the audience segments supplied steering for figuring out the entry factors to the product.

  • The Company Homeowners’ key aim is to work on a number of internet initiatives that they host and handle on the platform. They received’t work on the platform themselves, however they wish to know the standing and the progress of the platform with out worrying about DevOps. They should see the enterprise perspective, the safety, and that they’re a part of a dependable ecosystem with a useful group round with out diving deep into the technical a part of the product.
  • The Enterprise Analysts’ aim is to establish answer suppliers for his or her particular enterprise issues. They should discover a long-term answer that matches with their use case, is scalable, and offers them the chance for simple analysis that exhibits the important thing enterprise values in motion.
  • The Junior Builders’ aim is to study the fundamentals with out a lot trouble, below the steering of skilled group members. They want clear technical communication on arrange a dev setting and troubleshoot frequent errors.
  • The Skilled Builders’ aim is to discover a answer that’s dependable and versatile sufficient for all their challenge wants and on the identical time gives good efficiency. They want to have the ability to consider rapidly if it’s a superb match, then see how their challenge may work on the platform. Additionally they must see that the platform has a future with a stable group behind it.

All segments wanted an actionable onboarding the place they’ll work together with the product (and interact with the group) based mostly on their stage of technical data.

  • Within the non-technical journey, customers can go from the 1-click route that takes them by way of registering on the Accomplice Portal to making a demo web site and putting in the weblog module by clicking by way of a setup wizard.
  • Within the semi-technical journey, customers can create a sandbox through which they’ll experiment by cloning a demo web site from our GitHub repository, they usually even have the choice to undergo our “Hiya, World!” information.
  • Within the technical journey, customers can observe a extra complicated tutorial that walks them by way of the steps of creating an app on platformOS from establishing their improvement setting to deploying and testing their completed app. It explains primary ideas, the primary constructing blocks, and the logic behind platformOS, whereas additionally giving some suggestions on the workflow.
Diagram of the onboarding routes for non-technical, semi-technical, and technical audience segments, visualizes what was described before
Onboarding pathways. (Massive preview)
Extra after soar! Proceed studying under ↓

We adopted varied strategies to sort out completely different features of the primary problem. We chosen a Design course of to observe, used many alternative consumer analysis strategies to gather insights and suggestions from our customers, selected a framework for our editorial workflow and technical implementation that might work properly for our Agile, iterative course of and our audience, and went with an method for content material manufacturing that allowed group members to contribute early on.

Design Pondering

Due to the strategic function our developer portal performs within the adoption and use of our product, we needed to make use of a inventive design course of that solves conventional enterprise issues with an open mindset.

Our aim was to:

  • assist our group to have the ability to use our documentation web site for his or her wants as early as potential;
  • measure consumer wants and iterate the product based mostly on the suggestions;
  • hold the long-term consumer and enterprise targets in thoughts and take a step nearer with every iteration.

We discovered the Design Pondering framework an ideal match as a result of it’s a user-centric method that focuses on problem-solving whereas fostering innovation.

Steps of the Design Thinking process that are described later visualized on a diagram
The Design Pondering course of diagram is predicated on the NN/group and Stanford Training analysis. (Massive preview)

We adopted the levels of the design considering course of:

  • Empathize
    At first, we explored our viewers, our documentation wants, and present and lacking content material by way of in-depth interviews and workshops.
  • Outline
    Then, we outlined personas and our Content material Stock.
  • Ideate
    We shared our concepts for content material and options by way of a Card Sorting train.
  • Prototype
    Based mostly on our findings, we created a sitemap and prioritized content material wants, and created layouts and wireframes. Content material manufacturing began based mostly on the outcomes of our discovery part.
  • Check
    We adopted an iterative, Docs as Code method: at every stage, we work with fast suggestions rounds, deploy typically, and enhance options and content material based mostly on suggestions from actual customers.

Person Analysis

Within the lifetime of a product, every improvement stage has a becoming UX analysis methodology that we are able to use, relying on the enterprise plans, time constraints, stage of product/function, and the present issues.

Within the final three years we used the next strategies:

  • Interviews
    We met with customers, gross sales, and help individuals to debate in-depth what the participant skilled about varied matters.
  • Distant Usability Testing
    We requested potential or present customers of the product to finish a set of duties throughout this course of, and we noticed their habits to outline the usability of the product. We used two kinds of distant usability testing:
    • Moderated: We carried out the analysis remotely by way of screen-sharing software program, and the contributors joined in from their regular work setting. This method is advantageous when analyzing complicated duties — the place real-time interplay and questioning with contributors are important.
    • Unmoderated: We despatched duties for customers to finish in their very own time. As moderators are usually not current, we measured much less complicated duties and centered on the general stage of satisfaction they skilled when interfacing with the product.
  • Card Sorting
    A quantitative or qualitative methodology, the place we ask customers to arrange gadgets into teams and assign classes to every group. This course of makes it potential to replicate the customers’ psychological mannequin on the structure.
  • Tree checks
    We used tree checks to validate the logic of the used data structure. We gave customers a process to search out sure parts within the navigation construction and requested them to speak about the place they’d go subsequent to perform the duty.
  • Surveys, Questionnaires
    We used questionnaires and surveys to collect a considerable amount of details about a subject. This quantitative knowledge may also help us have a greater understanding of particular matters that we are able to additional analysis to know what motivates customers.
  • Analytics evaluation
    We used web site analytics to collect quantitative knowledge about utilization patterns and establish potential circulate breaks. Based mostly on the information we both fastened the issue or if wanted, we additional examined with usability analysis.

Docs As Code And CI/CD

We engaged our customers in an Agile and iterative course of proper from the start discovery part. This ensured that we have been capable of check and validate all of our assumptions, and rapidly make modifications if wanted. As our inner staff members and our group contributors are distributed, we would have liked a workflow that made it potential to collaborate on modifications, massive or small, remotely. Consequently, we would have liked a sturdy method to model management accommodating authors, reviewers, and editors all engaged on content material concurrently. As we needed to encourage builders to contribute, we would have liked a framework that they’re accustomed to. We additionally needed to make our documentation open-source, in order that anybody may duplicate and reuse it for their very own initiatives. Based mostly on these necessities, we determined to observe the Docs as Code method.

Documentation as Code or Docs as Code refers to a philosophy of writing documentation with the identical instruments as software program coding. This implies following the identical workflows as improvement groups, together with being built-in into the product staff. It permits a tradition the place writers and builders each really feel they’ve possession of the documentation and work collectively to intention for the very best end result. In our case, we didn’t solely have writers and builders engaged on our onboarding but additionally UX researchers, account and challenge managers, and naturally, a variety of customers in various roles.

Our documentation is in a separate repository on GitHub. We’ve got a central department, and we work domestically in a devoted department, then we ship pull requests for evaluation to be merged into the primary department. To preview docs, we use our personal staging web site which is an actual copy of the stay documentation web site.

As soon as we settle for modifications, we take steps to push them stay virtually instantly. To keep up the integrity of the positioning throughout this course of, we observe the apply of steady integration and steady deployment (CI/CD). We run check scripts robotically and deploy the codebase to staging. If a check fails, an error report is generated. Alternatively, if every thing goes properly, our CI/CD of alternative — GitHub Actions — deploys the codebase to manufacturing and sends us a notification. We launch updates repeatedly, at instances merging a number of modifications in a single day, at different instances solely a couple of times per week.

Diagram of the CI/CD workflow. Steps are build, deploy to staging, run tests on staging, if tests succeed, deploy to production, if tests fail, notify do not deploy
Our CI/CD workflow. (Massive preview)

Editorial Workflow

Docs as Code gives the inspiration for our processes, however for the varied customers to work effectively collectively, we would have liked to outline a transparent editorial workflow that labored for all contributors (inner and exterior author, developer, contributor, and so forth) and for all levels of the method (writing, reviewing, modifying); however that was additionally easy sufficient to contain new contributors. Following Docs as Code, every stage of our workflow is in git, together with challenge administration (contributors can even add tickets to report points or requests).

These are the steps of our editorial workflow:

  1. Write new content material in Markdown utilizing the templates. You need to use any editor that may produce Github Flavored Markdown.
  2. Submit the brand new matter as a pull request on GitHub.
  3. Evaluate. We’ve got a peer-review system in place for code and docs alike. Subjects are reviewed by each technical reviewers (builders) and writers.
  4. Edit as wanted. Repeat steps 3-4 till authorised.
  5. Merge authorised pull request.
  6. Deploy to staging, then to manufacturing.
The six steps of the workflow visualized as a process diagram
The steps of our editorial workflow. (Massive preview)

Our editorial workflow ensures that contribution works the identical manner for everybody, and we help our contributors with pointers and ready-to-use templates.

Content material Manufacturing And Contribution

Once we began growing our onboarding and documentation, we adopted the Content material First method. We deliberate to develop some preliminary content material that we may work with, however even earlier than that, we determined what kinds of content material we would wish and outlined the construction of every content material sort. These outlines grew to become templates that guarantee consistency and encourage contribution.

We have been impressed by topic-based authoring and DITA, within the sense that we determined to have three important content material varieties for our documentation, tutorials that describe accomplish a process, ideas that present background data and context, and references like our API Reference. Our onboarding consists of tutorials that hyperlink to ideas and references when wanted.

DITA, brief for Darwin Data Typing Structure, is an XML normal, an architectural method, and a topic-based writing methodology the place content material is authored in matters reasonably than in bigger paperwork or publications. A DITA matter should make sense in its personal proper.

Involving our customers from the start ensured that we may check and validate all of our assumptions, and rapidly modify something if wanted. This proved to be a time and cost-efficient method: though we edit and rewrite our content material, and alter issues on our documentation web site on a regular basis, we don’t run the chance of making massive chunks of labor that need to be thrown away as a result of they don’t correspond to the wants of our customers.

Fixed collaboration additionally builds belief: as our course of is totally clear, our group repeatedly is aware of what we’re engaged on and the way our docs evolve, and group members can make sure that their opinions are heard and acted upon.

Involving the group from an early stage signifies that our customers noticed numerous stuff that was partially performed, lacking, or ended up completely rewritten. So, for all of this to work, our customers needed to be mature sufficient to offer suggestions on half-done content material, and we needed to be level-headed sufficient to make the most of generally passionate criticism.

Encouraging Contribution

We needed to make it very straightforward to become involved for all segments of our audience, so we provide a number of methods to contribute, making an allowance for the time contributors have obtainable, and their ability stage. We describe methods for our group members to become involved in our Contributor Information. For some fast modifying, like fixing typos or including hyperlinks, contributors can edit the content material simply on the GitHub UI. For heavy modifying, including new content material, or for builders preferring to make use of git, we offer a whole Docs as Code workflow. This method proved to be extraordinarily priceless for our onboarding. We received direct suggestions on the place customers struggled with a step or had too little or an excessive amount of data, and we may instantly make changes and confirm that now we have fastened the difficulty.

To assist contributors write bigger chunks of textual content or full matters, we offer pointers and templates to begin from:

  • Type Information
    Our fashion information accommodates pointers for writing technical content material (e.g. language, tone, and so on.) and every content material sort in our documentation (e.g. tutorials, idea matters, and so on.).
Screenshot of the Documentation Style Guide with labels added saying Audience, Language, tone, style, Formatting, Content types, Accessibility
The platformOS Documentation Type Information. (Massive preview)
  • Templates
    Our web site makes use of Liquid pages, however to make modifying simpler for contributors, we write documentation content material in Markdown and use a Markdown converter to show it into Liquid. Our templates embrace all non-changeable content material and placeholders with explanations for the elements which are editable. Placeholders present data on the advisable format (e.g. title) and any necessities or limitations (e.g. most variety of characters).
Text written in the Markdown format displayed on the GitHub UI
The tutorial template is in our GitHub repository. (Massive preview)

We thank all of our contributors by giving recognition to them on our Contributors web page in addition to on our GitHub repository’s README web page.


Our staff and group members are scattered throughout completely different time zones. Equally to how we talk amongst staff members, we use largely asynchronous and generally real-time communication instruments to speak with our group. We even leverage real-time communication instruments, like a video convention, to develop into considerably asynchronous. For instance, video conferences and webinars are recorded, and group members can focus on them on varied channels.

  • pOS Group web site
    One in all our important communication channels is our group web site, the place you possibly can ask, reply, upvote, and downvote questions, and get to know different members of the platformOS Group. Extra options coming quickly!
  • Slack help
    One in all our important communication channels is devoted Slack channels, the place group members ask questions, share concepts, and get to know our staff members and one another. Based mostly on their suggestions, group members have confirmed how useful it’s to have the ability to talk instantly with us and one another: they’ll share what they’ve discovered, plan their module improvement in sync with our roadmap and one another’s initiatives, and allocate their sources in keeping with what’s happening within the enterprise and the broader group. This communication seeds the documentation web site with essentially the most sought-after matters.
  • Video convention
    We repeatedly have video conferences over Zoom known as City Halls, the place group members and the platformOS staff share information, demo options, and modules and have the chance to have interaction in real-time, face-to-face dialog. Our staff and group members are distributed over completely different continents, so we attempt to accommodate contributors in numerous time zones by rotating the time of this occasion so that everybody has the possibility to take part. We additionally share the recording of every session.
  • Person expertise analysis
    Apart from getting fixed suggestions from the group by way of the channels described above, we plan common checkpoints in our course of to facilitate testing and course correction. Throughout improvement, we tie these checkpoints to improvement phases. On the finish of every bigger launch, we conduct consumer interviews and compile and share a brief survey for group members to fill out. This helps us make clear the roadmap for the subsequent improvement part.

We be certain to maintain group members knowledgeable about what’s taking place by way of completely different channels:

  • Standing reviews
    We repeatedly share standing reviews on our weblog to maintain our group up to date on what we’ve achieved, what we’re engaged on, and what we’re planning for the close to future. Our standing reviews additionally embrace requires contribution and analysis participation and the outcomes and evaluation of UX analysis. Subscribers can even select to obtain the standing reviews by way of e-mail publication.
  • Launch notes
    We share updates concerning new options, enhancements, and fixes in our launch notes.
  • Weblog
    We repeatedly share articles about finest practices and basic information on our weblog.

Accessibility And Inclusiveness

We deal with accessibility proper from the design part, the place we use Figma’s Ready accessibility plugin. We repeatedly check for accessibility with varied instruments and be sure that the positioning complies with all accessibility necessities.

From a technical writing perspective, we help Accessibility and Usability by offering well-structured, clear, concise, and easy-to-understand copy. All of our documentation matters observe a predefined construction (predefined headings, steps, sections, hyperlink collections, and so forth) relevant to that matter sort (duties, ideas, references), impressed by the ideas of topic-based authoring.

Semantic HTML is vital for Accessibility, and we be certain to not fashion textual content some other manner than by way of Markdown which is then translated into HTML. This manner, display screen readers can correctly navigate by way of the content material, and it additionally helps general consistency when, for instance, we wish to do a design replace.

We additionally evaluation all content material to make sure accessible and inclusive language as laid out in our fashion information.

How We Developed Our Onboarding: Rounds And Classes Realized

Creating Our Onboarding Utilizing Steady Iteration Rounds

Firstly of the challenge, we began with a centered effort round discovery to establish the primary enterprise targets and consumer wants. Because of this analysis, we have been capable of articulate the massive image. After we had all of the consumer journeys and a sitemap for the massive image plan, we have been capable of break it all the way down to establish the primary iteration that will develop into the primary working MVP model of the positioning.

Shifting ahead, we proceed to observe an iterative method, shifting quick with an agile mindset. Steps: collect consumer suggestions, establish areas of enchancment and potential new instructions, outline the answer based mostly on sources, enterprise targets, and consumer wants, and implement it. This circle repeats indefinitely. So, now we have an overarching plan outlined for our documentation that we remember, however we at all times give attention to the subsequent couple of motion steps we’d prefer to take.

We are able to spotlight 5 distinctive rounds that had an excellent impression on the event of our developer portal.

  1. For our onboarding course of, we began with exploring the necessities following the Design Pondering method. By way of a Card Sorting session, we explored the areas of curiosity for every audience and that helped us outline the matters that concern them essentially the most. This labored as a persona-based content material prioritization for the documentation web site.
  2. We needed to information our customers with actionable gadgets that they’ll check out on our web site as a subsequent step. At this level, we have been already conscious that our audience shifted. The interviews and the help suggestions helped us perceive their wants that pointed in two important instructions. We wanted a simple journey for non-technicals and one other one for technicals who like to know the logic of the platform. On this stage, we deliberate, examined, and developed the primary model of the 1-click journey and the sandbox.
  3. We already had skilled platform customers who we needed to see in motion. Utilizing distant discipline research, we found how they use the instruments, the documentation web site, and the companion portal we offer. On the identical time, we began to conduct steady onboarding interviews with companions who joined the platform. The 2 analysis instructions helped us to appreciate how customers with a various levels of expertise interpret the platform.
  4. By this level, our content material grew loads on the developer portal, and we needed to find if we would have liked a structural and content material reorganization based mostly on the consumer analysis.
  5. On this newest spherical, we needed to dedicate a while to fine-tuning and changes, and to double down on the developer portal’s accessibility and inclusiveness.

Spherical 1: Figuring out The Goal Viewers Segments, Defining Proto-Personas, Base Discovery

With the Design Pondering workshops, we first centered on understanding our customers. Based mostly on the consumer analysis outcomes, we outlined the proto-personas and created an in depth description of every to indicate their wants and expectations and assist us establish who we have been designing for. It supplied a superb basis for guiding the ideation course of and prioritizing options based mostly on how properly they deal with the wants of a number of personas.

Screenshot of a digital whiteboard in Mural that shows the tasks of the workshop focusing on the Proto-Persona validation during an online workshop
Proto-Persona validation, on-line workshop in Mural. (Massive preview)

On our documentation web site, we’re working with a considerable amount of knowledge that we have to current clearly to all customers. To outline a Content material Stock:

  • we created a listing of our proto-personas’ wants based mostly on the issues they wanted to resolve with the platform;
  • we created an in depth checklist of content material from our earlier documentation web site and recognized lacking, reusable, and non-reusable content material for our future web site;
  • we analyzed the competitor websites to create a listing of inspirations.

We ideated with the workshop participant utilizing a Card Sorting train. The duty was to map out the Content material Stock parts and outline connections between them. The outcome confirmed us the linked areas and the proto-persona’s choice by way of coloration coding.

Screenshot of a digital whiteboard in Mural that shows the tasks of the workshop focusing on the Card Sorting exercise during an online workshop
Card Sorting train, on-line workshop in Mural. (Massive preview)

Based mostly on the Content material Stock and the outcomes of the Card Sorting periods, we outlined the Data Structure by making a sitemap and the navigation for our future web site. This plan included all of the wants that have been found and provided a roadmap to maintain observe of web site enhancements, content material wants, and challenge phases.

In the course of the Card Sorting periods, we explored areas of curiosity for every consumer persona and, on the sitemaps, we highlighted these as consumer journeys. We additionally validated the significance of those areas to assign larger priorities to those that want extra consideration. This course of stored our give attention to an important wants of the personas.

A very powerful sections for the 4 segments:

  • Skilled Builders: Quickstart information, The way to information, API docs;
  • Junior Builders: Quickstart information, Tutorials, Conceptual documentation;
  • Web site Builders: Quickstart information, Tutorials, FAQ, Discussion board;
  • Market Homeowners: About platformOS, Weblog.

This concluded our Data Structure part. We’ve got found and arranged all the knowledge we would have liked to proceed to the subsequent part, the place we began creating templates for content material varieties, constructing the wireframes for every web page, producing content material, and making Design choices.

Spherical 2: Onboarding Technique And Testing Of The Onboarding Course of


Earlier than we jumped into planning an onboarding technique, we did a revalidation on proto-personas. At that time, we found that our viewers shifted to Skilled builders, Junior builders, Company Proprietor, Gross sales/Advertising, PM and Enterprise Analyst, and we realized that we would have liked to cowl a broader spectrum of wants than beforehand recognized.

We interviewed 20 platformOS customers. We recognized how lengthy they’ve been utilizing the system, how they use the platform, what the important thing ‘aha’ moments have been, what struggles they confronted, and the way they solved them. Their wants pointed in two important instructions: we would have liked a simple journey for non-technicals and one other one for technicals, masking these with much less expertise in addition to these extra succesful builders who wished to know the deeper logic and nuances of platformOS.

Our important targets with the brand new onboarding technique have been:

  • to attach our programs (developer portal — companion portal — platform), so our customers can undergo their discovery expertise in a single circulate throughout their first go to;
  • to offer an actionable stepped course of that the customers can stroll by way of;
  • permit customers/personas to rapidly establish essentially the most becoming journey.
The plan of the opening step of the onboarding screen, showing the layout before the usability test with three separate boxes for non-technical, semi-technical, and technical users
The primary model of the opening onboarding display screen, earlier than the usability check. (Massive preview)

Usability Check

We carried out distant Usability Check periods in three rounds to validate the platformOS onboarding course of.

The onboarding part connects the Documentation web site and the Accomplice Portal the place customers can choose one in all three journeys based mostly on their programming expertise. The aim was to find out how customers with completely different ranges of technical data reacted to the three journeys. Are they capable of rapidly establish what’s included in every journey? If sure, how do they have interaction from that point ahead? Did they observe the pathway most applicable for them?

In the course of the Usability research, we requested customers to do a number of brief duties utilizing a prototype of the deliberate options constructed with Figma. We used each moderated and unmoderated distant usability testing strategies and carried out additional checks with platformOS staff members to confirm the represented enterprise, technical, and content material targets.

We carried out six moderated distant Usability Checks in two rounds and arrange three unmoderated distant Usability Checks. These checks have been separated into three rounds, and after every spherical, we up to date the prototype with the check outcomes.

Based mostly on the check outcomes, we determined that as an alternative of exhibiting three choices to the customers, we present the 2 quickest choices: 1-click set up and Construct a primary ‘Hiya world’ app. This helps them to rapidly resolve which is one of the best match for them, and on the identical time they’ll instantly check out the platformOS fundamentals. Then, in the event that they wish to, they’ll take a look at our third journey — the Get Began information that explains construct a to-do app.

We redesigned the Occasion welcome display screen to assist customers establish the subsequent steps. Based mostly on the outcomes, we needed to optimize the UI copy to make it comfy for non-technical customers as properly.

Because the circulate connects two websites and exhibits the product, the primary aim was to indicate that the consumer is heading in the right direction and nonetheless on the chosen journey. We achieved it by exhibiting the steps of the journey upfront, utilizing constant wording, and permitting the consumer to step backwards and forwards.

The plan of the opening step of the onboarding screen, showing the layout after the usability test with two separate boxes for non-technical, semi-technical users, and offering a technical journey below in text
The model of the opening onboarding display screen, after the check outcome. (Massive preview)

Spherical 3: Distant Subject Examine And Onboarding Interviews

On this spherical, the aim was to look at the general journey of the skilled and potential pOS customers, specializing in each successes and challenges they’re going through. We carried out an interview with a distant discipline research to get a greater understanding of how they work and what processes they’re utilizing.

We centered on 4 important matters:

  1. Growth with pOS (workflows, preferences on model management, instruments),
  2. Group and collaboration (help, discussions),
  3. Developer Portal (general expertise, obstacles, recommendations for enhancements),
  4. Accomplice Portal (utilization, dashboard preferences).

Key insights from the consumer analysis outcomes:

  • The event with platformOS has a versatile and limitless providing which is a good power of the system, nevertheless it additionally signifies that studying the workings of the platform, particularly within the very starting, takes extra effort and endurance from builders.
    Answer: Templates may present help in the course of the studying course of.

  • As platformOS is new available in the market, there’s not a lot data on Google or StackOverflow but. On the constructive aspect, the pOS staff at all times gives nice help by way of Slack and introduces new options in City Corridor conferences, standing reviews, and launch notes.
    Answer: To additional strengthen the group, a separate Group Web site could be an environment friendly and fast platform for peer-to-peer help by having a search operate, and customers can observe helpful matters.

  • Associated to the Developer Portal, we noticed that the consumer simply will get to the documentation and finds the answer for many of their use instances. Nonetheless, the search outcomes weren’t exact sufficient in some instances, and the naming of the tutorials prompted uncertainty about the place to search out gadgets.
    Answer: Run a content material reorganization session for the tutorials and repair the search operate.

  • We found that the Accomplice Portal was used largely initially of the initiatives by skilled devs. Junior builders most well-liked that they’ll discover serving to directions on the cases web page that supported their work on the brand new cases. Company Homeowners/Enterprise Analyst most well-liked to make use of the positioning to see the funds associated data and the analytics of the occasion use. We noticed that they typically had issues dealing with the permissions associated to the cases and figuring out the hierarchy between their cases.
    Answer: Accomplice Portal design replace with new data construction of the cases and permissions.

Spherical 4: Structural And Content material Reorganization, Person Testing, Implementation

Structural And Content material Reorganization

On this spherical, we renamed the Tutorials part to Developer Information. This was in step with our plan to increase our tutorials on this part with extra idea matters, as requested. We deliberate to have a complete Get Began part for inexperienced persons with the “Hiya, World!” tutorial and the Construct a To-do Checklist App collection, and the Developer Information for everybody working with platformOS — from customers who’ve simply completed the Get Began guides to skilled platformOS builders. This separated and highlighted the onboarding space of the positioning, and that is when the present construction of our Get Began part got here to be: a separate tutorial for once you begin your journey with platformOS, that you should use as a primary step to undergo the extra superior onboarding tutorials.

Card Sorting

At this level, we had 136+ matters in our Tutorials part organized into 27 teams, and we knew that we needed so as to add extra. Based mostly on consumer suggestions, we may enhance the usability of the Tutorials part by organizing the matters higher. Our aim was to establish a construction that most closely fits customers’ expectations. We used a Card Sorting train to achieve our aim.

We’ve got analyzed the inputs, and based mostly on the outcomes, we concluded that seven classes can cowl our 27 matters: Information administration, Schema, Templates, Modules and Module examples, Accomplice Portal, Third-Occasion Methods, and Greatest Practices. We used the similarity matrix and the class namings to establish which matters are linked and what names customers prompt for them.

With this analysis, we managed to restructure the Tutorials part to develop into in step with the psychological fashions of the customers.

Spherical 5: Superb-Tuning, Content material Manufacturing

Within the newest spherical, we added the chance, on our onboarding, to begin from a template. Based mostly on our discovery, {the marketplace} template is an effective possibility for web site builders who wish to have a market up and operating quick and don’t wish to discover the event intimately.

The pOS market template is a totally useful market constructed on platformOS with options like consumer onboarding, advert listings and advertisements, buy and checkout course of, and on-line cost. Following the tutorial we added, customers can deploy this code inside minutes to have a listing of working options and begin customizing the back- and front-end code.

We additionally hold fine-tuning our content material for readability, brevity, readability, accessibility, and inclusive language. We’ve got common accessibility opinions the place we take note of features, resembling terminology, technical language, gender-neutral pronouns, and informative hyperlink textual content whereas avoiding ableist language, metaphors, and colloquialisms. We summarized our expertise with fine-tuning accessibility within the article “Code and Content material for Accessibility on the platformOS Developer Portal” which incorporates examples of what we modified and the way.

Future Plans

The platformOS Developer Portal was very positively obtained and even received a number of peer-reviewed awards. We’re honored and grateful that our efforts have yielded such nice recognition. We are going to hold revalidating and enhancing our onboarding identical to now we have been doing because the starting. We’re additionally engaged on a developer schooling program for our soon-to-be-launched group web site that features varied studying pathways that can attempt to accommodate customers’ completely different studying types and likewise provide methods for them to get extra concerned with our developer group.

Screenshot of the developer portal with five award badges
Our awards. (Massive preview)


So, after years of engaged on our onboarding, what are our key takeaways?

  • Don’t really feel pressured to get every thing proper the primary time round. As an alternative, develop into comfy with change and think about every adjustment progress.
  • Get to know your audience and be able to revalidate and shift audience segments based mostly in your findings.
  • Get accustomed to completely different consumer analysis strategies to know when to make use of which method. Perform in depth consumer analysis and, in flip, take heed to your customers. To help suggestions, permit customers a number of completely different channels to offer you suggestions.
  • Select a versatile workflow, in order that the editorial course of doesn’t develop into an impediment to steady change. We love Docs as Code.
  • A product is rarely prepared. Shaping and updating an already performed circulate is completely wonderful.
  • Iteration and prioritization are your finest buddies in the case of delivering massive quantities of labor.
A screenshot of the developer portal after the first iteration, and an arrow pointing to a screenshot about the current version of the developer portal
How we began, and the place we at the moment are. (Massive preview)

We hope that this case research helps and encourages you as you construct an onboarding expertise to your product.

Smashing Editorial
(yk, nl, il)

Supply hyperlink

Leave a Reply