Flowcode An AI-Powered Programming Environment for Scaffolding Iteration in Creative Computing Education

Jul 16, 2026

Flowcode supports learning to code through remixing found examples in creative coding communities. The work addresses two challenges: understanding existing code structure and extending it to implement learners’ own design ideas. Flowcode combines a flowchart view to visualize code structure with a chat interface tailored to learning-oriented AI use. Results from two studies with new creative coders examine how visualization and intentional friction affect productive interaction with AI for computing education.

LanguageEnglish

CategoryTechnology

FormatPDF

Pages14

Reading Time35 min

Abstract

Introduction

Examples and Remixing in Creative Coding

Challenges in Understanding and Iterating Code

Role of Large Language Models and Code Assistants

Motivating Flowcode Design and Iteration Studies

Flowcode: An AI-Powered Programming Environment for Scaffolding Iteration in Creative Computing Education Tiffany Tseng Barnard College, Columbia University New York, United States [ttseng@barnard.edu](ttseng@barnard.edu) Meitalia Factor Barnard College, Columbia University New York, United States [mef2241@barnard.edu](mef2241@barnard.edu) Liliana Hanem Seoror Columbia University New York, United States [ls3594@columbia.edu](ls3594@columbia.edu) Rona Darabi Columbia University New York, United States [rjd2160@columbia.edu](rjd2160@columbia.edu) Jeevika Adda Columbia University New York, United States [ja3951@columbia.edu](ja3951@columbia.edu) Kiley R Matschke Columbia University New York, United States [kmatschk@barnard.edu](kmatschk@barnard.edu) arXiv :2607 .0672 1v 1 [ cs .HC] 7 Jul 2026 Tiffany Fu Columbia University New York, United States [tlf2131@columbia.edu](tlf2131@columbia.edu) Annie Lin Barnard College, Columbia University New York, United States [anlin@barnard.edu](anlin@barnard.edu) Alekhya Maram Barnard College, Columbia University New York, United States [am5721@barnard.edu](am5721@barnard.edu) Arya Sinha Barnard College, Columbia University New York, United States [aps2212@barnard.edu](aps2212@barnard.edu) Abstract Building upon found examples is a popular way people learn to code, especially in creative coding communities where sharing projects and remixing are common practices. But effectively doing so requires being able to 1) understand how existing code works, and 2) extend it by writing code that implements your own ideas, practices that can be challenging for new creative coders. We explored how to support these two processes through the design of Flowcode, a creative coding programming environment that integrates a flowchart for visualizing code structure and a chat interface tailored to support learning to code over vibe coding. We share how we iterated on the design ofFlowcode over two studies with new creative coders, reflecting on the roles visualization and friction may play in enabling productive AI-use in computing education. CCS Concepts • Human-centered computing → Interactive systems and tools. Keywords creative coding, computing education, code assistants, large language models 1 Introduction Examples play a fundamental role in how people design, helping creators get inspired, learn from prior work, and build off of to create something new [16, 24] . With software development and design, the web has greatly facilitated the use of examples given the ability to quickly distribute, inspect, and remix code samples [5, 6, 26, 55, 66] . Prior work in computing education has found positive associations between remixing code and exposure to and use of new programming concepts [12], aligning with the pedagogical practice of providing worked examples [8, 37]. However, effectively remixing found samples depends on one’s ability to both understand code written by another creator, and iterate on found examples to realize one’s personal design goals, practices that may be especially challenging to students who are still learning to program or utilize unfamiliar programming frameworks [60] . Our work examines how to foster code understanding and iteration in the context of creative coding, or using code to create visual art. With creative coding, there is a strong ethos of sharing andremixing code as exemplified in online communities like OpenProcessing1 and CodePen2 , community showcases [1], and integrated examples built into IDEs like Processing [46] . Prior work has shown that engaging in creative coding can positively affect learners’ intentions and interests in computing, particularly for traditionally underrepresented communities [3, 41, 62] . Because of this, making it easier for creative coders to understand and build on top of shared creative coding projects may contribute to encouraging more diversity in computing. A potential pathwa

FAQs

What learning problems does Flowcode target in creative computing education?

Flowcode targets understanding existing code and extending it to realize learners’ own creative design goals when remixing found examples.

How does Flowcode combine visualization and AI support?

Flowcode integrates a flowchart to visualize code structure and a chat interface that provides learning-oriented code assistance for iterative development.

What do the two user studies contribute to the paper’s findings?

The studies with new creative coders examine how visualization supports code understanding and how introducing friction can improve the review and use of AI-generated explanations, reducing unproductive “vibe coding.”

Jul 16, 2026

Upload by River Wang