Mindjoy <> Replit Mobile Pilot Collaboration 2022

Explore

Purpose Of This Document

Reflection + Reporting

Replit Sponsored Mindjoy Mobile Pilot Report 2022

The Pilot was successful in that we managed to outline a Mobile Coding Club playbook through our learnings about how students from underserved and non-technical backgrounds engage with and think about coding and technology. We also learnt a lot in terms of setting up and facilitating coding projects on Replit Mobile, particularly with learners from a non-technical background whose primary language is not English.

Pilot Metrics

Pilot Metrics

Event Metric

Metric Goal

Result

Notes

Number of Students

Number of weeks programme runs

Mindjoy visited Molo Mhlaba before launching the pilot just to confirm logistics with the school, and get the learners and stakeholders excited.

Average attendance

75%

90%

Average NPS from young people

8.9

NPS from school

Number of projects Completed per student

As well as 6 paper-based activities.

There are no rows in this table

⁠

Skills Acquired 🧑‍🎓

⁠

⁠

⁠

⁠

Navigating Replit Mobile

Experience working in a real coding environment with the following programming languages:

CSS

HTML

Python

Typing Skills

Copying and pasting code into the `main.py` file and running the code.

Understanding basic coding concepts such as:

Input

Output

Software

Hardware

Processing

Storage

Commands

Comments

Bugs / Error Message

Debugging

Algorithms

Variables

Using the following commands:

Forward( )

Backward( )

Left ( )

Right ( )

Print( )

Variables

Color ( )

Using Readme files

Navigating the File Tree

Designing Wireframes

Basic components of websites

Fixing different bugs by editing indents and syntax

Organise code using #comments

Writing an algorithm using the correct steps or sequencing

Learnings 🧩

What we noticed?

Working on mobile devices 📱

Using a mobile phone to code is fun and exciting for the learners - they were always thrilled to receive their phones and get onto Replit each week. It can however also be distracting, because for many learners using mobiles is associated with play and entertainment.

As suspected, the learners were very comfortable using mobile devices - they knew how to easily navigate the phone’s interface and even download apps and games (without needing prompting or support).

We soon learnt that we needed a few safety measures in place to ensure the mobiles were being used for educational purposes only. Even though we had hidden all the apps and limited access, it was interesting to discover a few of the learners were still able to access things like the avatar creation app via the keyboard in Replit.

It took some time for the learners to understand and register that these devices can also be used for creation, and not just consumption. We spent time discussing what exactly a computer is, why mobile phones are an innovation in the world of computing, and how they can be utilised for dynamic interaction with the world around us.

Mobile vs PCs 💻📲

For a few learners it took some adjusting to work on Replit Mobile, as the Molo Mhlaba learners had already done some coding on Replit using Chromebooks. This meant that they were already somewhat familiar with the PC interface and at first the change was confusing for some of them.

Initially, some of them told us that they preferred PCs over mobile phones because the screen is bigger and can accommodate both the main coding file, console and output screen at the same time. In some cases the learners even attempted to put the phone horizontally expecting the screen to rotate, hoping that it would offer a wider view.

However, after 1 session using the mobile phones, most of them expressed that this was their preference because “they are able to see their hands while they are typing” and felt that they had a bit more control.

Some learners immediately made the connection that they could code at home on a parent’s device using their logins.

The learners expressed more of a personal connection with mobile as something that is relevant and relatable in their everyday life. To them phones are the portal through which to access the world. They don’t have a mental model of a PC as being the same access point.

From a facilitator’s perspective, we noticed that the learners were instantly more comfortable on mobile (even if it took them some time to get used to the new interface) - they could type quicker and navigate around the platform with more ease, which meant that they stayed engaged and motivated for longer (because there was less friction in the experience for them).

There was some confusion with the function of the Console screen vs the Output screen. When the learners used functions and variables, the output appeared in the console. After pressing run, the screen automatically navigated to the console. However, when we used Python Turtle Graphics, the screen would still navigate to the console first, instead of to the output screen which was frustrating for the learners.

Placing the cursor in the correct position amongst the text was difficult for the learners on Mobile. They also struggled with the toggle bar as it was hyper-sensitive and actually made moving the cursor even more difficult. This caused a lot of frustration. The joystick is also very sensitive.

Copying and pasting was also tricky for the students - the learners found it incredibly difficult to do on Mobile (less so on the Chromebooks). This was especially true in longer projects. It wasn’t intuitive for them, and the sensitivity of touch and difficulty with the cursor meant it actually became demotivating.

From a facilitation perspective, because the teams function does not yet work on mobile, it was hard to monitor student progress (we had to do this manually). Setting up projects for learners was also less effective and more time consuming.

In places like Khayelitsha were there is poor connectivity and fibre infrastructure, it’s hard to have multiple PC devices on the network. Mobile devices function better in a low bandwidth environment. Students picked up on this and mentioned their preference for speed and ease of use.

Learners and Replit 🧑‍🎓

When opening a project up on mobile, it initially opens up on a blank coding screen, which, for those without a coding background or computing context, felt overwhelming. This meant that they started projects feeling unsure or uncertain, which can very quickly demotivate learners. It was important that the learners felt supported in being able to find instruction/direction. As they had previously coded with Replit on laptops, they were used to navigating to the file tree and easily finding a

readme.md⁠

file to access instructions.

Interestingly, the learners figured out how to swipe between the various screens on their own fairly intuitively and, because of the colour association with the “Run” button (Green is also universally linked to the idea of “Go”), they also had no issues identifying it. However, they did struggle identifying it when it was orange in the spooky theme.

Different learners found different ways of navigating through the different files, some preferred swiping, some preferred pressing on the tabs button and being able to see all the tabs and navigate through the files that way. They did this without needing prompting.

The learners also loved making use of the “History” bar (they never used this on the PC version) and easily understood how to drag the progress bar back and press play. Being able to visually see their coding progress throughout the session really excited them and made them feel accomplished and proud.

⁠

Loading…

⁠

They most easily navigated using buttons that were at the bottom of the screen.

It took a while for learners to understand Replit as a platform where they have autonomy to build and make, as opposed to an educational space where they can complete projects (as if they are just tasks they have to tick off). They didn’t venture into the Replit community and mostly stayed in their projects during the sessions (except for those who completed projects early and were prompted to do so by Mindjoy coaches).

Learners were able to identify errors or bugs before even pressing run because of the red lines which appear underneath the code when there is a syntax problem.

Personalisation is an important aspect of motivating and engaging young learners:

Learners were very eager to have autonomy around the color theme of the app (switching between ‘light’ and ‘dark’ mode).

They also loved being able to change the color of their outputs (this was one of their favourite commands).

They often wanted to include their own emojis in their coding projects

They were very keen to upload profile pictures (which we discouraged for safety reasons, although we told them they could upload any images that didn’t include their own photo) and write profile bios.

Learners were very sensitive to color changes in the text - colour seemed to be very stimulating for them and acted as strong signifiers or identifying elements.

Project Set-up 🖥

As mentioned before, when you open up a project, it opens on the main coding page. It is confusing for the learners to land on a blank coding page. We found that leaving comments in the main file assisted the learners in starting their projects. The comments can provide a basic outline for the project, or lead the learners to their files to discover where they need to go.

⁠

WhatsApp Image 2022-12-13 at 16.43.33.jpeg

⁠

Having comments as guidelines ensures that the learners experience wins faster and remain engaged and motivated.

We also used comments to label the code on behalf of the students - we found this especially important on mobile because the screen is smaller and lots of code can feel like endless scrolling. Labels help the learners know where they need to be and also helps them with debugging.

We underestimated how much time the learners would need to work through the coding projects - English was their 2nd language which impacted their reading fluency and speed of comprehension.

Platform Recommendations 🧑‍🔬

Color-association works really well for learning (eg: most learners could quickly and easily find the “run” button because of its familiar green color) - this can support with quicker navigation and orientation.

Offering more personalisation in the app (e.g: offering more themes/skins) can also help to engage learner’s and make they feel excited to login and get coding.

The desktop version has a tour for new users - this would be useful for mobile as well.

The “teams” function does not work the same way on mobile - we had to import projects into each individual student’s personal Repls which was extremely time consuming for our coaches. To support teachers and other educational organisations, there needs to be an easier way to import projects for a group.

There needs to be a way to manage learners through a team and see progress per individual and within a class. We tracked this manually.

The file icon is not intuitive for non-coders/ first-time users - perhaps this could be changed to something universally recognisable. It could also be colour-coded like the “Run” button as this would draw one’s attention to it quicker.

The toggle bar/joy stick needs to be less sensitive to ensure placing the cursor is easier.

Create an easy way to copy and paste code snippets on mobile.

Projects automatically open on a blank coding screen, which for non-technical or first-time users is overwhelming or confusing. Default open to a readme file or wizzard/walk-through.

For countries like South Africa, it would be useful to have offline capability (particularly because of the National rolling black outs that make WiFi connection unstable and unreliable)

Platform Recommendations 🧑‍🔬

Want to print your doc?
This is not the way.

Try clicking the ⋯ next to your doc name or using a keyboard shortcut (

CtrlP

) instead.