Paradigm | object-oriented, educational, event-driven |
---|---|
Designed by | Brian Harvey and Jens Mönig |
Developer | Jens Mönig |
First appeared | 2011 |
Stable release | 10.4.5 / January 24, 2025 [1] |
Typing discipline | dynamic |
Implementation language | Morphic.js [2] (written in JavaScript); [Note 1] |
OS | Cross-platform |
License | AGPL |
Filename extensions | .xml (Snap!) |
Website | snap |
Influenced by | |
Scratch, Scheme, Logo, Smalltalk, APL | |
Influenced | |
BeetleBlocks, NetsBlox, Dragme IDE, Turtlestitch |
Snap! (formerly Build Your Own Blocks) is a free block-based educational graphical programming language and online community. Snap allows students to explore, create, and remix interactive animations, games, stories, and more, while learning about mathematical and computational ideas. While inspired by Scratch, Snap! has many advanced features. The Snap! editor, and programs created in it, are web applications that run in the browser (like Scratch) without requiring installation. [Note 2] It is built on top of Morphic.js, [2] a Morphic GUI, written by Jens Mönig as 'middle layer' between Snap! itself and 'bare' JavaScript.
In Snap!, the screen is organized in three resizable columns containing five regions: the block group selector (top of left column), the blocks palette (left column), the main area (middle column), and the stage area (top of right column) with the sprite selector (also called the sprite corral) showing sprite thumbnails below it. [Note 3]
In the interactively resizable stage area are shown the graphical results of the scripts running in the script area and/or interactively double-clicked individual blocks in any palette. Individual blocks can be dragged from the palette onto the scripts area to be associated with the selected sprite.
Category | Notes | Category | Notes | ||
---|---|---|---|---|---|
Motion | Moves and turns sprites | Control | If statements, events, loop structures, scenes, OOP, metaprogramming | ||
Looks | Controls visibility, costumes, and output | Sensing | All sprite hit detection and user input | ||
Sound | Plays audio files and programmable sequenced audio | Operators | Mathematical, text, and Boolean operators; lambda | ||
Pen | Write, draw, or stamp on stage | Variables | Variables, lists, including lists of lists, lists of blocks, etc |
Snap!'s blocks are divided into eight groups: Motion, Looks, Sound, Pen, Control, Sensing, Operators, and Variables. The layout of these groups in the block group selector is shown in the table below.
The central area can show scripts, costumes/backdrops, or sounds associated with the selected sprite. What that area shows depends on the selected tab.
The most important features that Snap! offers, but Scratch does not, include:
Alonzo, the mascot of Snap!, bears the name of Alonzo Church, the inventor of a model of computation in which a universal function, represented by lambda, can create any function behavior by calling it on itself in various combinations. The mascot is a modified version of Gobo from Scratch, with permission of the Scratch Team. Because Alonzo Church's work is called lambda calculus, the mascot's hair is shaped as the Greek letter lambda.
Extended sets of blocks can be found in Snap! libraries, such as the 'streams' library that enables one to make the complete, infinite Fibonacci sequence, for example, using the special blocks ('stream', 'show stream', 'tail of stream', and 'map ( ) over stream' block) from the library.
Many other libraries are available, such as the 'list utilities' library, the 'words, sentences' library, the 'iterations' library, the 'animation' library, the 'frequency distribution' library, the 'audio computation' library, the 'bar charts' library, the 'world map' library, the 'colors and crayons' library, the 'strings and multi-line input' library, the 'parallelization' library, etc. for other special purposes.
While the software itself has little restraints, it does have some limitations.
These include as follows:
The web-based Snap! and older desktop-based BYOB were both developed by Jens Mönig for Windows, OS X and Linux [3] with design ideas and documentation provided by Brian Harvey [4] from University of California, Berkeley and have been used to teach "The Beauty and Joy of Computing" introductory course in computer science (CS) for non-CS-major students. [5] Jens was a member of the Scratch Team before creating Snap!. [6] BYOB is still available for downloading.
The source code of Snap! is GNU Affero General Public License (AGPL) licensed and is hosted on GitHub. [7] The earlier, desktop-based 3.x version's code is available under a license that allows modification for only non-commercial uses and can be downloaded from the UC Berkeley website [8] or CNET's download.com and TechTracker download page. [9] [10]
Snap! runs on the major web-browsers on Windows, iOS, MacOS and Linux devices.
Supported web-browsers such as
Snap! is built on top of Morphic.js, [2] a Morphic GUI, which serves as 'middle layer' between Snap! itself and 'bare' JavaScript. It uses an HTML5 Canvas application programming interface (API).
All things visible in Snap! are morphs themselves, i.e. all buttons, sliders, dialog boxes, menus, entry fields, text rendering, blinking cursors etc. are created with morphic.js rather than using HTML DOM elements. Snap! caches the shapes of sprites so the sprite doesn't have to be re-drawn onto a new Canvas element every time the mouse moves over its bounding box. It does not cache blocks, however. Instead it manages the insides of C-shaped blocks through the morphic "holes" mechanism.
All user interaction is triggered by events, which are passed on from the root element "the world" to its submorphs. Dropping a morph causes it to become embedded in a new 'owner' ('parent') morph. In Morphic the preferred way to run an animation is to register it with the World by adding it to the World's animation queue. The World steps each registered animation once per display cycle independently of the Morphic stepping mechanism.
Snap! has been recognized by the Logo Foundation, [11] and reviewed in an online magazine for programmers. [12] As of December 2014, 100 New York City (NYC) high schools introduced University of California, Berkeley's “Beauty and Joy of Computing” as a new AP Computer Science Principles course, using Snap!. [13] Jens and Brian received the National Technology Leadership Summit (NTLS) 2020 Educational Leadership Award for lifetime achievement based in part on Snap!.
JavaScript, often abbreviated as JS, is a programming language and core technology of the Web, alongside HTML and CSS. 99% of websites use JavaScript on the client side for webpage behavior.
Morphic is an interface construction environment which uses graphical objects called "Morphs" for simplified GUI-building which allow for flexibility and dynamism. It was originally created for Self, but later, was ported to other programming languages like Squeak, JavaScript, Python, and Objective-C.
Greasemonkey is a userscript manager made available as a Mozilla Firefox extension. It enables users to install scripts that make on-the-fly changes to web page content after or before the page is loaded in the browser.
The Yahoo! User Interface Library (YUI) is a discontinued open-source JavaScript library for building richly interactive web applications using techniques such as Ajax, DHTML, and DOM scripting. YUI includes several cores CSS resources. It is available under a BSD License. Development on YUI began in 2005 and Yahoo! properties such as My Yahoo! and the Yahoo! front page began using YUI in the summer of that year. YUI was released for public use in February 2006. It was actively developed by a core team of Yahoo! engineers.
Scratch is a high-level, block-based visual programming language and website aimed primarily at children as an educational tool, with a target audience of ages 8 to 16. Users on the site can create projects on the website using a block-like interface. Scratch was conceived and designed through collaborative National Science Foundation grants awarded to Mitchel Resnick and Yasmin Kafai. Scratch is developed by the MIT Media Lab and has been translated into 70+ languages, being used in most parts of the world. Scratch is taught and used in after-school centers, schools, and colleges, as well as other public knowledge institutions. As of 15 February 2023, community statistics on the language's official website show more than 123 million projects shared by over 103 million users, and more than 95 million monthly website visits. Overall, over 1 billion total projects have been created, with the site reaching its 1,000,000,000th project in April 2024.
Brian Keith Harvey is a former Lecturer SOE of computer science at University of California, Berkeley. He and his students developed an educational programming language named UCBLogo which is free and open-source software, a dialect of the language Logo, as an interpreter, for learners. He now works on Snap!.
Node.js is a cross-platform, open-source JavaScript runtime environment that can run on Windows, Linux, Unix, macOS, and more. Node.js runs on the V8 JavaScript engine, and executes JavaScript code outside a web browser.
Cocos2d is an open-source game development framework for creating 2D games and other graphical software for iOS, Android, Windows, macOS, Linux, HarmonyOS, OpenHarmony and web platforms. It is written in C++ and provides bindings for various programming languages, including C++, C#, Lua, and JavaScript. The framework offers a wide range of features, including physics, particle systems, skeletal animations, tile maps, and others.
The Lively Kernel is an open-source web programming environment, developed by Dan Ingalls when he was at SAP Research. It supports desktop-style applications with rich graphics and direct manipulation abilities, but without the installation or upgrade troubles of conventional desktop applications. Development began at Sun Microsystems Laboratories in Menlo Park, California, and later moved to the Hasso Plattner Institute in Potsdam-Babelsberg near Berlin.
Amber Smalltalk, formerly named Jtalk, is an implementation of the programming language Smalltalk-80, that runs on the JavaScript runtime of a web browser. It is designed to enable client-side development using Smalltalk. The programming environment in Amber is named Helios.
Three.js is a cross-browser JavaScript library and application programming interface (API) used to create and display animated 3D computer graphics in a web browser using WebGL. The source code is hosted in a repository on GitHub.
PDF.js is a JavaScript library that renders Portable Document Format (PDF) files using the web standards-compliant HTML5 Canvas. The project is led by the Mozilla Corporation after Andreas Gal launched it in 2011.
There are different JavaScript charting libraries available. Below is a comparison of which features are available in each.
Blockly is a client-side library for the programming language JavaScript for creating block-based visual programming languages (VPLs) and editors. A project of Google, it is free and open-source software released under the Apache License 2.0. It typically runs in a web browser, and visually resembles the language Scratch.
Velocity is a cross-platform JavaScript library designed to simplify the client-side scripting of website animation. Velocity is free, open-source software licensed under the MIT License. It is the most popular open source web animation engine.
Vue.js is an open-source model–view–viewmodel front end JavaScript framework for building user interfaces and single-page applications. It was created by Evan You and is maintained by him and the rest of the active core team members.
Phaser is a 2D game framework used for making HTML5 games for desktop and mobile. It is free software developed by Photon Storm.
Next.js is an open-source web development framework created by the private company Vercel providing React-based web applications with server-side rendering and static rendering.
GDevelop is a 2D and 3D cross-platform, free and open-source game engine, which mainly focuses on creating PC and mobile games, as well as HTML5 games playable in the browser. Created by Florian Rival, a software engineer at Google, GDevelop is mainly aimed at non-programmers and game developers of all skillsets, employing event based visual programming similar to engines like Construct, Stencyl, and Tynker.
Turtlestitch is a free and open source platform for generating and sharing patterns for embroidery machines. Turtlestitch is derived from educational programming languages such as Logo, Scratch and Snap! using the same jigsaw style programming paradigm which offers simplicity suitable for novices but has powerful features, described as ‘low threshold, high ceiling’ by Seymour Papert. Its microworld is a turtle representing the needle of a programmable embroidery machine. Turtlestitch can be used for creating novel patterns for embroidery, combining the abstract logic of computing and the physical materiality of textiles. Its primary use is educational, as it offers a way of introducing programming to audiences with diverse interests. A growing gallery of open source embroidery designs enables community-based collaboration and shared learning. In 2017, Turtlestitch received the award for the best Open Educational Resource in the German-speaking countries.