An LLM-generated flowchart linking semantic feature descriptions to code across HTML, CSS, and JS files supports novice creative coders' orientation, navigation, and code understanding¶

Claim · All claims
Evidence · 1 study (2 entries) · design r2–r3 · q2
Currency · newest study 2026 · not yet checked against its sources · not reviewed by a person

Subclaims¶

q2 i? In the lab study, 8/9 participants used the flowchart, 5/9 cited it for orientation, 5/9 cited its cross-file highlighting, and users clicked nodes an average of 10.8 times (SD=6.8). → Tseng 2026 q2 i? In the pilot workshop, participants used the flowchart for orientation, navigation, and verifying code changes, with 3/7 beginning by clicking nodes before prompting or editing. → Tseng 2026 (2)

Evidence¶

Tseng 2026¶

Tseng, T., Seoror, L.H., Adda, J., Factor, M., Darabi, R., Matschke, K.R., Fu, T., Lin, A., Maram, A., Sinha, A. (2026). Flowcode: An AI-Powered Programming Environment for Scaffolding Iteration in Creative Computing Education. https://arxiv.org/abs/2607.06721 doi:10.48550/arxiv.2607.06721

q2 · i? · design · r3

Lab study with 9 novice creative coders remixing CodePen Anime.js animations over 40-minute think-aloud sessions. The article reports 8/9 used the flowchart, 5/9 for orientation, and "Users clicked on nodes in the flowchart an average of 10.8 times (SD=6.8)."

"All but one user (8/9) utilized the flowchart during the study (by clicking on nodes or panning/zooming into the flowchart)."

Tseng 2026 (2)¶

Tseng, T., Seoror, L.H., Adda, J., Factor, M., Darabi, R., Matschke, K.R., Fu, T., Lin, A., Maram, A., Sinha, A. (2026). Flowcode: An AI-Powered Programming Environment for Scaffolding Iteration in Creative Computing Education. https://arxiv.org/abs/2607.06721. doi:10.48550/arxiv.2607.06721

q2 · i? · design · r2

Pilot workshop with 7 beginners in a 3-hour session building Anime.js animations. Thematic analysis of observations, Miro feedback, and logs showed the flowchart assisted "orientation" and that participants clicked nodes (4/7) or zoomed/panned (7/7) while working.

"Three of the seven participants began by clicking on nodes in the flowchart before prompting the LLM or editing the code."

Discussion¶

Related Claims¶

• Novice creative coders exhibited three distinct initial interaction patterns with Flowcode: flowchart-first, code-first, and prompt-first — related
• Automatically updating the flowchart and injecting generated code into editors drew participants away from explanations and toward direct code editing — related
• Participants used the Flowcode LLM across all stages of their design process, most frequently asking for code explanations — related
• Step-by-step explanations revealed one at a time, plus removed code auto-insertion and copy buttons, encouraged deeper engagement with generated explanations — related