Table of Contents
[hemmerling] Rapid Software Application and GUI Prototyping 2/3 - Building Blocks
Related pages:
Events
-
- “Kostenloses Unterrichtsmaterial zu Programmierung und digitalen Themen”.
- “App Summer Camp” in Hamburg, for pupils of 13 years or older, 2018-07-25 - 2018-07-27.
Alice
-
- “Alice is an innovative block-based programming environment that makes it easy to create animations, build interactive narratives, or program simple games in 3D. Unlike many of the puzzle-based coding applications Alice motivates learning through creative exploration. Alice is designed to teach logical and computational thinking skills, fundamental principles of programming and to be a first exposure to object-oriented programming. The Alice Project provides supplemental tools and materials for teaching using Alice across a spectrum of ages and subject matter with proven benefits in engaging and retaining diverse and underserved groups in computer science education”.
- Alice is a Java application.
- No free online service, but download offer of executables for Windows, Linux, MacOSX.
BloP
- Google "blocklanguages" - ”'BloP', a development environment for block languages”.
- blockC (v1.0).
- Animated Sort Language (v.1.0.2).
- blockLogo (v1.0),
Code.org - App Lab
-
- Code.org "App Lab" - “App Lab is a programming environment where you can make simple apps. Design an app, code in JavaScript with either blocks or text, then share your app in seconds”.
- Code.org "App Lab" - New Project - Editor.
CoSpaces Edu
- The commercial online service CoSpaces Edu with free basic plan
.- “Make AR & VR in the classroom”.
- You can register as “teacher” and as “student”, I suggest to register as “teacher”.
Kahoot!
- The commercial Kahoot! with some free plans.
- “Choose your account type - Teacher, Student, Private, Professional”.
- I registered as “Professional”, by my own fault
.- Don't register as “Professional”, as there is no free plan, and “Host kahoots for up to 20 players”, which is unwanted for single players .
- Result:: “We noticed you were so close to signing up and accessing e-learning features that engage remote workers! Kahoot! Basic You can get started for free by signing up for Kahoot! Basic. You don’t even need a credit card. Just click Continue for free, and you’ll access a free plan with basic e-learning features. With Kahoot! Basic, you can”:
- Help remote teams stay connected by playing ready-made trivia games with up to 10 players.
- Create and play self-paced e-learning challenges with up to 10 colleagues.
- Create and host live games for up to 3 colleagues.
- Kahoot! "Schools / Plans" - Free plan “Basic”.
- Kahoot! Creator - The online editor.
MIT App Inventor ( for Android )
NEPO by Open Roberta
Software
- Open Roberta, Roberta Initative - “Lernen mit Robotern – Spielerisch programmieren lernen”.
- Online IDE Open Roberta Lab.
- Calliope.
- Calliope 2017beta.
- Calliope 2016.
- Open Roberta Sim.
- EV3
- EV3 leJOS 0.9.1beta.
- EV3 leJOS 0.9.0beta.
- EV3dev
LEGO Mindstorms
Calliope
Hardware & Software & Training
-
-
- “Calliope mini – Batterieverbindung”.
- “Erste Schritte mit dem Calliope mini”.
- “Cornelsen: Arbeitsheft für den Calliope mini” ( “Coden mit dem Calliope mini – Programmieren in der Grundschule” ).
- “Cornelsen: Material für Lehrkräfte zum Calliope mini”.
- “Landesinstitut für Pädagogik und Medien Saarland: Lernkarten und Videos”.
- “App Camps: Calliope mini Kurs”.
- “Code your Life – Wetterstation mit dem Calliope mini”.
- “Wissensfabrik: Schulmaterial für Calliope mini (IT2School)”.
-
- “Im Rahmen des Zukunftswerkstatt - Projekts fördert Google im Jahr 2017 Trainings für bis zu 500 Lehrkräfte, die einen kostenfreien Einblick in das langjährig bewährte Roberta - Konzept des Fraunhofer IAIS erhalten”.
-
- “Didaktik der Informatik Bergische Universität Wuppertal: Handreichung für Lehrkräfte”.
- “Didaktik der Informatik Bergische Universität Wuppertal: Informatiksystem für Schülerhände”.
-
fischertechnik Calliope
Literature
- If necessary, please check before buying, whether a book uses the “Building Blocks” programming language approach of OpenRoberta, or the more advanced “C” programming approach.
- “Coden mit dem Calliope mini. Programmieren in der Grundschule. Lehrmaterial für den Einsatz ab Klasse 3”.
Resources
Pocket Code
Scratch
Software
- Massachusetts Institute of Technology "Scratch" - “Imagine, Program, Share”.
- Online IDE by Internet browser Massachusetts Institute of Technology "Scratch", Online IDE - Requires “Adobe Flash” plugin, as of 2018-02.
- Massachusetts Institute of Technology "My Stuff" - Repository of your own private projects.
- The “My Stuff” page lists all private and public projects.
- Each project has its own project page.
- Project owners ( who own the account by which the project was created and uploaded to the Snap! cloud ) may share and unshare projects.
- A shared project has a valid global project page URL ( e.g. “http://scratch.mit.edu/projects/xxxxxxxxx/”, while “xxxxxxxxx” is the project number ), which is visible in the Internet.
- Private projects have a valud project URL just for the project owner.
- From the project page, you may edit a project by the button “See inside”.
- From the Scratch editor, you may switch to the project page by the button “See project page”.
- Shared projects may be loaded in the Scratch! editor by anybody ( even without beeing logged in at Scratch ).
- User experience ( UX ):
- You may run Scratch applications in a fullscreen mode by the #fullscreen tag, e.g. “http://scratch.mit.edu/projects/xxxxxxxxx/#fullscreen”. But any user may switch to edit mode.
- So there is no “Execution URL”, by which the application may just be started. So a Scratch application may not be experienced as a true “standalone Internet service application”.
Scratch 3.0
- Scratch 3.0 GUI ( Beta ) - Login.
- Einstieg Informatik "Preview von Scratch 3.0 erschienen!" - “Das endgültige Veröffentlichungsdatum für die Online-Version von Scratch 3.0 ist für August 2018 festgelegt”.
- Experts told me, that Scratch 3.0 will feature:
- HTML5 instaed of Flash Interface.
- Many plugins, e.g. the Arduino plugin, will be included in the standard edition.
Literature
- A series of free PDF Books.
- Harvard University "ScratchEd" - “An online community where Scratch educators”.
-
-
-
- “The original guide, for educators” ( PDF ).
- “A workbook version, for learners” ( PDF ).
- “Editable versions, for teachers and translators” ( PDF ).
-
-
-
-
Videos
Scratch Extensions
Online Service
-
- “Open Extension File”.
- “Open Extension URL”.
Scratch Extensions Browser Plugin
Resources
Resources
- Heiko Idensen.
-
- Scratch.
- Pocket Code.
-
- “An online community where Scratch educators”.
- “Your application for an account is currently being reviewed. Any account applications that are not from teachers/educators will not be approved”.
- Wiki Scratch Wiki ( formerly at Scratch Wiki ).
-
Snap!
The online Tools
Snap!
-
- University of California, Berkeley "Snap!" - License - “SNAP is distributed under the BSD license” = Open Source Initiative (OSI) "The 3-Clause BSD License".
- Online IDE by Internet browser University of California, Berkeley "Snap!", Online IDE, University of California, Berkeley "Snap!", Online IDE, Plain HTML5/Javascript implementation.
-
- Project owners ( who own the account by which the project was created and uploaded to the Snap! cloud ) may share and unshare projects.
- Shared projects may be executed by anybody. But just the project owner may load the project the Snap! editor.
- User experience ( UX ): There is an “Execution URL”, by which shared projects may just be started but not edited. So a Snap! application may be experienced as a true “standalone Internet service application”.
Additional Online IDEs
- Online IDE by Internet browser Snap4Arduino.
- Online IDE by Internet browser NetsBlox - Innovative Learning.
Scratch to Snap!, a free Online Service
- Free online service GitHub.io "Snapin8r2 - Scratch to Snap!.
Snapp - Generator for standalone Executables, a free Online Service
- Turn your project into a standalone executable! First “Export project” and save the resulting XML file. Then go to
- Snapp - “A tool that generates standalone executables from Snap projects”, target Win32, Win64, Linux32, Linux64, MacOSX32, MacOSX64.
Developers & Downloads
-
- YouTube "Brian Harvey" - 2 single videos about Snap!.
-
- Online IDE by Internet browser University of California, Berkeley "Snap!", Online IDE, University of California, Berkeley "Snap!", Online IDE - To download the current “Snap!” sourcecode as ZIP file, please click on “Snap!” icon at the left upper corner of your browser scren, and select “Download source”.
Education, Training
-
-
-
- Michael Brenner "Programmieren mit Snap!" ( PDF ) #.
-
-
- Quadrat.
- Nikolaus.
- Variablen.
- Rekursion.
- Animation.
- Listen und Lambdas.
- WHILE, FOR.
-
-
-
-
- “NetsBlox is a visual programming language and cloud-based environment that enables novice programmers to create networked programs such as multi-player games. Its visual notation is based on Scratch and it uses the open source JavaScript code base of Snap! NetsBlox opens up the internet with its vast array of public domain scientific and other data sources making it possible to create STEM projects, such as displaying seismic activity anywhere on Earth using an interactive Google Maps background. Similarly, weather, air pollution, and many other data sources such as the Open Movie Database and the Sloan Digital Sky Server are available. NetsBlox supports collaborative program editing similar to how Google Docs work”.
- Online IDE by Internet browser NetsBlox - Innovative Learning.
-
- University of California, Berkeley "Beauty and Joy of Computing", Table of Contents, 2015-2016 - “THIS IS THE STATIC SEPT 2015 VERSION!”.
-
-
-
-
Videos
My own "Snap!" Project
-
- Online runtime version of the application. Run the application by loading the URL in your browser!
Some other Tools and Frameworks
Snap Extensions
Snap4Arduino
-
- GitHub "bromagosa/Snap4Arduino" - “Binding Snap! and Arduino together”.
-
Snap Apps
-
- “programming = algorithm design + coding variables. conditionals. custom blocks. data types. parameters. iteration. recursion”.
- “Snap Apps are open source extensions to Snap! from UC Berkeley for teaching introductory computer science at high school and university”.
Monash BlockBooks
- Monash University, Faculty of Information Technology "Monash BlockBooks", Monash University, Faculty of Information Technology "Monash BlockBooks".
- “Generative Art with Scribble” ( PDF ).
- “Simulation with Cellular” ( PDF ).
- “Robotics with Enchanting and LEGO NXT” ( PDF ).
Tools
- GitHub "Snap! Cloud " - “DEPRECATED – A prototype Rails-based cloud service for Snap!”.
- GtHub "c2stem/snap-cloud" - “A standalone cloud server for Snap”.
Tips & Tricks
- Saving of project in the browser by “File / Browser / Save as” is limited.
- Error message “Save failed:NS_ERROR_DOM_QUOTA_REACHED: Persistent storage maximum size reached”, with a project size of 5182 kBytes.
- Saving a project in the cloud by “File / Browser / Save as / Cloud / Save” saves it as private project.
- You may load and execute the project by “http://snap.berkeley.edu/snapsource/snap.html#present:Username=USERNAME&ProjectName=PROJECTNAME”, e.g. http://snap.berkeley.edu/snapsource/snap.html#present:Username=hemmerling&ProjectName=kamification.
- You may load and edit the project by “http://snap.berkeley.edu/snapsource/snap.html#edit:Username=USERNAME&ProjectName=PROJECTNAME”, e.g. http://snap.berkeley.edu/snapsource/snap.html#edit:Username=hemmerling&ProjectName=kamification.
- If somebody else than the original private uploader tries to load the project - even if she/he knows the URL -, there is the error message “Could not fetch project karnification. This project is not public”.
- To transform the private project into a public project, please execute “File / Save as / Cloud / Share”.
- At any time, you may turn the project in a private project again, by executing.
- “File / Save as / Cloud / UnShare”.
- “File / Open / Cloud / UnShare”.
- If you look for the “FOR” loop, ect:
- Scratch Forum, "Snap!" Thread, #3793 of 2018-04-05 - “In the Snap! menu bar, in the file menu, choose “Import tools” and that will get you FOR and a bunch of other things used in the manual. Since these are written in Snap! itself, you can edit them to learn how they're written”.
- If you want to build HTML-alike pages, where you may move from one page to another, by selecting a menu item, i.e. by a mouseclick:
-
- Answer #1:
- The easiest way to do this will be to have sprites for the links so when a sprite is clicked you can make an appropriate broadcast. Assuming the pages are static rather than dynamic (an individual page doesn't change) you can have these as backdrops which you switch to. Using a variable for the name of the page you want to switch to will be better than a broadcast for every page - eg
- whenIreceivechange-bd
- switchbackdroptonext-bd #this uses the variable
- I'd include the ‘links’ in the backdrops but then place a rectangular sprite in front of each link with a ghost effect so you can still see the link but can click on it. So for each page you then need to know where to place the links so probably store that information in lists.
- There are various little problems to be solved along the way but that should get you started. Remember a sprite-clicked script can react differently according to the current backdrop.
- Answer #2:
- You could use sprites with like arrow costumes, or when X (let's say left) arrow pressed then broadcast “score page” or like when settings button clicked broadcast “config”.
- And equip every sprites except the sprites that appears in the menu with this:
- whenIreceivescore page or config.
- repeat25
- changeghosteffectby4
- hide
- cleargraphiceffects
- equip the sprites that appears in the menu like this:
- whenIreceivescore page or config.
- wait0.5secs
- setghosteffectto100
- show
- repeat25
- changeghosteffectby-4
- …and the backdrop with this
- whenclicked
- switchcostumetohome
- whenIreceivescore page or config.
- repeat25
- changeghosteffectby4
- switchcostumetoscore page or config
- repeat25
- changeghosteffectby-4
- Note: Ghost effects are just a fade effect so that it isn't a brutal ugly switch. You can just easily remove all of them..
-
- In Scratch (and Snap) there is no prebuilt concept of multipaging. You must esplicitely make the content of the next page visible and hide the content of the previous page by one of the following strategies:
- hide all the elements of the previous page (HIDE block) and show all elements of the next page (SHOW block) when they receive a message from the clicked button of the previous page (BROADCAST/WHEN I RECEIVE blocks)
- move the background of the next page (a sprite) to the foreground (GO TO FRONT block, so that it will cover all the elements of the previous page) and THEN move all the elements of the next page (sprites) to the foreground (again GO TO FRONT block, so that they will show up on top of the page) when they receive a message from the clicked button of the previous page (BROADCAST/WHEN I RECEIVE blocks)
- If you like multipage applications I would suggest using App Inventor, that is based on blocks like Scratch/Snap but has a “screen” component.
-
Other popular vintage Uses of the Name "Snap!"
Resources
- I listened to the speech “Snap! Eigene Blöcke bauen!” ( “Snap! Build your own blocks!” ) by Jens Mönig at the regional meeting of Java User Group Ostfalen in Braunschweig, Germany, ^2017-12-07.
-
- “The Snap!Mobile - Start Your Physical Computing Engines!: 11 Steps”.
- “What do you get when you combine Snap!, the premier drag and drop programming language, with an off the shelf rover vehicle kit, an Arduino micro-controller and s2a_fm interface software?”.
-
- Wiki Scratch Wiki ( formerly at Scratch Wiki ).
- “Snap!” is designed by the EN.Wikipedia "First-class citizen", DE.Wikipedia "First-Class-Objekt" principle.
StarLogo TNG, StarLogo Nova
-
-
-
- “StarLogo TNG is a downloadable programming environment that lets students and teachers create 3D games and simulations for understanding complex systems”.
- Downloads for Windows, Linux, MacOSX.
- StarLogo Nova - “StarLogo Nova is the new online iteration of StarLogo, following in StarLogo TNG's footsteps. StarLogo Nova builds upon TNG's innovations, with several language refinements and new features”.
- StarLogo Nova 2.0, implemented in HTML5/Javascript.
- Legacy StarLogo Nova 1.0, implemented in AdobeFlash.
-
-
Resources
- Predecessors of Scratch, Snap!,.. as children's programming languages:
- Smalltalk.
- See Smalltalk.
Forums, Newsgroups
-
-
- “Sprites all have separate scripts. You can duplicate sprites which will copy all the costumes and scripts from one sprite to another. You can also clone sprites in version 2 where you have an extra event 'when I start as a clone'”.
- “And don't forget that you can let one sprite send a message (make sure it's a message that is for all sprites) that the other sprites can react to”.
When this document changes ! Site Navigation ( My Business ! My Topics ! Imprint / Contact ! Privacy Policy ! Keyword Index ! Google+ Author "Rolf Hemmerling" ! Google+ Publisher "hemmerling" )