AA_PO-24551-123RF-cbpix.jpg

© cbpix, 123RF

Findet Nemo!

Visuell programmieren mit Alice

21.06.2013 Sie können Ihre Desktop-Umgebung bedienen? Dann können Sie auch programmieren: Alles was Sie dazu brauchen, ist die Maus, die IDE Alice und etwas Experimentierfreude.

In Alice müssen Sie keinen einzigen Befehl eintippen oder gar eine kryptische Programmiersprache erlernen. Stattdessen klicken Sie Programme einfach mit der Maus zusammen: Zunächst ziehen Sie in eine noch leere 3D-Welt vorgefertigte Gegenstände. Jeder Davon bietet mehrere Aktionen an, die sein Aussehen, seine Lage oder sein Verhalten ändern. Die gewünschten Aktionen übernehmen Sie dann einfach per Drag & Drop in einen Ablaufplan, den Alice auf Zuruf ausführt.

Diese kinderleichte Bedienung hat freilich auch ihre Grenzen. So sind die erstellten Anwendungen immer auf die 3D-Welt festgenagelt. Alice eignet sich folglich vorwiegend für 3D-Animationen oder Spiele. Die 3D-Welt verlangt zudem fast zwingend, dass Linux die 3D-Beschleunigung Ihrer Grafikkarte nutzt: Andernfalls läuft das selbst erstellte Programm nur im Schneckentempo ab.

Nummerngirl

Alice [1] liegt derzeit in zwei verschiedenen Fassungen vor. Nach den Vorstellungen der Macher sollen vor allem Kinder die ältere Version 2 verwenden. Sie lehrt vor allem logisches Denken und die Grundlagen der Programmierung. Die neue Version 3 legt den Schwerpunkt hingegen auf die objektorientierte Programmierung, nutzt verstärkt die dort übliche Terminologie und ermöglicht so später einen einfacheren Umstieg auf Java.

Die grundlegende Arbeitsweise gestaltet sich jedoch in beiden Versionen gleich, der größte Unterschied liegt in der etwas anders aussehenden Benutzeroberfläche und einer leicht abweichenden Terminologie. Im Folgenden soll deshalb die Version 3.1 im Vordergrund stehen, alle Erläuterungen gelten jedoch weitgehend auch für Alice 2.3.

Bei der an der Carnegie Mellon University im US-amerikanischen Pittsburgh entstandenen Programmierumgebung handelt es sich nicht um freie Software. Alice unterliegt einer zwar kostenlosen Lizenz, ist jedoch nicht Open Source. Die Installation der IDE beschreibt der Kasten "Alice installieren".

Alice installieren

Um Alice 3.1 für Linux herunterzuladen, wechseln Sie auf die Alice-Homepage, wählen im Menü Downloads | Get Alice 3.1 und klicken dann im Bereich Universal Installer den Link Download Alice 3.1 Universal .zip for all platforms an. Sie erhalten dabei ein ZIP-Archiv, das Sie in Ihrem Heimatverzeichnis entpacken. Dort entsteht automatisch das Unterverzeichnis Alice3.

In diesen machen Sie die Datei alice3.sh ausführbar (indem Sie sie mit der rechten Maustaste anklicken, Eigenschaften wählen und dann auf dem Register Zugriffsrechte den mit als Programm ausführen oder ähnlich beschrifteten Punkt abhaken). Möchten Sie Alice später wieder loswerden, müssen Sie nur das komplette Alice3-Verzeichnis wieder löschen.

Als Nächstes benötigen Sie noch Java in Form eines Java Development Kit, kurz JDK. Das von vielen Distributionen installierte Java Runtime Environment (JRE) genügt hier nicht. Unter Ubuntu installieren Sie das JDK schnell in einem Terminal-Fenster mit dem Befehl sudo apt-get install default-jdk. Anschließend können Sie Alice im Verzeichnis Alice3 über das Skript alice3.sh starten.

Einrichtungshaus

Nach dem Start der Programmierumgebung öffnet sich das Fenster aus Abbildung 1. Dort müssen Sie zunächst den Bodenbelag für Ihre 3D-Welt auswählen. Im Folgenden soll als Einstiegsbeispiel ein Fisch durch eine Unterwasserwelt schwimmen, weswegen Sie sich für den SEA_FLOOR entscheiden. Nach dem Klick auf OK öffnet sich das eigentliche Hauptfenster aus Abbildung 2. Da es sehr viel Platz beansprucht, sollten Sie es auf den gesamten Bildschirm vergrößern. Lassen Sie sich zudem nicht von den vielen Elementen erschrecken – es sieht schlimmer aus, als es tatsächlich ist.

Abbildung 1

Abbildung 1: Nach dem Start bietet Alice verschiedene Untergründe für die 3D-Welt an. Zur Not wählen Sie irgendeine Vorgabe und ersetzen sie später wieder, etwa durch eine farbige Fläche.

Abbildung 2

Abbildung 2: Das nach der Wahl eines Bodenbelags erscheinende Hauptfenster von Alice beansprucht aufgrund der vielen Elemente reichlich Platz.

Betrachten Sie für den Moment nur den linken oberen Fensterbereich. Dort sehen Sie die derzeit noch leere 3D-Unterwasserwelt. Um sie mit einem Fisch und somit einem ersten Objekt zu bevölkern, klicken Sie auf den Knopf Setup Scene oder wählen aus dem Menü Window | Perspectives | Setup Scene. Alice wechselt jetzt in die Darstellung aus Abbildung 3, was ein paar Sekunden dauern kann. Der Blick in die 3D-Welt nimmt den größten Teil des Hauptfensters ein.

Abbildung 3

Abbildung 3: In dieser Darstellung bevölkern Sie Ihre Welt mit Objekten.

Am unteren Rand finden Sie eine Palette mit allen zur Verfügung stehenden Gegenständen. Damit Sie in der Fülle der Objekte den Überblick behalten, sortiert Alice alle Gegenstände in Kategorien ein. Hinter Flyer Classes finden Sie beispielsweise alle Objekte, die fliegen können – derzeit ausschließlich Vögel. Mit einem Klick auf All Classes gelangen Sie wieder zur Übersicht zurück. Eine alternative Gruppierung wartet auf dem Register Browse Gallery By Theme. Dort finden Sie etwa hinter Sea alle Objekte, die sich für ein Unterwasserszenario eigenen. Schließlich können Sie auch auf dem Register Search Gallery nach einem bestimmten Objekt suchen.

Für das angepeilte Unterwasserszenario wechseln Sie auf das Register Browse Gallery By Theme und wählen den ocean. Halten Sie jetzt die linke Maustaste auf dem kleinen gelben Clownfisch gedrückt, ziehen ihn dann in die Unterwasserwelt, aber lassen dort die Maustaste noch nicht los. In der Welt erscheint jetzt wie in Abbildung 3 ein gelber Würfel. Ziehen Sie ihn mit der Maus an den Platz, an dem der Clownfisch erscheinen soll.

Im Beispiel fahren Sie an den linken unteren Fensterrand. Sie werden dabei merken, dass Alice das Objekt immer dicht über den Boden bewegt – für einen schwimmenden Fisch nicht besonders optimal, derzeit aber noch nicht zu ändern. Sobald Sie eine geeignete Position gefunden haben, lassen Sie die Maustaste los. Alice öffnet daraufhin das Fenster aus Abbildung 4. Es verrät, dass Sie jetzt in der 3D-Welt ein neues Objekt vom Typ ClownFish erstellt haben. Um es später einfacher weiterzuverwenden, sollten Sie dem Fisch im Feld name eine Bezeichnung geben (hier: Nemo) und dann mit OK das Fenster schließen.

Abbildung 4

Abbildung 4: In diesem Fenster geben Sie dem neu angelegten Objekt einen neuen Namen. In unserem Beispiel soll der Fisch Nemo heißen.

Hubwagen

Der kleine Nemo erscheint jetzt in der Unterwasserwelt. Ein grüner Kreis zeigt an, dass er gerade ausgewählt ist (Abbildung 5). Per Drag & Drop verschieben Sie den Fisch beliebig, mit Klicks auf einen der gebogenen Pfeile am unteren Rand der 3D-Welt verändern Sie bei Bedarf die Perspektive. Für das Beispiel belassen Sie jedoch die derzeitige Schrägansicht.

Abbildung 5

Abbildung 5: Mit den neuen Eigenschaften schwebt das Objekt jetzt ungefähr in der Mitte der Welt.

Am rechten Fensterrand finden Sie eine Palette mit allen Eigenschaften des kleinen Fischs (in Alice 2 verstecken sich diese auf dem Register properties links unten). Über die Ausklappliste neben Paint dürfen Sie Nemo eine andere Farbe geben. Der unter Opacity eingestellte Wert gibt an, wie durchsichtig der Fisch erscheint. Beim Wert 1.0 ist Nemo vollständig zu sehen, bei 0.5 nur noch halb.

Mit Vehicle ketten Sie Nemo an ein anderes Objekt an, wie etwa ein Boot. Er folgt dann automatisch allen Bewegungen dieses Objekts. Besonders interessant sind die Werte für Nemos Position und seine Größe (Size). Zunächst sollten Sie den Fisch etwas vom Boden anheben, damit er gleich frei schwimmen kann.

Dazu tragen Sie unter y den Wert 0.5 ein und drücken die Eingabetaste. Alice hebt den Fisch jetzt an (Abbildung 5). Analog würde ein anderer Wert unter x Nemo auf der Waagerechten verschieben, ein neuer z-Wert hingegen nach vorne und hinten. Die voreingestellte Größe von Nemo ist für das Beispiel perfekt.

Weltraum

Neben dem Fisch tummeln sich übrigens schon ein paar weitere Objekte in der Szene: Neben dem Bodenbelag gibt es auch noch eine Kamera, durch die Sie gerade in den Ozean schauen. Alle diese Objekte listet Alice in der linken oberen Fensterecke auf, wobei es das gerade angewählte Objekt gelb hinterlegt.

Auch die Kamera und der Boden besitzen Eigenschaften, die Sie verändern dürfen. Dazu klicken Sie links oben in der Ecke den Namen des entsprechenden Objekts an oder wählen es am rechten Rand aus der dicken Ausklappliste, die derzeit mit this.Nemo beschriftet ist. Auf diese Weise wechseln Sie etwa nachträglich den Bodenbelag. Auch die 3D-Welt selbst ist ein eigenes Objekt und trägt – etwas gewöhnungsbedürftig – den Namen this. Das gestattet jedoch, der gesamten Umgebung ein anderes Licht zu spendieren oder sie in Nebel zu tauchen: Wählen Sie aus der dicken Ausklappliste einmal this und betrachten Sie die Eigenschaften. Den Namen der übrigen Objekte ist ein this. vorangestellt, weil sie sich in der Umgebung befinden.

Nun wird es Zeit, Nemo etwas hin und her schwimmen zu lassen, wozu Sie einen passender Ablaufplan zusammen stellen. Kehren Sie über den Knopf Edit Code oder Window | Perspectives | Edit Code zunächst zur alten Darstellung zurück. Hier sehen Sie jetzt Nemo links oben in der Ecke. Direkt darunter finden Sie eine Liste mit allen Aktionen und Tricks, die Nemo auf Lager hat. So könnten Sie ihn etwas sagen (say) oder sich bewegen lassen (move). Alice bezeichnet alle diese Aktionen als Procedures.

Drehwurm

Nemo soll über den Bildschirm nach rechts schwimmen. Im Moment sieht er aber noch geradeaus, weswegen Sie ihn als Erstes nach rechts blicken lassen. Suchen Sie in der Liste die Prozedur turn (im Bereich orientation). Ziehen Sie diese Aktion mit der Maus auf die rechte, noch leere Seite an den Punkt drop statement here (unter Alice 2: Do nothing).

Alice möchte jetzt wissen, wohin sich Nemo drehen soll. Damit der Fisch anschließend nach rechts blickt, muss er sich selbst nach links rotieren. Entscheiden Sie sich folglich für Left. Anschließend gilt es noch die Frage zu klären, wie weit sich Nemo drehen soll. In diesem Fall ist der Wert 0.25 korrekt, was einer viertel Drehung um die eigene Achse entspricht (Abbildung 6). Um das prüfen, klicken Sie auf den Knopf Run. Es öffnet sich jetzt ein neues Fenster, in dem Nemo nach rechts schaut (Abbildung 7). Schließen Sie das Fenster wieder.

Abbildung 6

Abbildung 6: Sofern eine Prozedur eine Einstellung verlangt, wählen Sie diese bequem aus einer Liste mit Vorgaben aus.

Abbildung 7

Abbildung 7: Nemo dreht sich durch seine Welt. Den Programmablauf können Sie über die entsprechenden Knöpfe am oberen Rand pausieren und neu starten.

TIPP

Sie hätten Nemo auch schon in der Ansicht Setup Scene nach rechts ausrichten können, indem Sie dort rechts oben in der Ecke Rotation anklicken und dann einen der um Nemo sichtbaren Reifen mit der Maus zurecht ziehen.

Als Nächstes muss Nemo nach rechts schwimmen. Dafür sorgt die Prozedur move. Ziehen Sie diese aus der Liste am linken Rand nach rechts unter die turn-Aktion. Nemo selbst soll geradeaus schwimmen. Wählen Sie daher aus der Liste Forward. Bei einem Wert von 2.0 würde Nemo in der Mitte des Schirms stehen bleiben, bei 10.0 hingegen aus dem Blickfeld verschwinden. Klicken Sie deshalb Custom DecimalNumber an, tragen mit dem erscheinenden Taschenrechner den Wert 3.5 ein und klicken auf OK.

Wenn Sie jetzt Run aktivieren, schwimmt Nemo auf die rechte Seite. Das Ganze läuft allerdings noch relativ schnell ab. Klicken Sie deshalb auf add detail in der move-Aktion. Um die Dauer des Schwimmens zu beeinflussen, wählen Sie die Duration und dann 2.0. Damit verlangsamt die Animation auf die Hälfte.

TIPP

Wollen Sie eine Prozedur aus dem Ablaufplan wieder loswerden, ziehen Sie sie einfach zurück in die Liste im linken unteren Bereich. Dort erscheint dann ein Mülleimer-Symbol, über dem Sie die Maustaste loslassen.

Für immer und ewig

Am Endpunkt muss Nemo wieder umdrehen. Also ziehen Sie wieder die Prozedur turn unter die anderen beiden im Ablaufplan. Nemo muss sich rechts herum drehen (Right) und zwar um den Wert 0.5 – damit schaut er wieder nach links. Mit einer weiteren Aktion move lassen Sie ihn an seine Ausgangsposition zurück schwimmen. Die Schwimmrichtung ist wieder geradeaus (Forward) um den Wert 3.5. Diesen geben Sie wieder über Custom DecimalNumber ein. Die Geschwindigkeit können Sie der Einfachheit halber auf ihrem Standardwert belassen.

Abschließend lassen Sie Nemo wieder geradeaus schauen. Dazu ziehen Sie noch einmal die Prozedur turn in den Ablaufplan, lassen Nemo nach links rotieren (Left) und zwar um 0.25. Das Programm sollte jetzt wie in Abbildung 8 aussehen. Sobald Sie es per Run starten, schwimmt Nemo nach rechts, wendet dort, schwimmt zurück und schaut wieder geradeaus.

Abbildung 8

Abbildung 8: Diese Befehlskette lässt den Fisch wenden, nach rechts schwimmen, wenden, wie der nach links schwimmen und dort dann erneut geradeaus schauen.

Damit Nemo erneut nach rechts schwimmt, müssten Sie jetzt das Programm neu starten. Erfreulicherweise kann Alice auch Prozeduren in einer Schleife laufen lassen. Dazu schließen Sie das Vorschaufenster wieder und werfen im Hauptfenster einen Blick an den rechten unteren Rand. Dort stellt Alice ein paar Spezialaktionen bereit. Ziehen Sie while in Ihrem Ablaufplan über alle bisherigen Prozeduren. Alice zeigt Ihnen dabei mit einer grünen Linie an, wo es die Aktion einfügen würde, wenn Sie die Maustaste losließen.

Aus dem aufklappenden Menü wählen Sie true – dazu gleich mehr. Verschieben Sie jetzt alle bisherigen Prozeduren zwischen while und loop. Das Ergebnis sollte wie in Abbildung 9 gezeigt aussehen. Damit haben Sie eine Endlosschleife definiert: Solange (while) der Wert true gleich true ist – also immer – führt Alice alle Prozeduren bis zum loop aus. Nemo schwimmt also endlos hin und her. Das können Sie direkt prüfen, indem Sie auf Run klicken. Um das Programm anzuhalten, schließen Sie einfach das Fenster.

Abbildung 9

Abbildung 9: Die while-Schleife lässt den Fisch endlos im vorgegebenen Bewegungsmuster hin und her schwimmen.

Ausblick

Die neben while stehende Prüfbedingung ist offensichtlich trivial. Stattdessen könnten Sie hier auch eine komplexere einstellen und Nemo etwa nur dann losschwimmen lassen, wenn ein anderer Fisch mit ihm kollidiert. Bei der Zusammenstellung einer Prüfbedingung helfen insbesondere die Functions, die Sie auf dem gleichnamigen Register finden. Diese Funktionen liefern Werte zurück wie etwa Nemos Aufenthaltsort, seine Größe oder seine Farbe.

Sobald Sie mit der Maus über eine der Funktionen fahren, markiert Alice die Stellen im Ablaufplan, an denen Sie diese einsetzen können. Genau wie Nemo besitzen auch die anderen Objekte in der 3D-Welt Prozeduren und Funktionen. Alice listet diese auf, wenn Sie sie in der Welt anklicken oder sie aus der überdimensionalen Ausklappliste unterhalb der Vorschau auswählen.

Abschließend noch ein kleiner Tipp: Nemo besteht aus mehreren Einzelteilen, die Sie unabhängig voneinander bewegen beziehungsweise manipulieren dürfen. Möchten Sie den Fisch etwa mit dem Schwanz wedeln lassen, wählen Sie aus der großen Ausklappliste den Punkt this.Nemo, fahren dann über das kleine Dreieck und entscheiden sich für this.Nemo.getTail. Alle jetzt in der Liste darunter angezeigten Prozeduren und Funktionen beziehen sich nur noch auf den Schwanz. Auf diese Weise können Sie den Schwanz etwa während des Schwimmens animieren.

Fazit

Programmieren ist gar nicht so schwer: Mit Alice genügen wenige Mausklicks, um einen Fisch durch das Meer schwimmen zu lassen. Die einfache Animation kratzt jedoch nur an den Möglichkeiten der Entwicklungsumgebung. Sollten Sie jetzt an dieser Gefallen gefunden haben, experimentieren Sie einfach mit den übrigen Prozeduren und Funktion.

Dazu sollten Sie sich aber besser ein verregnetes Wochenende frei halten: Alice macht schnell süchtig und lässt die Zeit vergessen. Einen Überblick über die Benutzeroberfläche verschaffen die Online-Hilfe [2], die ausführlicheren Howtos und Screencasts der "Alice 3.1 Curriculum Resources" [3] sowie diverse englischsprachige Bücher, die sich aber durchweg noch auf Alice 2 beziehen [4]

Tip a friend    Druckansicht beenden Bookmark and Share
Kommentare