[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"doc-detail-135508-en":3,"doc-seo-135508-105":31,"detail-sidebar-cat-0-en-105":84},{"code":4,"msg":5,"data":6},0,"success",{"doc_id":7,"user_id":8,"nickname":9,"user_avatar":10,"doc_module":4,"category_id":11,"category_name":12,"doc_title":13,"doc_description":14,"doc_content":15,"file_id":16,"file_url":17,"file_type":18,"file_size":19,"view_count":20,"is_deleted":4,"is_public":21,"is_downloadable":21,"audit_status":21,"page_count":22,"language":23,"language_code":24,"site_id":25,"html_lang":24,"table_of_contents":26,"faqs":27,"seo_title":28,"seo_description":14,"update_tm":29,"read_time":30},135508,1099525198933,"Terk","https://ap-avatar.wpscdn.com/davatar_155a257f0dc6eb9ab79c44ca47cae57d",6,"Technology","CodeToon: Story Ideation, Auto Comic Generation, and Structure Mapping for Code-Driven Storytelling","CodeToon presents a code-driven approach to authoring comics and coding strips for programming education. The work addresses the time-consuming creative burden of transforming code into stories and then stories into comics. It introduces two mechanisms: story ideation from code using metaphor and automatic comic generation from the story, supported by 1-to-1 structure mapping across code, story, and comic. A two-part user study evaluates both authoring support and comic quality, showing significantly shorter creation time while improving accuracy and usefulness.","CodeToon: Story Ideation, Auto Comic Generation, and Structure Mapping for Code-Driven Storytelling  \nSangho Suh, Jian Zhao, Edith Law  \nUniversity of Waterloo, Canada  \n{sangho.suh,jianzhao, [edith.law}@uwaterloo.ca](edith.law}@uwaterloo.ca)  \nFigure 1: CodeToon helps users create stories and comics from code. It uses 1-to-1 mapping to make connections clear across code, story, and comic. For example, as indicated by the dotted line, line 1 (code) maps to line 1 (story) and to row 1 (comic).  \nABSTRACT  \nRecent work demonstrated how we can design and use coding strips, a form of comic strips with corresponding code, to enhance teaching and learning in programming. However, creating coding strips is a creative, time-consuming process. Creators have to generate stories from code (code7→ story) and design comics from stories (story7→ comic) . We contribute CodeToon, a comic authoring tool that facilitates this code-driven storytelling process with two mechanisms: (1) story ideation from code using metaphor and (2) automatic comic generation from the story. We conducted a two-part user study that evaluates the tool and the comics generated by participants to test whether CodeToon facilitates the authoring process and helps generate quality comics. Our results show that CodeToon helps users create accurate, informative, and useful coding strips in a significantly shorter time. Overall, this work contributes methods and design guidelines for code-driven storytelling and opens up opportunities for using art to support computer science education.  \nPermission to make digital or hard copies of all or part of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. Copyrights for components of this work owned by others than the author(s) must be honored. Abstracting with credit is permitted. To copy otherwise, or republish, to post on servers or to redistribute to lists, requires prior specific permission [and/or a fee. Request permissions from permissions@acm.org](and/or a fee. Request permissions from permissions@acm.org).  \nUIST ’22, October 29-November 2, 2022, Bend, OR, USA  \n© 2022 Copyright held by the owner/author(s) . Publication rights licensed to ACM. ACM ISBN 978-1-4503-9320-1/22/10. . . $15.00  \n[https://doi.org/10.1145/3526113.3545617](https://doi.org/10.1145/3526113.3545617)  \nCCS CONCEPTS  \n• Human-centered computing → Interactive systems and tools.  \nKEYWORDS  \ncode-driven storytelling, comics, coding strip, authoring tool  \nACM Reference Format:  \nSangho Suh, Jian Zhao, Edith Law. 2022. CodeToon: Story Ideation, Auto Comic Generation, and Structure Mapping for Code-Driven Storytelling. In The 35th Annual ACM Symposium on User Interface Software and Technology (UIST ’22), October 29-November 2, 2022, Bend, OR, USA. ACM, New York, NY, USA, 16 pages. [https://doi.org/10.1145/3526113.3545617](https://doi.org/10.1145/3526113.3545617)  \n1 INTRODUCTION  \n“Computer science is a field that attracts a different kind of thinker. . . they are individuals who can rapidly change levels of abstraction, simultaneously seeing things ‘in the large’ and ‘in the small’.” [19]  \nLearning programming is difficult due to its abstract nature [38]: it requires learning concepts and programming languages that have been derived through a series of abstractions. Specifically, learning with text-based programming languages poses a barrier for novice learners [20, 32], as text-based programming languages rely on symbolic representations that use a set of seemingly arbitrary rules and abstract expressions. The compact syntax and notations are useful for specifying precise operations but not for communicating to learners the underlying computational ideas intuitively, unlike  \nUIST ’22, October 29-November 2, 2022, Bend, OR, USA Sangho Suh, Jian Zhao, Edith Law  \npictorial or visual repre","cbCaigY1tYn1xf9l","https://ap.wps.com/l/cbCaigY1tYn1xf9l","pdf",17677190,3,1,16,"English","en",105,"# Introduction\n## Background: programming abstraction and learning barriers\n## Coding strips and their educational value\n## The creation challenge and the proposed CodeToon approach","[{\"question\":\"What did the user study evaluate and what were the results?\",\"answer\":\"The study assessed whether CodeToon facilitates authoring and whether the generated comics are high quality. Results indicate significantly shorter time and creation of accurate, informative, and useful coding strips.\"}]","CodeToon: Story Ideation, Auto Comic Generation, and Structure Mapping for Code-Driven Storytelling | PDF",1787313737,40,{"code":4,"msg":32,"data":33},"ok",{"site_id":25,"language":24,"slug":34,"title":13,"keywords":35,"description":14,"schema_data":36,"social_meta":79,"head_meta":81,"extra_data":83,"updated_unix":29},"codetoon-story-ideation-auto-comic-generation-and-structure-mapping-for-code-driven-storytelling","",{"@graph":37,"@context":78},[38,54,69],{"@type":39,"itemListElement":40},"BreadcrumbList",[41,45,49,51],{"item":42,"name":43,"@type":44,"position":21},"https://docshare.wps.com","Home","ListItem",{"item":46,"name":47,"@type":44,"position":48},"https://docshare.wps.com/document/","Document",2,{"item":50,"name":12,"@type":44,"position":20},"https://docshare.wps.com/document/technology/",{"item":52,"name":13,"@type":44,"position":53},"https://docshare.wps.com/document/codetoon-story-ideation-auto-comic-generation-and-structure-mapping-for-code-driven-storytelling/135508/",4,{"url":52,"name":13,"@type":55,"author":56,"headline":13,"publisher":58,"fileFormat":61,"inLanguage":24,"description":14,"dateModified":62,"datePublished":63,"encodingFormat":61,"isAccessibleForFree":64,"interactionStatistic":65},"DigitalDocument",{"name":9,"@type":57},"Person",{"url":42,"name":59,"@type":60},"DocShare","Organization","application/pdf","2026-08-25","2026-08-21",true,{"@type":66,"interactionType":67,"userInteractionCount":20},"InteractionCounter",{"@type":68},"ViewAction",{"@type":70,"mainEntity":71},"FAQPage",[72],{"name":73,"@type":74,"acceptedAnswer":75},"What did the user study evaluate and what were the results?","Question",{"text":76,"@type":77},"The study assessed whether CodeToon facilitates authoring and whether the generated comics are high quality. Results indicate significantly shorter time and creation of accurate, informative, and useful coding strips.","Answer","https://schema.org",{"og:url":52,"og:type":80,"og:title":13,"og:site_name":59,"og:description":14},"article",{"robots":82,"canonical":52},"index,follow",{"doc_id":7,"site_id":25},{"code":4,"msg":5,"data":85},[86,90,94,98,103,106,110,115,120,123,127],{"id":21,"doc_module":4,"doc_module_name":47,"category_name":87,"show_sort_weight":88,"slug":89},"Story & Novel",90,"story-novel",{"id":48,"doc_module":4,"doc_module_name":47,"category_name":91,"show_sort_weight":92,"slug":93},"Literature",80,"literature",{"id":53,"doc_module":4,"doc_module_name":47,"category_name":95,"show_sort_weight":96,"slug":97},"Exam",70,"exam",{"id":99,"doc_module":4,"doc_module_name":47,"category_name":100,"show_sort_weight":101,"slug":102},5,"Comic",60,"comic",{"id":11,"doc_module":4,"doc_module_name":47,"category_name":12,"show_sort_weight":104,"slug":105},50,"technology",{"id":107,"doc_module":4,"doc_module_name":47,"category_name":108,"show_sort_weight":30,"slug":109},7,"Healthcare","healthcare",{"id":111,"doc_module":4,"doc_module_name":47,"category_name":112,"show_sort_weight":113,"slug":114},8,"Research & Report",30,"research-report",{"id":116,"doc_module":4,"doc_module_name":47,"category_name":117,"show_sort_weight":118,"slug":119},9,"Religion & Spirituality",20,"religion-spirituality",{"id":118,"doc_module":4,"doc_module_name":47,"category_name":121,"show_sort_weight":118,"slug":122},"World Cup","world-cup",{"id":124,"doc_module":4,"doc_module_name":47,"category_name":125,"show_sort_weight":124,"slug":126},10,"Lifestyle","lifestyle",{"id":128,"doc_module":4,"doc_module_name":47,"category_name":129,"show_sort_weight":99,"slug":130},19,"General","general"]