Hopscotch (programming language): Difference between revisions

Revision as of 02:55, 2 July 2021

Revision as of 15:31, 9 September 2021

Line 1:

{{Multiple issues|This articles has been updated for a more recent version of Hopscotch (2021.09.08)}}'''Hopscotch''' is a [[visual programming language]] developed by Hopscotch Technologies, designed to allow young or [[Beginners|beginner]] [[programmers]] to develop simple projects. Its simple [[User interface|UI]] allows its users to drag and drop blocks to create [[scriptScript (computer programming)|scriptscripts]]s that can be played when activated. Although the language is easy to use for simple [[Programming language|programming]], it lacks the power to be used for more complex programs. The use of the language is through an [[iPad]] or [[iPhone]] supporting Hopscotch.<ref name="Hanselminutes PodcastPodcast2">[http://www.hanselminutes.com/417/i-am-teaching-my-daughter-to-code-with-hopscotch-fitzgerald-steele Hanselminutes Podcast, Show #417], Apr 04, 2014, titled "I am teaching my daughter to code with Hopscotch - Fitzgerald Steele", 30-minute interview with father whose daughter tried Hopscotch app on iPad.</ref>

{{Multiple issues|

{{notability|date=September 2013}}

{{more citations needed|date=June 2016}}

{{Primary sources|date=July 2019}}

}}

'''Hopscotch''' is a [[visual programming language]] developed by Hopscotch Technologies, designed to allow young or [[Beginners|beginner]] [[programmers]] to develop simple projects. Its simple [[User interface|UI]] allows its users to drag and drop blocks to create [[script (computer programming)|script]]s that can be played when activated. Although the language is easy to use for simple [[Programming language|programming]], it lacks the power to be used for more complex programs. The use of the language is through an [[iPad]] or [[iPhone]] supporting Hopscotch.<ref name="Hanselminutes Podcast">[http://www.hanselminutes.com/417/i-am-teaching-my-daughter-to-code-with-hopscotch-fitzgerald-steele Hanselminutes Podcast, Show #417], Apr 04, 2014, titled "I am teaching my daughter to code with Hopscotch - Fitzgerald Steele", 30-minute interview with father whose daughter tried Hopscotch app on iPad.</ref>

==Software development==

The idea sprang from an existing programming tool, [[Scratch (programming language)|Scratch]], where the user drags blocks to create a script. This is much easier for children than typing out the [[code]] manually like in most programming languages. The [[Software developer|developerdevelopers]]s of Hopscotch wanted to take a step back from Scratch, making it slightly easier to grasp the concepts and easier to use, so removed many blocks and added some of their own. Hopscotch's notion of events, and rules combining conditions with actions, is similar to [[AgentSheets]].

Hopscotch includes basic programming blocks and functionalities such as [[Variable (computer science)|variables]], [[Sprites (computer graphics)|sprites]] (called objects) and text objects, but also features considered more advanced such as self-[[Variable (mathematics)|variablevariables]]s, [[Function (mathematics)|maths functions]] and more.

== Editor ==

[[File:Hopscotch iPhone editorHopscotch_iPhone_editor.png|thumb|Hopscotch iPhone editor]]

[[File:Hopscotch ipad editorHopscotch_ipad_editor.jpg|thumb|223x223px|Hopscotch iPad editor|223x223px]]

The Hopscotch app uses a UI very similar to that of Scratch. Use of the [[Editing|editor]] is simple, all one has to do is open the editor, tap the object and script you wish to edit, open one of the block tabs, and drag out code blocks. Most code blocks can have [[Number|numeric]], text, or math inputs. e.g. the "move" block. The editor work area is mainly based on a [[gridGrid graph|grid]] divided into X and Y-[[Coordinate system|coordinates]].

=== Editor history ===

The Hopscotch Editor is available on [[iPhone]] and [[iPad]]. The iPhone version only supported viewing projects until early 2016,<ref>{{Cite web|title=Help us test the *new* iPhone app!|url=https://forum.gethopscotch.com/t/help-us-test-the-new-iphone-app/10154|titleaccess-date=Help us test the *new* iPhone app!2018-05-06|website=Hopscotch Forum|language=en|access-date=2018-05-06}}</ref> when an update supporting editing and account functionality was released. The Hopscotch iPhone projects play in an iPhone format even on the iPad and web player. A version for Android is not planned for release (as of 2021)

=== When blocks/inputs ===

When inputs are the trigger for the script to activate, when a "when" block's input is true (the "when project starts" when the block is triggered when one opens the player or taps the refresh button)

'''Event blocks:'''<blockquote><code>When Game Starts</code></blockquote><blockquote><code>When '''(Character)''' is tapped</code>

<blockquote>list of "when" blocks:</blockquote><blockquote>play button is tapped</blockquote><blockquote>character is tapped</blockquote><blockquote>iPad (iPhone) is tapped</blockquote><blockquote>() is tapped</blockquote><blockquote>() is pressed</blockquote><blockquote>() bumps ()</blockquote><blockquote>() is touching ()</blockquote><blockquote>iPad (iPhone) is tilted (up, down, left, right)</blockquote><blockquote>iPad (iPhone) detects a loud noise</blockquote><blockquote>iPad is shaken</blockquote><blockquote>() is swiped (up, down, left, right)</blockquote><blockquote>when I hear</blockquote><blockquote>() equals ()</blockquote><blockquote>() > ()</blockquote><blockquote>() < ()</blockquote><blockquote>() ≠ ()</blockquote><blockquote>object is cloned</blockquote><blockquote>(>,<,=,!=) (and, or) (>,<,=,!=)</blockquote>

<code>When '''(Character)''' is pressed</code></blockquote><blockquote><code>When '''(Character)''' bumps '''(Character)'''</code>

<code>When '''(Character)''' is touching '''(Character)'''</code></blockquote><blockquote><code>When iPad is tilted '''(up, left, right or down)'''</code>

<code>When iPad hears a loud noise</code>

<code>When iPad is shaken</code></blockquote><blockquote><code>When '''(Character)''' is swiped '''(up, left, right or down)'''</code>

<code>When I hear a message '''(Text)'''</code></blockquote>'''Comparison blocks:'''<blockquote><code>'''(Value)''' = '''(Value)'''</code>

<code>'''(Value)''' ≠ '''(Value)'''</code>

<code>'''(Value)''' < '''(Value)'''</code>

<code>'''(Value)''' > '''(Value)'''</code>

<code>'''(Condition)''' and '''(Condition)'''</code>

<code>'''(Condition)''' or '''(Condition)'''</code></blockquote>

=== Code blocks ===

Code blocks are the actions completed when the blocks are triggered, code blocks fall into 6 categories: abilities, movement, drawing, looks & sounds, values, and control flow. These can be dragged into and out of the scripts to modify them. Movement blocks make the character move physically on the screen. Ability blocks let one make subprogram blocks to duplicate code in a Hopscotch project. Drawing blocks make an object draw stuff. There are 2 “draw” blocks, Draw a Trail and Clear. Draw a trail that draws a trail of selected color and width. There are [[HSB color space|HSB]] and [[RGB]] options for color. Width is determined by the number of [[pixels]] in that trail {{citation needed|date=March 2021}}. Looks & sounds blocks are blocks that change the object's looks (such as size, invisibility, and color). Value blocks are blocks that set a value to a specific number or change a value by a specific number. Finally, control flow blocks can either repeat a code multiple or infinite times or add a condition which will make the code inside it execute only if the condition is matched. There is 1 exception, the “Create a Clone” block creates a clone of the object. The clone will not execute any of the code programmed for the original object. That's the job of the “When an object is cloned” block.<!-- This section needs to be completed. -->

Code blocks are the actions completed when the blocks are triggered, code blocks fall into 6 categories: abilities, movement, drawing, looks & sounds, values, and control flow.

These can be dragged into and out of the scripts to modify them. Movement blocks make the character move physically on the screen. Ability blocks let one make subprogram blocks to duplicate code in a Hopscotch project. Drawing blocks make an object draw stuff. There are 2 “draw” blocks, Draw a Trail and Clear. Draw a trail that draws a trail of selected color and width. There are [[HSB color space|HSB]] and [[RGB]] options for color. Width is determined by the number of [[pixels]] in that trail {{citation needed|date=March 2021}}. Looks & sounds blocks are blocks that change the object's looks (such as size, invisibility, and color). Value blocks are blocks that set a value to a specific number or change a value by a specific number. Finally, control flow blocks can either repeat a code multiple or infinite times or add a condition which will make the code inside it execute only if the condition is matched. There is 1 exception, the “Create a Clone” block creates a clone of the object. The clone will not execute any of the code programmed for the original object. That's the job of the “When an object is cloned” block.<!-- This section needs to be completed. -->

=== Drawing blocks ===

Line 33 ⟶ 46:

== Player ==

[[File:Hopscotch iPad playerHopscotch_iPad_player.jpg|thumb|Hopscotch iPad player, playing project]]

=== In-app player ===

Line 39 ⟶ 52:

=== Webplayer ===

The player is also available on the web (known as the "Webplayer"). The web player brings HopscotchsHopscotch projects to almost any browser. It is designed to work the same as the in-app player, but the web player does not have any functionality for coding, uploading, or liking projects. The web version of a project is only accessible via its unique link that is formatted like this: <code><nowiki>https://c.gethopscotch.com/p/(project</nowiki>'''project id)ID'''</code>

Both the in-app and the web player are written in [[JavaScript]].

== Hopscotch Forum ==

[https://forum.gethopscotch.com/ Hopscotch Forum] is an online forum for discussion of Hopscotch projects, programming help, and Hopscotch app bug reports.

== Languages ==

Line 50 ⟶ 63:

== Hopscotch Web Explorer ==

The Hopscotch Web Explorer is a [[website]] forallowing playingyou to view Hopscotch projects andonline, seeinglike codein ofthe Hopscotch projectsapp.

==References==

<ref>{{Cite web|url=http://www.gethopscotch.com|title=Hopscotch - Make your own game. Learn to code.|websiteurl=Hopscotchhttp://www.gethopscotch.com|access-date=2016-06-20|website=Hopscotch}}</ref>

{{Reflist}}

* Hopscotch app: https://itunes.apple.com/us/app/hopscotch-coding-for-kids/id617098629?mt=8&ign-mpt=uo%3D4

* hopscotch website: https://www.gethopscotch.com/

* Hopscotch appon App Store: https://itunes.apple.com/us/app/hopscotch-coding-for-kids/id617098629?mt=8&ign-mpt=uo%3D4

* hopscotchHopscotch website:Website https://www.gethopscotch.com/

{{Authority control}}

[[Category:Visual programming languages]]

[[Category:Educational programming languages]]