MET:Engaging Community In Visual Programming Spaces

From UBC Wiki

This page is originally authored by Pamela Jones and Kirsten Ng. 2013W2

"If it were possible to define generally the mission of education, one could say that its fundamental purpose is to ensure that all students benefit from learning in ways that allow them to participate fully in public, community, and economic life. Literacy pedagogy is expected to play a particularly important role in fulfilling this mission."[1]

The recent movement to promote coding in the K-12 setting has been facilitated by engaging communities of practice in visual programming spaces. The online communities surrounding Scratch, and other visual programming languages, encourage participants to connect with ideas in computational thinking, to connect with their interests and to connect with people in the development of interactive media.[2] These constructionist online spaces afford participants the ability to engage with others critically and creatively during the iterative design process, thus allowing participants to build original and remixed interactive media.[3]


Constructionism and programming

Seymour Papert introduced educators to Constructionism and constructionist principles and the notion of learning to play and to problem solve via the use of an object-to-think-with. Papert focuses especially on the advantages for learning to be gained when “the learner is consciously engaged in constructing a public entity.”[4] Rightfully, these principles were the reason that computer programming curriculum was first developed and taught in schools. Providing students with the tool (a programming language) which manipulated a specific, observable object (the turtle graphic), links together the concepts of Constructionism and learning to code. Further, “the idea that knowledge is represented in a public entity foreshadows the social as well as the cultural dimensions of Constructionist learning and their application to learning programming.” [5]

The move away from programming

Despite an initial commitment to teaching programming in public schools, efforts waned. Four factors have been identified why this occurred. Early programming languages were text-based and difficult to grasp semantically and syntactically. Programming as an activity, or curriculum, was not connected to the interests of the students learning to code, nor were samples or examples readily available to inspire and motivate student programming. Finally, there was a lack of expertise and appropriate guidance in K-12 programming settings. This manifested as educators unable to correct or explain coding adequately to novice programmers, who were also left without opportunities to explore programming beyond the parameters of the specific activity.[6] These four disadvantages to teaching and learning coding have been neutralized both by the appearance of visual programming languages and the online communities which support them.

The social turn in K-12 programming

Given the strong rationale for incorporating student interests in learning and the ease of connecting with others afforded by the web, Kafai and Burke point out that computer programming has had a resurgence made possible by what they describe as a 'social turn'. This is “a shift in the field in which learning to code has shifted from being a predominantly individualistic and tool-oriented approach to now one that is decidedly sociologically and culturally grounded in the creation and sharing of digital media.”[5] The social turn can be broken down into three paradigm shifts which allow online programming communities to thrive. There has been a shift 1) from writing code to creating applications with code, 2) from programming tools to building communities and 3) from focusing on entirely original work to now valuing the knowledge-building practice of mixing and remixing.[5]

Visual programming

Rationale for teaching coding

Daniel Rushkoff, in his book Program or Be Programmed: Ten Commands for a Digital Age [7], asserts that “we must learn how to make software, or risk becoming the software.” He identifies ten aspects of society which are impacted by the varying biases built into computer programs. When a person does not understand the premise, principles and problems associated with biases in coding, they leave themselves vulnerable to being manipulated by those with the knowledge, or power, to write computer programs. To that end, students today should understand coding and have the opportunity to gain the critical and creative thinking skills offered by learning to program.

Affordances of visual programming

Learning to code is undoubtedly an emerging, although difficult, digital literacy. Visual programming languages were developed in an effort to lower the barrier to entry into computer programming. With graphical blocks that can seemingly be physically dragged, dropped and locked together, visual programming languages allow students to begin to learn to program with greater ease.

The advantages of using a visual programming language include the absence of syntax errors, the visual confirmation of possibilities from blocks appearing to physically fit together and the connection to natural language in the prose-like appearance of the code. On the downside are the monotony and repetitiveness of dragging and dropping multiple blocks, the difficulty of sharing and reusing fragments of code and the generalization that visual programming languages do not typically include as many functions as complete text-based languages. [8]

Participating in visual programming spaces

According to the 2007 report Teens creating content by the Pew Research Center's Internet & American Life Project, more than nine in ten Americans between the ages of 12 and 17 are internet users, as of November 2006 and nearly two-thirds of online teens are actively creating content.[9]For the most part, these teens are involved in what educators like Henry Jenkins called "participatory culture".[10]Jenkins et al. argue that participatory culture shifts the focus of literacy from one of individual expression to community involvement, affording informal mentorship and fostering a sense of empowerment that comes from adding value to the community.

The new literacies almost always involve social skills developed through sharing and collaboration. Brennan, Resnick and Monroy-Hernandez identified that participation in online communities afforded participants opportunities to imagine, to design and to share interactive media.[11] Brennan and Resnick elaborated this list of affordances and evolved it further into an iterative design process for interactive media. Thus, participation in online visual programming communities can be observed as imagining, creating, playing, sharing and reflecting about interactive media projects.[3]By participating in a community, a member is supported across the entire iterative design process. Listed below are the ways in which an online visual programming community can improve each stage of the design cycle.


In an online community with a cloud storage-based repository of projects, demonstrations, tutorials and myriad other interactive media, participants have the opportunity to examine the work of others and in turn be inspired to imagine possibilities for their own endeavours.


In a community such as Scratch online, where more than 15% of projects are remixed versions of what came before, access to the work of others makes it simpler and easier for a novice participant to create original programs from the ground up, or to extend or modify another participant's program, personalized or changed as they see fit.[3] Additionally, many community forums enable participants to work directly to create group projects. This helps the individual programmer to work with others who might be more capable or skilled in different areas and to learn from them.


The visual nature of programming languages such as Scratch and Tynker allow the user to manipulate the code in order to successfully create what they had in mind. Playing is afforded by the easy nature of dragging and dropping blocks, making interesting and novel changes, and testing code for immediate feedback. If a designer gets stuck, or feels unable to solve a problem, again, he or she can consult the work of others. Conversely, a participant can test the work of others and provide feedback in an effort to help them improve their work.


Sharing projects demonstrates that participants are "situated in and supported by a community of practice that connects them to other people, resources, routines and goals.”[11] Community members share projects with one another by making their personal projects publicly available for others to investigate.


Finally, as a programmer steps back to evaluate the success of a particular code, ideally with feedback, in the form of comments from the community, they engage in reflection about the effectiveness of their design and its place in the online community.

We shall look at the design and community affordances in each of these visual programming spaces: Scratch, Tynker and Mozilla Webmaker.



Scratch is a visual web-based programming environment developed by the Lifelong Kindergarten group at the Massachusetts Institute of Technology (MIT) Media Laboratory. The name "Scratch" comes from the scratching technique of hip-hop disc jockeys who tinker with music by spinning vinyl records and mixing music clips in creative ways.[12] The Scratch software and website were publicly launched in 2007. Young people between the ages of 8 and 16 form the bulk of the user community.

Design principles

Like Papert's LOGO, Scratch is based on constructionism. The developers of Scratch established three core design principles for Scratch. They wanted to make it more tinkerable, more meaningful and more social than other programming environments so that people with different interests and learning styles can develop computational thinking.[12] Its visual programming environment in a single-window user interface makes navigation easy. Scripting is done from bottom-up, by assembling small chunks of codes.[13] Many Scratchers see programming as a way to express what is personally meaningful to them, creating a wide range of projects including animated stories, games, news shows, greeting cards, music videos, science projects, tutorials and simulations. Many of them are based on real-world issues that they care about, such as global warming and animal abuse.

Interface.png Scratch interface

The Scratch community

A key feature of Scratch is its vibrant online community where users collaborate with one another, critiquing and building on one another’s work.

Sharing and remixing Sharing and remixing is encouraged in the Scratch programming space. It has a prominent Share icon for users to upload their projects so that others can post comments, vote by clicking the “Love it” button and remix the script. All projects are covered by Creative Commons license. To date, close to five million projects have been shared on the site. When someone remixes a project, the website automatically adds a link to the original project. From an educational design perspective, this is significant since it instils in young people the mindset of giving the original creator credit where credit is due.

Collaborative projects and tutorials The Scratch website is ideal for teaching young people how to work together on projects. It provides guidance from coming up with a name for the collaboration, advertising and recruiting members, to communicating on the collaboration forum and assigning roles to members based on expertise. Many Scratchers have formed “companies,” working together to create projects that leverage the unique strengths of individual members. Others have created tutorials to help their peers.

File:Scratchcollaborate.png Request for collaboration

File:Stutorials.png Peer tutorials on Scratch

Global community To encourage international sharing and collaboration, Scratch developers with the help of volunteers have translated the programming blocks into more than 40 languages. Scratchers around the world can now share projects with one another, each viewing the codes in their own languages.


Scratch is designed with learning and education in mind. Launched in July 2009, ScratchEd is an online community where more than 7500 Scratch educators from around the world share resources and engage in discussions and collaborative projects.



Designed by Silicon Valley technologists, Tynker is a relatively new browser-based coding program that uses Open Web standards such as Javascript, HTML5 and CSS3. Tynker's interface is inspired by Scratch and adopts the same visual, drag-and-drop approach to coding. Like Scratch, its Web 2.0 environment actively engages learners' interests, nurtures creative tinkering and promotes participation in communities of learning.

Designed for K-12 classrooms

The Tynker learning platform is designed for educators to teach computer programming skills in K-12 classroom settings. Its educator-friendly platform comes with grade-appropriate lesson plans and activities designed to support and enhance core curriculum standards, classroom management tools and an online showcase of student-created projects. Tynker enables students to participate in communities of learning through discovery, collaborative activities and creative experimentation. Tynker lessons are guided and self-paced, with a built-in tutor that guides the students towards creating projects on what interests them. As Losh and Jenkins point out, young people need mentorship to help them meaningfully connect learning activities to what they are passionate about: "Many young people lack the background to know how to find the space online that would be most rewarding for them".[14] The dashboard allows teachers to track students' learning as they progress from fundamental computing concepts to traditional programming syntax. This constructionist approach, encouraging greater student autonomy in exploring and remixing, and providing appropriate scaffolding, helps foster creative thinking and problem-solving skills.

Engaging community

Like Scratch, a key design functionality of Tynker is the ability to share creations with the online community. One difference is that Tynker allows teachers to facilitate all sharing aspects. Teachers can have the students publish their best creations onto their class showcase and share them with parents and friends via email, Google+, Twitter and Facebook. This can be motivating and rewarding for students as they are adding value to the site by their active participation and creative projects. Besides formal classes, Tynker is used to enhance community-based learning in lunchtime and after-school coding clubs and summer camps. Tynker was a curriculum provider for the 2013 Hour of Code, an initiative by CSEdWeek and that aimed to introduce computer programming to millions of students nationwide in the United States, creating opportunities for them to form connections with communities of practice.

Mozilla Webmaker


Mozilla launched Mozilla Webmaker in June 2012 with the goal of getting millions of people around the world to move beyond passively using the Web to actively building it.[15] It is an open source project that brings together organizations, maker, mentors and community leaders.

The Webmaker program comes with intuitive and visual tools like X-Ray Goggles, Mozilla Thimble and Popcorn Maker that offer a playful and easy way for anyone to learn HTML, CSS and Java codes by writing or remixing webpages and share their finished projects. Describing the Web as "the world's second language, and a vital 21st century skill", Mozilla's executive director Mark Surman said that "digital literacy is as important as reading, writing and arithmetic"[16], adding that the Webmaker program underscored Mozilla's commitment to the maker spirit and open ethos.

Building virtual and physical communities

Mozilla's rationale for teaching people to code is simple: It is only when we understand the underlying structure, or the building blocks of the web that we can have a hand in shaping its future together. Mozilla's software designer Jessica Klein who created the Hackasaurus project, the predecessor of the Webmaker platform, aptly described the Web as a "handcrafted community", a canvas where individuals build webpages to share their stories with the global community.[17] Klein learned how important collaborative webmaking skills are in building and strengthening community in a personal way. When Hurricane Sandy hit New York in November 2012, she launched a website to mobilize relief volunteers with diverse digital expertise to rebuild Rockaway, the community that she grew up in.

In line with Mozilla's philosophy, the Webmaker program does not simply provide tools. It provides projects and community as well, with starter how-to projects and event kits to help people make and learn codes at free local events, meet-ups and hack jams around the world. As Gee argues, these informal learning spaces are "affinity spaces" in popular culture which engage young people in peer-to-peer activities and motivate them to acquire new knowledge so that they can become experts.[18]Recognizing that innovation can come from anywhere and anyone, Mozilla Webmaker offers ways to get involved - create web literacy resources and projects, mentor learners, contribute code and ideas - and challenges individuals to share content and become part of the global conversation on the Web.


The affordances of coding programs like Scratch, Tynker and Webmaker support creativity and innovation in formal and informal learning environments. But participating in online spaces is not without risks. This is where educators can facilitate students' meaningful engagement with the community. They can help young people develop ethical standards and skills in critical judgment and cultivate online social relationships as they share and remix one another's projects. These skills are critical to cybercitizenship. As Losh and Jenkins put it: “Young people may not need adults snooping over their shoulders, but they certainly need adults helping to watch their backs”.[10]

By connecting people and ideas, visual programming spaces change the way young people express themselves and give them an appreciation for the work created by others. As young people dabble with codes, they gain mastery of traditional literacy skills, technical skills and critical analysis skills. More than that, they gain the media literacy skills they need to understand, shape and actively participate in the community. As educators, we have opportunities to promote openness and a participatory culture where young people can learn and grow in. Coding is a step in that direction.

See also

Other programming tools that include online communities for young people to share, comment and contribute to coding projects:

Alice - The Alice project provides tools and materials to support the creation of 3D animations. It is suited for older children with some coding skills and who can adopt a more rigorous approach to programming. The Alice community forum provides technical support, updates and curriculum resources.

Gamestar Mechanic - Gamestar Mechanic is a game-based digital learning platform geared at 4th to 9th grade students. It is designed to teach computational thinking and problem-solving through game creation. It supports a teacher community via Edmodo and social media.

Kodu Game Lab - Introduced in 2009 by Microsoft, Kodu is a visual programming language that is so user-friendly that users with no design or programming skills can create games on the PC and Xbox. The community of Kodu users can find help and support in the Kodu Forum.

In this keynote address, Sherry Turkle and Henry Jenkins explore how engaging with new technologies change the ways young people think about themselves, relate to others, and participate in communities:

Scratch@MIT keynote: Rethinking identity, rethinking participation


  1. The New London Group. (1996). A pedagogy of multiliteracies: Designing social futures. Harvard Educational Review, 66(1), 60-92.
  2. Brennan, K., & Resnick, M. (2013). Stories from the scratch community: Connecting with ideas, interests, and people. SIGCSE '13: Proceeding of the 44th ACM Technical Symposium on Computer Science Education, 463-464. doi:10.1145/2445196.2445336
  3. 3.0 3.1 3.2 Brennan, K. & Resnick, M. (2013). Imagining, creating, playing, sharing, reflecting: How online community supports young people as designers of interactive media. In C. Mouza & N. Lavigne (Eds.), Emerging technologies for the classroom: A learning sciences perspective (pp.253-268). New York, NY: Springer.
  4. Harel, I. and Papert, S. (1991). Situating constructionism. Retrieved from
  5. 5.0 5.1 5.2 Kafai, Y. B., & Burke, Q. (2013). The social turn in K-12 programming: Moving from computational thinking to computational participation. SIGCSE '13: Proceeding of the 44th ACM Technical Symposium on Computer Science Education, 603-608. doi: 10.1145/2445196.2445373
  6. Resnick, M., Flanagan, M., Kelleher, C., MacLaurin, M., Ohshima, Y., Perlin, K., & Torres, R. (2009). Growing up programming: Democratizing the creation of dynamic, interactive media. 3293-3296. doi:10.1145/1520340.1520472
  7. Rushkoff, D., & Purvis, L. (2011). Program or be programmed: Ten commands for a digital age. Berkeley, CA: Soft Skull Press.
  8. Figg, T.E. (2014, February 17). Programming with building blocks. Retrieved Feb. 24, 2012, from
  9. Lenhart, A., Madden, M., Smith, A., & MacGill, A. (2007). Teens creating content. Retrieved from
  10. 10.0 10.1 Jenkins, H., Clinton, K., Purushotma, R., Robison, A. J., & Weigel, M. (2010). Confronting the challenges of participatory culture: Media education for the 21st century. Retrieved from
  11. 11.0 11.1 Brennan, K., Monroy-Hernández, A., & Resnick, M. (2010). Making projects, making friends: Online community as catalyst for interactive media creation. New Directions for Youth Development, 128", 75-83. doi:10.1002/yd.377
  12. 12.0 12.1 Resnick, M., Maloney, J., Hernandez, A. M., Rusk, N., Eastmond, E., Brennan, A. M.,...Kafai, Y. (2009). Scratch: Programming for all. Communications of the ACM, 52(11), 60-67. doi: 10.1145/1592761.1592779
  13. Maloney, J., Resnick, M., Rusk, N., Silverman, B., & Eastmon, E. (2010). The Scratch programming language and environment. ACM Transactions on Computing Education, 10(4), 1-15. doi: 10.1145/1868358.1868363
  14. Losh, E., & Jenkins, H. (2012). Participatory culture and learning. Knowledge Quest, 41(1), 17-21.
  15. Taft, D. K. (2012, June 18). Mozilla Thimble makes coding easy. Retrieved from
  16. Taft, D. K. (2012, May 22). Mozilla Webmaker aims to turn web users into coders. Retrieved from
  17. Klein, J. (2014). Learn to code: It's a life skill. Young Adult Library Services, 12(2), 25-27.
  18. Gee, J. P. (2009). Affinity spaces: From Age of Mythology to today's schools. Retrieved from