Creating a better learning experience for developers

A 2.5-week sprint in a group project with Dylan Flowers & Cherie Chambers. We worked with OutSystems, commissioned by General Assembly to work on improving training for developers & users starting the platform. The output was a high-fidelity clickable prototype that can engage users with personalisation of learning journeys, unique to their different needs.

UX Techniques
Market Research, User research (surveys, interviews, competitive analysis), affinity mapping, information architecture, user flows, task analysis, sketching, prototyping & usability testing

Tools
Sharpies, whiteboard markers, notes. Invision & Sketch.

Client Objectives
Improving training engagement.

A little about the brand
OutSystems is a low-code platform, targeting at big businesses to visually develop apps for both web and mobiles & allow companies to integrate easily with their existing systems.

Market Research

Gartner report (left) • Forrestor report (right)

We looked at Forrester & Gartner reports seeing the growing opportunity in the low-code platform as that market is predicted to grow by a factor of nine to over $15 million over the next five years.
We also learned that OutSystems is a market leader in the Q1 2017 report and its USP is that it has the capability to support massive, complex systems compared to other competitors in the market.

Barriers to entry
We identified a few factors that early engagement and training can help to address, which includes

49% mentioned time, budget and 42% said skills gap as their biggest challenges in delivering mobile applications.

Lack of knowledge in the low-code mobile applications is the biggest reason (50%) as to what is preventing organisations to use low-code application development platforms.

Therefore at this juncture, we quickly honed into the training section of the project. We looked at various key findings:

1. Training Needs
2. Developers prefer to learn by building a simple app within the environment. To do this, they will need adequate knowledge.
3. The training section has not developed and thoroughly tested with the target audience.
4. Better engage with users starting the platform with the knowledge they need to learn the platform

Market Research: Competitive Analysis
We also looked various key competitors and learning platforms such as Lynda, filtered and more to look at the structure of learning across those platforms:

User Research: Affinity mapping
We also talked to architects, web developers, app developers and created an affinity map that captures key insights so that we can better spot trends and patterns. Some of the key insights we gathered are as follows:

Some quotes include “I learn through tinkering” “Some of the best things come from the community.”

Learn by doing
- Most popular way developers like to learn & program
- Often tried out before going to tutorial to build more in-depth knowledge
- Better to start off slowly, get setup than being quicker towards the end
- Likes to read around specific things they want to do

Personalised Learning Paths
- Like being pointed in the right direction
- Don’t mind inputting information to get more personalised learning

Community
- Expects lots of resources to be readily available
- Expects the best support to come from here
- Love peer to peer support & sharing
- Used to do this on other platforms e.g. Github

Problem Solving
- When identifying an issue, developers prefer to use search & forums
- Don’t mind referencing multiple sources to get the answer they are looking for

Creating our Scenario
We created a persona with the insights we get from our interviews and surveys. ‘Jason’ is a developer who is looking to build a simple app and while creating it, he needs to learn more about the platform. We created a user journey to map out his engagement with the platform in 4 stages: On-boarding, Tutorial Engagement, Training Engagement, Getting Buy-In.

Dylan’s fantastic storyboard for the project

Opportunity Statement

• Help users find specific information they want in the way they want it
• Engage people with ongoing learning to optimise their use of the platform.

It was challenging as we have to facilitate, time-box activities and encourage the team to sketch with ease.

Design Studio
We conducted a 2hr remote design studio for this project with the OutSystems team based in Lisbon and Atlanta.

From the design studio, we gained lots of valuable input and ideas that we were eager to test with paper prototypes.

Encourage rapid ideation, targeting the two design challenges at hand.

Paper Prototyping
While translating the ideas from the design studio, we discussed how we could bring together the ideas into the learning platform for us to test. We wrote down features that came out from the design studio and sketched wireframes on the whiteboard.

Writing down features (left) • Quick whiteboarding sketches (right)

We looked into three main areas of the OutSystems website, namely Platform, Learn, Community.

Navigation Schema that we looked into

Platform Home (better personalisation to user’s needs)

When we looked at the first screen user lands after signing up or logging in, we see a significant opportunity to better align the area with information that is relevant to the user’s needs at that particular phase of his/her training experience.

For sign-ups, OutSystems would have picked up the roles of the sign-up user. Currently, there are simple and personalised call-to-actions for users to complete. However, they don’t grow, evolve or change in any way.

Paper prototype of platform home (left) • Mid-fidelity prototype (middle) • High-fidelity prototype (right)

Some of the concepts we tested on Platform Home included:
- Skill Development section (to further engage users to learn)
- Recommended For You (to cater to audiences on possible CTA based on search history and lessons
- Your Bookmarks (to allow developers to save links to revisit later)

It tested well with users as we quickly direct user’s eyes to understand call-to-actions and what they can do on the website. It also helps as we created additional pages to illustrate the difference of visuals the new users should be getting vs. returning users.

We were also cautious about the fact of people responding to taxonomies such as “Platform Home”, “My Platform”, “My Profile” throughout the prototyping process. To address the issue between publicly displayed information and private information, we evolved the taxonomies to “My Dashboard”.

Learn (exploding the guided paths)

We also looked at how we can improve engagement and learn for people across the learn section. Guided paths proved to be an effective way of learning but not user-focused just as yet. The current paths provide a linear structure to completing the course which ranges from long durations and is made up of different levels and can be potentially confusing and lengthy for learners.

We wanted to aim for a learning experience where it is fluid and loosely structured to allow flexibility and autonomy in picking lessons.

Paper prototype (left) • Iterations of Progress Rings (middle) • Mid-fidelity (right)

Some of the concepts we tested on Guided Paths included:
- Breaking up the long route to bite-sized modules with progress indicators
- Progress Rings (iterating on clarifying the progress clearly to the user)

While testing the concept, it was good to get validation regarding understanding the idea of wanting to advance skills vs. looking for answers to specific issues during development. While talking to app developers, we gathered that they prefer a self-directed learning flow rather than going through long training. Especially if they have adequate knowledge in certain areas.

Again, we looked at the taxonomies for this section. To stay faithful to the direction we wanted the guided paths to progress towards, we looked at ‘Skill Development’. However, through user testing, the majority had trouble understanding the concept. We further iterated “Skill Paths” which is the most efficient, combined with the apparent progress rings.

Prototype

We further developed a clickable prototype and brought it up on Invision to test with usertesting.com. Visit the prototype here.

Some feedback we received includes:

We hope you have enjoyed this sprint journey.
Give me a shout on Twitter, @cellyntan and let’s talk!

Visit my other works on cellyntan.com