AI Collaboration and "Coding by Chat"

As an educational product developer, one of my primary objectives is to harness technology to enhance the learning experience for students. Inspired by Brendan teaching himself to code with the support of AI, I recently tried collaborating with ChatGPT through its GPT-4 Advanced Data Analysis model to create interactive educational activities. These activities were specifically aimed at the Coding and Robotics subject being introduced to South African schools. Although I don't possess JavaScript coding skills, the iterative interactions allowed me to debug and fine-tune these prototypes — a process I've aptly termed "Coding by Chat." Notably, all elements of these prototypes were coded; no images were used, and the focus was solely on functionality rather than design.

Prototype 1: Typing Simulator

Targeted at Grade 4 learners, the initial prototype is a typing simulator. In the digital age, keyboard proficiency is not just helpful — it’s essential. I aimed to provide a colourful, interactive, and motivational tool readily accessible in educational settings.

?Process

I engineered a web-based simulator that uses a virtual keyboard to guide learners through typing a sequence of words. The simulator pulls from an external .txt file, allowing educators to update the word list. This list can be tailored to include subject-specific glossaries or even words in other languages. At the end of the exercise the end of the exercise a basic accuracy score is provided to the learner.

View the prototype here.

Prototype 2: Gamifying Block-Based Coding Education

The second prototype is an educational game designed to introduce the fundamentals of block-based coding. This programming approach allows users to control an environment by dragging and dropping pre-designed blocks representing code structures.

How to Play

• Drag a coding block from the “Coding Blocks” section.
• Drop it onto the “Game Stage” area.
• Observe how the blue character in the “Game Stage” reacts based on the selected coding block.
• Experiment with different coding blocks to see their impact on the character’s movements.

Process

The key challenge was the accurate positioning of the blocks on the “Game Stage.” I addressed this through iterative updates to the CSS and continuous testing. Note, for future versions I'd add in a process to line up code blocks and then run them, as per Scratch.

View the prototype here.

Prototype 3: Multilingual Robot Labelling Activity

Our third prototype is a fully coded drag-and-drop activity that helps learners label the various parts of a robot diagram.

Features

Once all labels are correctly placed, the system congratulates the user. A language-switch button was added to change the interface language to Afrikaans, making the activity accessible to a broader audience but (lol) many of the terms are the same in English and Afrikaans. This could be improved substantially by adding an actual image of a robot to label.

View the prototype here.

Key Takeaways?

• Speed to Market: AI collaboration significantly reduces the development timeline, enabling faster market entry and allowed effective debugging.
• Project Specifications: Clearly defined specs are crucial for a successful AI collaboration.
• Iterative Testing: A repetitive testing and feedback cycle is essential for refining prototypes.

These prototypes serve as proof-of-concept for a model that could enhance various aspects of educational technology development. These projects’ scalable and adaptable nature means they can be extended to other educational exercises — math problems, vocabulary tests, or more advanced coding tasks. Their modular architecture allows them to be adapted to various educational contexts, from primary education to adult learning programs.