Starting point for low-code development platform
How to get started if you're a new developer joining the team?
Background
Zinier as a platform is beneficial for both citizen and advanced developers to build robust applications using a vast array of the low-code toolkit. But the Getting Start experience has always been full of friction. During multiple research interview calls, this problem got brought up by both the engineering managers and the hands-on engineering workforce. It simply takes too long for a new developer to get started with the platform. Links to learning databases need to be made available for all developers from day-1.
Different persona types use Zinier. Each of these personas needs a different kind of guidance to use Zinier. Additionally, the learning curve of the Zinier web app is significant. It takes a seasoned developer 2-3 weeks to understand. And someone novice more than a month to get it. Even after that, there are instances where users are not entirely sure if they know everything about the app.
Task
Create a getting started database of links to the various knowledge bases.
Give developers a way to return back to their previous touchpoint. Allow devs to view recently visited pages/modules.
Problem
It takes too long for new developers to get started. It takes developers 2-3 weeks to learn everything about the platform and contribute to the system.
Someone from the engineering team needs to regularly handhold new joiners and pass on the critical knowledge base links.
Team
Product Manager — Suhaidah Shahril
Product Designer & Research — Dhananjay Garg
C-Suite Stakeholder — Gideon Simons
Personas Affected
Solution Developers: Solution devs develop different solutions for the end clients. The Solution Developers deliver the final deliverable on the Web in an application.
Mobile Developers: Mobile developers liaise with solution developers to integrate a solution on the mobile. The exchange of data between Web and mobile is made seamless by the mobile devs.
Solution Architects: Solution Architects are generally people who work with the client stakeholders to understand the requirements and end-goal of the project. The solution architects do flowcharts wireframes based on the client's needs.
Quality Assurance Specialists: The QA team works with everyone to validate and test the final solution before the entire workforce of end clients gets hands-on with the delivered solution.
Goals
Create a dedicated space in the Zinier Web Platform for users to get started and learn more about the inner working of the platform.
This page should have a way to link the following
Stack Overflow Zinier Page
Documentation External Link
Design Documentation Zero Heights Page Link
It should have a quick checklist kind of tutorial to get started with
It should have an HTML template that allows us to insert an article of sorts
Iteration #1
I created a checklist experience where developers can go through them to perform a simple task and learn more about the platform.
I customized the checklist based on the user roles.
The users can “Skip the tour” and reaccess the checklist from the hotspot located in the navigation bar.
In short, I converted the Confluence bases to a checklist of tasks.
Problem: Although it was a good first start, it was effortless and not engaging enough. The developers were looking for more than just the steps to get started. They were looking for Github, Confluence links that connect them with the existing knowledge base created by the teams.
Iteration #1 Design Walkthrough 👆
Iteration #2 & #3
Iterations #2 and #3 were quite similar. But with these iterations, we brought in the checklist pattern from Iteration #1 and added third-party links on top of it.
For the developers to keep informed about the latest changes released to the platform, we also brought in a “What’s New?” section that lists an array of updates done on the forum.
Third-party links —
Zinier’s Stack Overflow Repo,
Design System Figma Documentation,
Swagger, and
The knowledge base of all articles was written and updated by the support and engineering teams.
Two different checklists to get hands-on experience of how the platform functions from page to page —
Build your first “Hello World” projects on Zinier’s low-code platform.
And an index of critical concepts every developer should know about before setting up their first production-level project.
Iteration #2 Design Walkthrough 👆
Iteration #3 Getting Start Design Page 👆
How did it look before?
Before the research calls and structural redesign, there was no flow. Instead, the user lands on Solution Builder > Events. Sometimes, the web app also opens as a blank page.
After the redesign, customized a typical user journey for different persona types — Learn > Knowledge Base > Getting Started.
Starting point 👆
Outcomes
After implementation, we were proud of the Getting Started page’s positive impact on the engineering team’s experience. Research findings highlighted:
A significant reduction in hand-holding time required off the engineering managers in the team
All engineers can see and read the knowledge base links.
Engineers found an easy way to access all the relevant information without bookmarking manually.
We also added an added page where users can see all the modules and pages they visited and worked on last. It was an addition to the existing scope, and the insight came when conducting research interviews with the engineering stakeholders.
