Beinahe jeder nutzt das Internet und viele wollen es selbst mit­ge­stal­ten. Der Alltag bringt diverse Probleme mit sich, die mit pro­gram­mier­ten An­wen­dun­gen (Ap­pli­ka­ti­on, App) und ent­spre­chen­den End­ge­rä­ten gelöst werden können. Doch die Hürden auf dem Weg dahin sind oft hoch. Ein funk­tio­nie­ren­des Programm besteht aus einer Vielzahl von Bau­stei­nen, einer Pro­gram­mier­spra­che mit vielen „Vokabeln“: Variablen, Kon­stan­ten, Abläufe in Schleifen, Be­din­gun­gen, For­mu­la­ren, Aktionen, regulären Aus­dru­cken. Dazu kommen meist diverse Ver­knüp­fun­gen und Ein­bet­tun­gen.

Das Arbeiten mit solchen tex­tu­el­len Pro­gram­mier­spra­chen erfordert fun­dier­tes Wissen, große Abs­trak­ti­ons­fä­hig­keit und anhaltend hohe Kon­zen­tra­ti­on. Das Erlernen einer text­ba­sier­ten Pro­gram­mier­spra­che kann mit dem Erlernen einer Fremd­spra­che auf eine Stufe gestellt werden. Um diese Hürden zu be­sei­ti­gen, wurden seit den 1960er Jahren visuelle Ent­wick­lungs­um­ge­bun­gen ent­wi­ckelt. Dabei nutzen die Pro­gram­mie­rer keine mühselig an­ein­an­der­zu­fü­gen­den Text-Codes mehr, sondern grafische Elemente.

Was ist visuelle Pro­gram­mie­rung?

Bei der visuellen Pro­gram­mie­rung stehen die Elemente der Pro­gram­mier­spra­che in Form von grafisch ge­stal­te­ten Bau­stei­nen zur Verfügung. Daher spricht man auch von gra­fi­scher Pro­gram­mie­rung. Anhand des Aussehens und der Be­schrif­tung dieser Bausteine ist bereits zu erkennen, welche Aufgabe im Pro­gramm­ab­lauf womit gelöst werden kann. Die Pik­to­gram­me dienen der Ori­en­tie­rung. Dabei werden hoch­kom­ple­xe Struk­tu­ren oder starke Abs­trak­tio­nen vermieden.

Hinweis

Die vielfach ver­wen­de­te Abkürzung VPL steht für den eng­li­schen Terminus „Visual Pro­gramming Language“.

Der fun­da­men­ta­le Pro­gram­mier­stil – auch Pro­gram­mier­pa­ra­dig­ma genannt – weist u. a. folgende Ei­gen­schaf­ten auf:

  • Visuell: Elemente werden per Drag-and-Drop in den Pro­gramm­ab­lauf eingefügt.
  • Er­eig­nis­ori­en­tiert: Jeder Pro­gramm­schritt startet, wenn ein zuvor de­fi­nier­tes Ereignis eintritt.
  • Imperativ: Die Pro­gram­mie­rung besteht aus einer Folgen von Befehlen.
  • Ob­jekt­ori­en­tiert: Die einzelnen Objekte bekommen de­fi­nier­te Aufgaben zu­ge­wie­sen.

Pro­gram­mie­rer benutzen dabei – je nach ver­wen­de­ter visueller Pro­gram­mier­spra­che – viele vor­ge­fer­tig­te Pro­gramm­ele­men­te. Diese können Texte und Bilder aufnehmen, logisch an­ge­ord­net und im Aussehen oder in ihrem Ausdruck verändert werden. Steue­rungs­ele­men­te er­mög­li­chen das Einfügen von Aktionen, die von Be­din­gun­gen abhängig sind. Ope­ra­to­ren gestatten Ver­knüp­fun­gen und ma­the­ma­ti­sche Be­rech­nun­gen, Variablen oder Links können eingefügt, entfernt oder geändert werden. Die Pro­gram­mier­ele­men­te sind so gestaltet, dass sie sich wie Puz­zle­tei­le zu­sam­men­fü­gen lassen. Wenn Elemente logisch nicht zu­sam­men­pas­sen, wird das vom je­wei­li­gen Editor erkannt und farblich, z. B. durch Ver­blas­sen, und z. T. zu­sätz­lich akustisch si­gna­li­siert. Die Pro­gram­mier­ele­men­te sind meist in farblich ge­kenn­zeich­ne­ten Gruppen zu­sam­men­ge­fasst. Das er­leich­tert die Ori­en­tie­rung bei ihrer Auswahl.

Die Be­schrif­tun­gen der einzelnen Elemente und die da­hin­ter­ste­hen­den Abläufe re­prä­sen­tie­ren mensch­li­che Äu­ße­run­gen oder Hand­lun­gen wie „Mache …“, „Sage …“, „Drücke die Taste …“ oder „Warte, bis …“. Die Elemente des Programms werden per Drag-and-Drop (Ziehen und Ablegen) zu­sam­men­ge­stellt. Ob sich grafische Elemente mit­ein­an­der verzahnen lassen, ist bereits an Aus­spa­run­gen und Er­he­bun­gen zu erkennen, deren Formen zu­sam­men­pas­sen müssen. Damit ist ein einfaches, also in­tui­ti­ves Zu­sam­men­stel­len von Abläufen möglich, ohne dass man Kennt­nis­se einer tex­tu­el­len Pro­gram­mier­spra­che besitzen müsste.

Wie un­ter­schei­det sich die visuelle von der „normalen“ Pro­gram­mie­rung?

Der größte Un­ter­schied besteht darin, dass sich visuelle Pro­gram­mie­rer nicht mit Unmengen an Befehls-Syntax aus­ein­an­der­set­zen müssen. Auch das mühsame Erlernen der „Vokabeln“ einer Pro­gram­mier­spra­che ist nicht nötig. Bei der „normalen“ Pro­gram­mie­rung ist ein hohes Abs­trak­ti­ons­ver­mö­gen nötig, um aus den An­wei­sun­gen der Pro­gram­mier­spra­che das be­ab­sich­tig­te Ergebnis zu erzielen. Obwohl viele Pro­gram­mier-Editoren über die Funktion „Auto Complete“ verfügen, mit der sich An­wei­sun­gen selbst ver­voll­stän­di­gen und Pro­ze­du­ren selbst schließen, sind die Pro­gram­mie­rer vor Tipp­feh­lern bei der Eingabe nicht gefeit – ein ver­ges­se­ner Un­ter­strich, und die komplette Routine führt zur Ausgabe einer Feh­ler­mel­dung. Das hat eine oft zeit­auf­wen­di­ge Feh­ler­su­che zur Folge.

Wie beim Erlernen einer Fremd­spra­che beginnt man beim Pro­gram­mie­ren „von Hand“ erst mit den wich­tigs­ten „Vokabeln“, um sich zu „ver­stän­di­gen“. Jede neue Pro­gram­mier­auf­ga­be erfordert das Hin­zu­ler­nen neuer Begriffe. Der Be­griffs­um­fang moderner tex­tu­el­ler Pro­gram­mier­spra­chen hat sich über die Jahre immens erweitert, um mit den An­for­de­run­gen des modernen Internets Schritt zu halten. Man kann Pro­gram­mier­ab­schnit­te in separate Dateien auslagern und in den Pro­gramm­pro­zess einbinden. Das er­leich­tert das textuelle Pro­gram­mie­ren zwar, erfordert aber weit­rei­chen­den Überblick, gut kom­men­tier­ten Code und eine sorg­fäl­ti­ge Do­ku­men­ta­ti­on.

Was sind die Vorteile und Nachteile der visuellen Pro­gram­mie­rung?

Die visuelle Pro­gram­mie­rung baut tech­ni­sche und fachliche Barrieren beim Zugang zum Pro­gram­mie­ren ab. Somit wird schon Kindern der spie­le­ri­sche Zugang zum Pro­gram­mie­ren er­mög­licht. Pro­gram­mie­rer können sich ab­len­kungs­frei völlig auf die logischen Abläufe in seinem Programm kon­zen­trie­ren. Dadurch werden schnell an­wend­ba­re Er­geb­nis­se erzielt, die zu weiteren und größeren Projekten mo­ti­vie­ren.

Fakt

Die visuelle Pro­gram­mier­spra­che Scratch hatte von ihren Anfängen im März 2007 bis Mitte 2015 rund 1.300.000 re­gis­trier­te Online-Anwender im Alter von 8 bis 16 Jahren. Es wurden mehr als 3.000.000 selbst­ent­wi­ckel­te Scratch-Projekte online gestellt.

Vorteile der visuellen Pro­gram­mie­rung

Es gibt nur geringen Lern­auf­wand: Eine Idee kann im Prinzip sofort als Programm „ge­schrie­ben“ werden. An­schau­li­che Symbole sorgen für eine leichte Ver­ständ­lich­keit. Da es keine Syntax gibt, können sich keine Tipp­feh­ler ein­schlei­chen. Das hilft Pro­gram­mie­rern, das grund­le­gen­de Konzept einer Pro­gram­mier­spra­che zu verstehen.

Visuelle Pro­gram­mier­spra­chen er­mög­li­chen das so­ge­nann­te ex­plo­ra­ti­ve Pro­gram­mie­ren: Einfach beginnen und Schritt für Schritt ein Programm aufbauen, bevor die genaue Lösung zu Ende erdacht wurde. Be­stehen­de Pro­gramm­schrit­te können immer wieder auf ihre Funk­tio­na­li­tät getestet werden. Dabei arbeiten die Pro­gram­mie­rer vor­wie­gend mit brow­ser­ba­sier­ten Lösungen, die un­ab­hän­gig vom Computer-Be­triebs­sys­tem funk­tio­nie­ren. Die Er­geb­nis­se können meist in andere, textuelle Pro­gram­mier­spra­chen ex­por­tiert werden.

Nachteile der visuellen Pro­gram­mie­rung

Ein Teil der gra­fi­schen Pro­gram­mie­rung ist an spezielle Ein­satz­be­rei­che oder an bestimmte Systeme, Hardware oder Endgeräte gebunden. Es ist in der Regel nicht möglich, in­di­vi­du­el­le Elemente zu erstellen oder Kom­men­ta­re für andere Pro­jekt­be­tei­lig­te ein­zu­fü­gen. Das erschwert schon bei ge­ring­fü­gig komplexen Pro­gram­men den Überblick. Darüber hinaus sind visuell pro­gram­mier­te Projekte nur in geringem Umfang ska­lier­bar. Das erschwert ihre Anpassung an große oder schnell wachsende Projekte. Der Vorteil des ex­plo­ra­ti­ven Pro­gram­mie­rens kann bei größeren Projekten schnell zum Nachteil in Form von un­struk­tu­rier­tem Code führen. Solche Programme sind schwierig zu pflegen und zu erweitern.

Welche visuellen Pro­gram­mier­spra­chen gibt es?

Aus der großen Vielfalt an visuellen Pro­gram­mier­spra­chen stellen wir Ihnen hier eine kleine Auswahl vor:

Scratch

Die be­kann­tes­te und am weitesten ver­brei­te­te visuelle Pro­gram­mier­spra­che ist Scratch. Sie wurde erstmals im Jahr 2007 ver­öf­fent­licht und hat den Anspruch, das Pro­gram­mie­ren für Kinder auf einem einfachen Weg zu ver­mit­teln. Den Ableger ScratchJr für Kinder zwischen 5 und 7 Jahren gibt es als kos­ten­lo­se App. Einige andere Sprachen für die grafische Pro­gram­mie­rung wurden auf der Basis von Scratch ent­wi­ckelt, z. B. BYOB 4.0/Snap!.

Blockly

Bei Blockly handelt es sich um eine so­ge­nann­te Bi­blio­thek. Sie bietet einen visuellen Pro­gram­mier-Editor, der Android-, iOS- und Web-Ap­pli­ka­tio­nen hin­zu­ge­fügt wird. Blockly verwendet ebenfalls verzahnte, grafische Blöcke. Die pro­gram­mier­ten Al­go­rith­men können z. B. als Ja­va­Script- oder Python-Code ex­por­tiert werden.

NEPO

NEPO ist an Scratch angelehnt und nutzt die frei ver­füg­ba­re Bi­blio­thek Blockly. Diese wurde um eigene Funk­tio­na­li­tä­ten erweitert. Ein Vorteil von NEPO sind offenen Schnitt­stel­len, die auch andere Hardware- oder Ro­bo­ter­sys­te­me ansteuern können.

Grape

Grape ist eine grafische Ent­wick­lungs­um­ge­bung. Damit können auch Pro­gram­mier­an­fän­ger in einfachen Schritten Mi­kro­con­trol­ler pro­gram­mie­ren.

App Inventor

Der App Inventor stammt ur­sprüng­lich von Google. Die ver­wen­de­te grafische Schnitt­stel­le er­mög­licht es, mit gra­fi­schen Blöcken An­wen­dun­gen für Android-Mo­bil­te­le­fo­ne zu pro­gram­mie­ren.

Ardublock

Diese grafische Pro­gram­mier­spra­che ist speziell für die Pro­gram­mie­rung des Mi­kro­con­trol­lers Arduino ohne textuelle Eingaben gedacht.

Pure Data

Diese visuelle Pro­gram­mier­spra­che ist da­ten­stro­m­ori­en­tiert und zugleich eine Ent­wick­lungs­um­ge­bung. Mit Pure Data wird in­ter­ak­ti­ve Mul­ti­me­dia-Software, z. B. für Syn­the­si­zer, pro­du­ziert.

Lego Mind­s­torms

Eine Pro­dukt­se­rie des Spiel­wa­ren­her­stel­lers Lego, deren Kernstück ein pro­gram­mier­ba­rer Legostein ist: Mit den haus­ei­ge­nen Elek­tro­mo­to­ren, Sensoren und Lego-Technik-Teilen können Roboter und andere in­ter­ak­ti­ve Systeme gebaut und pro­gram­miert werden.

Zum Hauptmenü