Visual programming language

from Wikipedia, the free encyclopedia

As a visual programming language ( English visual programming language , VPL ) refers to a programming language in which a program , algorithm or system behavior is defined by graphical elements and their arrangement.

Since visual programming languages ​​are more intuitive to use than textual programming languages, they can often also be used by end users ; this is referred to as end user development .

VPLs can be divided into icon , table and diagram-based languages according to the type of visual representation .

Concept formation

The visual programming language Scratch on a whiteboard
Example of program blocks at Open Roberta with the NEPO programming language

Graphic representations have a long history in software development. In the 1950s, for example, Haibt was able to generate assembly language and Fortran code from flowcharts . Even so, it is difficult to find a uniform terminology for visual languages. In order to define the term “visual language”, it is first important to define what “visual” actually means. For marketing reasons, the catchphrase "visual" is also attached to systems that use few visual language elements. Visual Basic Classic , Xcode and Visual C ++ are, for example, programming environments that only use an essentially textual editor with additional functions, e.g. B. to the design of graphical user interfaces , whereby the actual creation of the software still takes place with a conventional textual language ( General Purpose Language - GPL). Schiffer's definition of visual:

"Visual is the designation for that property of an object through which at least one piece of information about the object that is indispensable for achieving a goal of action can only be obtained through the human visual perception system."

Schiffer means that the human visual perception system is necessary as an "indispensable" tool. He does not rule out textual specifications, but points out that these primarily address the human verbal processing system. Price et al. go one step further in connection with the definition of “visual” and refer to a definition of “visual” in the Oxford Dictionary whereby visual is not limited to perception with the eye, but rather from a mental image that is formed in the mind. This definition of the term “visual” is therefore the most comprehensive, because it also includes other senses. There are also attempts to incorporate the sense of hearing into software development. Myers defines a visual language as a system that employs graphics. This definition is very vague and even draws in systems like VisualBasic, which offer an iconic surface, but whose inherent programming structure is purely textual.

"A visual language is a formal language with visual syntax or visual semantics and dynamic or static signing."

- Stefan Schiffer

Schiffer's definition deals in particular with the visual syntax and means a graphical notation of the basic symbols. Visual semantics means the runtime state of the visual objects, which can also be visual. Dynamic signing means the representation of volatile processes, e.g. B. the blinking of an object that is changing.

This distinction allows a differentiated consideration of visual languages. Schmidt has further refined the concept of visual language. He differentiates between genuinely visual languages, whose “essential parts” have a graphic notation, and textual languages. In particular, Schmidt defines visual languages ​​as a superset of textual languages. He cites Python as an example, which, in addition to a purely textual syntax, considers indentation as a semantic equivalent to blocks.

Advantages and disadvantages of visual languages

Schiffer mentions a number of advantages of visual languages ​​over purely textual ones. In this way, images are understood by people much earlier than texts. Cognitive psychology has shown that verbal information is processed sequentially, whereas visual information is processed in parallel. This means that more information can be perceived at the same time with a visual notation.

The introduction of pictogram-oriented systems for controlling the computer (desktop) with natural metaphors have made the use of the computer much easier and it is now impossible to imagine everyday life without it. Well-known visual metaphors in particular mean that an artificial system can be better understood. However, there are often no images for concepts that are too abstract and the use of images can lead to misunderstandings.

Shu describes images as a powerful means of communication because there are no language barriers. In addition, visual expressions do not necessarily require a deep understanding of underlying computer-specific methods. The high density of information in an image and the direct manipulation of objects can simplify programming considerably. Nevertheless, the geometric representation of software is problematic because it has no structure in space. In addition, such a geometric representation can lead to space problems, which in turn reduces the information density.

The often quoted sentence “A picture says more than 1000 words” does not always seem to be correct when it comes to visual programming, because different viewers interpret the picture differently. The interpretation of a visual notation often also depends on the context. Thus, a picture often says 1000 different words. There is no uniform agreement to make visual programs unambiguous. Often times, diagrams cannot be grasped immediately because the visual notation has to be learned first. There are no rules on how to read charts. In verbal languages, however, this is clearly determined. Complex processes can also result in complex representations.

Visual languages ​​are therefore particularly advantageous when metaphors from a certain domain are used or when graphic objects are subject to strict, generally applicable conventions (document pictogram in graphic user interfaces). So, good design, the use of secondary notation, and mechanisms to show relevant data make up good visual language. Schmidt even goes so far as to argue that if visual languages ​​are a superset of textual languages, then there is a visual language for every application that is at least as good as any textual language. In particular, Schmidt refers to the freedom of layout of visual languages, which depict certain structures better and informal additional information that can be embedded. In addition, interaction mechanisms can be built into visual representations using suitable symbols. Examples are “handles” for touching visual objects or a “+” to expand certain areas.

Incremental development is another benefit of visual languages. Objects can easily be manipulated or modified afterwards. A new class can easily be inserted in a UML class diagram by moving other objects accordingly. This is not easily possible in a purely textual representation. The main disadvantages of a visual language are generally seen in the space requirements and the complexity of the construction. A visual language, for example, requires considerably more space on the screen, due to its waste. As a result, as a rule, less information can be displayed at the same time than with textual language. The construction of a program by means of a visual language is, due to the large mouse paths, quite complex. Good keyboard interaction mechanisms for the experienced user are therefore essential.

A major, if not the most important, advantage of visual languages, however, is that they work at an extremely high level of abstraction. Syntactic elements of a textual language are represented by graphic objects with attributes. Suitable visual languages ​​allow the user to initially specify programs that are not syntactically incorrect. They only allow so-called structural editing, i.e. H. Objects can only be inserted where they are syntactically permitted. Good visual languages ​​support the developer in their work with suitable error messages and consistency checks or automatic help functions and thus lead to an increased development speed. The high level of abstraction allows decoupling from the target language, which may even be interchangeable. Use in special domains makes sense if you do not need GPL constructs or if the user group does not consist of programmers. Animation and simulation of visual languages ​​go one step further. They help the user not only to create a syntactically or semantically correct program, but also to visualize the status inherent in each program . The program specification is no longer just static, but the program itself. Some generators, such as DEViL , already support the generation of environments for visual languages ​​with simulation and animation extensions .

Educational Visual Programming Languages

Educational programming languages are regularly firmly embedded in a complete visual development environment , which enables the user to create program code menu- guided, so that programming errors are reduced and intuitive learning is supported. In some IDEs, the written language is completely replaced by icons so that they can already be used by children who are not yet literate (e.g. Baltie , Kodu , Scratch ). Visual programming languages ​​are also used in adult education (see e.g. Snap! ).

Scratch

Scratch development environment example

Scratch , published in 2007, is an interpreted , object-oriented , dynamic , event- oriented and, above all, visual programming language, including its development environment and the closely linked online community platform, developed under the direction of Mitchel Resnick at the MIT Media Lab . Scratch is intended to motivate newcomers - especially children and young people - to learn the basic programming concepts in a playful and explorative way. Under the motto “imagine, program, share”, you can create your own games and multimedia applications free of charge and without advertising, and play, discuss and exchange them in an international online community with the scratch player.

The intuitive operation and easy translatability, both of the development environment including its programming command modules and the Scratch website, combined with successful communication and media work by the MIT Scratch team, promoted the rapid global expansion of the Scratch idea: from the very beginning Between March 2007 and the end of 2015, over 8 million international users - with an age between 8 and 16 years of age - registered, who put over 11 million scratch projects they had developed themselves online.

The first implementations of the Scratch development environment were based on Squeak (1.0 in 2007 to 1.4 in 2009), the Scratch Web Player initially on Java , and since 2011 also optionally on Flash . Scratch 2.0 was released in May 2013 and is based entirely on Flash.

Since 2014 there is also a Scratch version for the iPad with ScratchJr.

Snap! (BYOB)

BYOB terms as images: illustration of visual "first-class objects" and an exemplary extension of a "for-next loop" block as a self-defined new language component.

BYOB (engl. Abbr .: "Build Your Own Blocks" German: "Building your own blocks" !, Later renamed Snap) is one of Scratch inspired education-oriented visual programming language , including their development environment for advanced students and for adults. It expands the Scratch language developed by the Lifelong Kindergarten Group at the MIT Media Lab to include more complex and abstract programming concepts that were previously lacking in Scratch in favor of children’s suitability. BYOB is open source and comes in secondary || -Lessons at German schools and at American and German universities for use.

Despite the playful appearance that it has retained from its scratch origins, comprehensive concepts are offered that go beyond the possibilities of many traditional programming-learning languages. These are options such as creating blocks, first-class functions or procedures (their mathematical bases are also known as the “ lambda calculus ”), first-class object lists (including lists of lists), and first class sprites . With prototype-based programming , BYOB enables object orientation without an abstract class concept: New objects are created as copies of existing objects (“cloning”).

Further examples

literature

  • Magnus Lie Hetland: Practical Python . Apress, Berkeley, CA, USA, 2002.
  • BA Myers: Taxonomies of visual programming and program visualization . Visual Languages ​​and Computing, 1 (1): 97-123, 1990.
  • Stefan Schiffer: Visual Programming - Basics and Applications . Addison-Wesley, 1998. ISBN 3-8273-1271-X
  • Carsten Schmidt: Generation of structure editors for demanding visual languages . PhD thesis, University of Paderborn, 2006.
  • Nan C. Shu: Visual Programming . Van Nostrand Reinhold, 1988.

Web links

Individual evidence

  1. schiffer.at (PDF)
  2. About Scratch . ( Memento of April 2, 2013 on the Internet Archive ) Official website; accessed January 17, 2013
  3. Scratch: The Scratch phenomenon ( Memento from June 25, 2012 in the Internet Archive ) in the DACH Scratch Wiki, accessed January 17, 2013
  4. ^ Translation ( memento of November 27, 2015 in the Internet Archive ) in the DACH Scratch Wiki
  5. ^ MIT-Scratch-Team ( Memento from December 8, 2015 in the Internet Archive ) in the DACH-Scratch-Wiki, accessed January 17, 2013
  6. Scratch Statistics ( Memento from May 27, 2013 in the Internet Archive ) of the original website (English), accessed on December 2, 2015.
  7. Scratch 1.0 ( Memento from February 5, 2015 in the Internet Archive ) in the DACH Scratch Wiki, accessed January 17, 2013
  8. Scratch 1.4 ( Memento from December 3, 2013 in the Internet Archive ) in the DACH Scratch Wiki, accessed January 17, 2013
  9. Java Player in the Scratch Wiki, accessed January 17, 2013
  10. Flash Player in the Scratch Wiki, accessed January 17, 2013
  11. Scratch 2.0 ( Memento from December 3, 2013 in the Internet Archive ) in the DACH Scratch Wiki, accessed January 17, 2013
  12. ScratchJr Official Website
  13. Build Your Own Blocks (Scratch Modification) ( Memento from July 17, 2018 in the Internet Archive ) in the DACH-Scratch-Wiki, accessed on January 27, 2013. Eckart Modrow: OOP with BYOB . (PDF; 575 kB)  ( page no longer available , search in web archives ) In: LOG IN , issue No. 171, 2011; accessed on January 27, 2013. Eckart Modrow: Visual programming - or: What do you learn from syntax errors? (PDF; 83 kB)  ( Page no longer available , search in web archivesInfo: The link was automatically marked as defective. Please check the link according to the instructions and then remove this notice. January 9, 2011; accessed on January 27, 2013. Eckart Modrow, Jens Mönig, Kerstin Strecker: Why JAVA? (PDF; 557 kB)  ( Page no longer available , search in web archivesInfo: The link was automatically marked as defective. Please check the link according to the instructions and then remove this notice. In: LOG IN , issue No. 168, 2011; accessed on January 27, 2013. Michael Heinelt: Game programming with Scratch and BYOB . (PDF; 3.2 MB)  ( Page no longer available , search in web archivesInfo: The link was automatically marked as defective. Please check the link according to the instructions and then remove this notice. Seminar Didactics of Computer Science 3rd semester, winter semester 2011/12; Retrieved January 27, 2013@1@ 2Template: Toter Link / scratch-dach.info @1@ 2Template: Toter Link / scratch-dach.info  @1@ 2Template: Toter Link / scratch-dach.info  @1@ 2Template: Toter Link / scratch-dach.info  
  14. ^ Blueprints Visual Scripting. In: docs.unrealengine.com. Retrieved October 31, 2016 .