Web
Hier in dieser Rubrik sollen Ideen, vorallem aber ihre Umsetzungen, zur Modifikation von Webseiten vorgestellt werden.
Es gibt viele, leicht programmierbare Skripts, die der Attraktivität der eigenen HP auf die Sprünge helfen.
Typo3-Einführung
Die Referenzliste von Typo3 ist so gigantisch lang, dass jeder exemplarischer Auszug eine Farse darstellen würde. Überall dort, wo viel Content schnell und automatisiert veröffentlicht wird und man darauf angewiesen ist im Team zu arbeiten, findet Typo3 Anwendung.
Typo3 ist eine großartige (Online-)Anwendung, die durch viele fachlich exzellente Foren begleitet und weiterentwickelt wird. Ein Besuch auf der Internetpräsenz ist sicherlich immer erfolgversprechend. Und noch besser: Typo3 ist vollkommen kostenlos. 1997 wurde es von Kasper Skårhøj als Open-Source entwickelt.
Open-Source wird sicherlich nicht selten mit Einfachheit in der Benutzung assoziiert. Das trifft aber nicht zuletzt bei Typo3 nicht zu. Zwei Gruppen arbeiten mit Typo3: die Administratoren und die Anwender. Manchmal gibt es Mischformen. Der Administrator muss die Realisierung, die Installation von Typo3 fachgerecht initiieren. Das ist nicht gerade leicht. Der Anwender hingegen sorgt sich um neue Inhalte, schreibt Texte und führt Korrekturen durch. Aber auch das, wenngleich einfacher, muss gelernt sein.
Um einen möglichst schnellen Einstieg in die Anwendung von Typo3 zu ermöglichen und im Rahmen einer Schulung wurde eine Typo3-Einführung für Anwender erstellt.
Kleinere Fehler schleichen sich immer und überall ein. Schreiber dieses und Autor bittet Sie deshalb, sich hier zu melden, falls Ihnen Fehler oder Unzulänglichkeiten auffallen. Kreative und konstruktive Kritik ist immer willkommen!
Ganz im Sinne von Typo3: Inspiring people to share.
SQL und Datenbanken
Man kennt es, liebt oder hasst es. Bestandsaufnahmen, Rechnungen und To-Do-Listen sind schnell am Computer erstellt; die Flexibilität, komfortabel Berechnungen durchzuführen und „Was-wäre-wenn“-Analysen der Art, wie verändern sich andere Berechnungswerte, wenn ein spezieller manipuliert wird, tragen sicherlich zur Popularität bei.
Wird das Projekt dann aber diffiziler, empfehlen sich (relationale) Datenbanken, deren Aufgaben die „Verwaltung und die Manipulation von komplexen Datenstrukturen“ ist. Gezielte Abfragen und Berichte (Ausgaben), speziell gruppiert und sortiert, sind nur hier effizient zu erstellen.
Bei relationalen Datenbanken stellt man die Datenstruktur zunächst abstrakt dar. Es besteht eine gewisse Analogie zum „Objekt-orientierten Programmieren. In einem Klein-Unternehmen gibt es beispielsweise Kunden mit bestimmten Eigenschaften (Vor- und Nachname, Anschrift etc.), es gibt Rechnungen (Datum, bezahlt am, Menge, Einzelpreis, Gesamtpreis, Rabatt etc.) und Lagerbestände (Menge, Einzelpreis, Ort etc.). Verknüpft sind diese drei Tabellen (es kann beliebig komplex werden) über sog. Primär-Schlüssel, in diesem Fall der Rechnungs-Nummer und der Kundennummer. Konkret ist z.B. möglich, Abfragen zu generieren, welcher Kunde, welche Materialien bestellt und bezahlt hat: eines der Grundvoraussetzungen, ein Unternehmen erfolgreich zu verwalten.
Auswahl-Felder verringern Schreibfehler, Inhaltsprüfungen testen, ob eine valide Email-Adresse eingeben wurde und Konsistenz-Prüfung verhindert Duplikate: sind Funktionsbeispiele.
Datenbanken, gerade bei vielen Datensätzen, müssen vorab gut projektiert und dokumentiert werden. Abfragen erhalten z.B. das Präfix „qry“, Berichte „rpt“ und Formulare „frm“.
Hier wurde beispielsweise ein Film-Archiv realisiert, das die Verwaltung von allen gängigen Medien (auch VHS-Kassetten etc.) erlaubt. Jeder Film erhält eine eindeutige Film-ID, jeder Schauspieler eine Personen-ID, genannt PID. Über die PID können jedem Film beliebig viele Schauspieler hinzugefügt werden.
Zur schnellen Übersicht, wurde ein Begrüßungs-Formular erstellt, mit dem alle Funktionen per Mausklick erreichbar werden.
Wie greift man auf eine Datenbank zentral, am besten auf einer Website zu? Man kann Interfaces in PHP oder Java programmieren, was sehr gut funktioniert. Typo3-Anwender dürfen sich aber über die Extension „WFQBE“ freuen, die Datenbanken ansteuert und dynamisch im Front-End ausgeben kann. Mit etwas SQL-Kenntnissen können hier auch neue Abfragen generiert werden.
Die Datenbank wird ohne Gewährleistung -wie auch sonst?- zum Download bereitgestellt.
Point-And-Shoot-Spiel
60 Sekunden Pause, das muss man haben. Zwei Tendenzen in der “Gamer-Szene” sind zu beobachten: Einerseits die Tendenz zu Action- und Rollenspielen, die echter erscheinen als die Realität; zum Anderen der Drang zu einfachen, kurzweiligen Spielen für zwischendurch, der sogenannten “kleinen Pause”.
(Action-)Spiele mit brillanter Grafik, hoher Auflösung und ausgeklügelter Physik-Engine benötigen viel Speicherplatz und einen leistungsfähigen, hochmodernen Bildprozessor, eben einer Grafikkarte. Nötige finanzielle Mittel und Motivation vorausgesetzt, nimmt „Spielen“ viel Zeit in Anspruch, die dadurch wie im Fluge davon rauscht.
Browsergames hingegen, findet man im Internet auf Spieleplattformen häufig. Sie benötigen nur einen Browser, weitere Installationen fallen weg. Es ist einleuchtend, dass solche Spiele keinen Anspruch auf Dreidimensionalität und perfekter Grafik haben. Für manchen dennoch ein idealer Pausenfüller.
Das unten gezeigte Browsergame sollte zur Umstellung von der veralteten Action-Script Version 2 auf die neue Version 3 dienen. Beide Versionen unterscheiden sich in nahezu allen Punkten, so dass eine neue Einarbeitung erforderlich ist. Der Syntax wurde standardisiert und damit der Quellcode übersichtlicher. Ziel des Spiels ist es, möglichst viele Ballons in einer Minuten mit der Reißnadel zum Platzen zu bringen. Ein zerstörter Ballon gibt dem Spieler 5 Punkte. Der Schwierigkeitsgrad nimmt mit vergangener Zeit zu. Am Ende dieses kleinen Spiels wird der gegenwärtige Rekord angezeigt. Es ist nicht so einfach mehr als 400 Punkte zu erwirtschaften.
Auf die Nadel, fertig, los!
Kurzer Tipp: Man sollte das Spiel nach 10 Sekunde Spielzeit nicht unterschätzen…
Vorträge über Flash
In unserer modernen Zeit ist Dynamik sehr wichtig. Fernsehen, Computer-und Konsolenspiele, all das ist ohne Bewegung nicht vorstellbar. Bewegung ist interessant, Statik ist langweilig, so ist oft die unterbewusste Einstellung der Menschen.
Auch das Internet wurde in den letzten Jahren beweglicher. Mit Animationen, wie die obige, wird Werbung gemacht, Schaltflächen designt und vieles, vieles mehr.
Animation erstellen ist nicht schwer, wenn man das richtige Werkzeug dazu hat. In 2 schulischen HTML bzw. Informatikkursen mit Schwerpunkt auf dem Internet durfte Schreiber dieses bereits 2 Vorträge über die Erstellung von Animationen abhalten und das Interesse des Auditoriums nimmt zu.
Wir hangeln uns meist von einem einfachen Bewegungstween einer nach rechts rollenden Kugel, bis zu Formtweens und leichten ActionScripts - der Programmiersprache von Animationen solcher Art.
Die obere Animation stammt aus einem solchen Vortrag. Sie stellt die erste Stufe dar, die zusammen mit Herrn Jopski erreicht wurde. Im Kurs von Herrn Neumann bauten wir, während des genannten Vortrages, die Animation um. Neu dazu kamen, eine Schaltfläche “Nochmal abspielen” und einfache Scriptanweisungen, wie “loadmovie” oder “stop”.
Hiermit ist aber noch nicht mal annähernd das erreicht, was - und vorallem wie - man alles animieren kann.
Flashcomic
Bitte vorstellen zu dürfen: Mister Dude. Die gezeigte Reaktion von Mister Dude resultiert auf die Frage:
Machst du deine Hausaufgaben gleich nach der Schule? - diese Form der Zustimmung ist durchaus äußerst selten anzutreffen, andererseits im Angesicht inflationärer Arbeitsverteilung an deutschen Schulen logisch begründbar.
Animationen müssen nicht immer trocken sein. Es handelt sich um eine Einzelbildanimation mit niedriger Bildrate, eine Art Stop-Motion-Effekt.
Mit Flash kann man, indem die Bildrate erhöht wird, kleine Cartoons erstellen. Ein Grafiktablett ist dem Flasher sehr nützlich.
Homepage in Flash
HTML geflasht.
Um das Spektrum der Möglichkeiten von Flash anzudeuten, betrachte man sich die kleine Demo-Homepage unten. Sie ist komplett im swf-Format erstellt und ermöglicht so eine höhere Dynamik, Visualität und Modernität.
Die Performance leidet bei Nutzern mit niedrigeren Übertragungsraten. Außerdem blocken manche Browser aktive Skripte.
Skriptspiele
Einfach mal entspannen. Keine Lust mehr auf Alltag? Lust zu relaxen? Mit Flash und Kenntnissen in AktionSkript lassen sich schnell kleine Animationen, beziehungsweise Spielchen, entwickeln.
Die linke Animation lässt einen Bumerang am Strand fliegen. Das Hintergrundbild stammt von der Abschlussfahrt nach Frankreich im Jahre 2006. Mit den Schaltflächen wird der Wurfbogen gesteuert. Er kann bewegt und gedreht werden. Achtet auf die Veränderung der Wurfbahn!
Es handelt sich nicht um den Originalhimmel. Dieser wurde entfernt und durch einen linearen Farbverlauf nachcoloriert. Wenn man das nicht weiß, fällt es gar nicht auf.
Rechts fällt ein blauer Ball auf die Wiese. Dabei werden die Sprünge gezählt und links oben dargestellt. Bei 12 Sprüngen bleibt der Ball stehen. Es soll gezeigt werden, dass Vorgänge vom Programm ausgewertet werden können.
Ganz unten ist ein Beispiel für eine Image-Map. Man könnte das auch in diesem Fall Promenade nennen. Indem ihr auf die Seiten (rechts, links) oder auf die Mitte des Bildes klickt, wandert ihr durch das Gelände vor dem Theater Rüsselsheim. Natürlich nur virtuell. Diese Prinzip wird gerne für Stadtführer oder zur Präsentation von Gegenständen verwendet.
Tweening
Probier’s mal mit … Bewegung. Bewegung ist nicht gleich Bewegung. Bei Animationen ist unter Form-, Masken- und Bewegungstweenings zu unterscheiden.
Die linke Animation zeigt die “Quadratur des Kreises”. Aus einem Kreis wird ein Quadrat und anschließend ein Polygon. Nicht nur die Form der Objekte ändert sich, sondern auch ihre Farbe und ihr Hintergrund. Das Ergebnis ist harmonisch und erinnert an eine Musikvisualisierung.
Mittig ist das StudioCD-Logo zu finden. Ganz im Sinne von James Bond wird der Schriftzug durch die Maskentechnik eingeblendet. Die Animation gelingt durch ein Bewegungstween mit Transformationen.
Ganz unten spielt jemand Football am Strand. Das Hintergrundbild stammt ebenfalls aus der Abschlussfahrt nach Frankreich. Mit einem Pfadtweening dreht sich der Ball auf einer vorbestimmten Laufbahn. Nach Ablauf der Animation findet eine “Goto-and-Play”-Aktion statt.
Zuordnungspiel
Game Over! Fade-Ins und Outs gelingen durch Veränderung der Alphawerte in Flash. Langweilig! Jetzt ist der Besucher selbst an der Reihe für Dynamik zu sorgen.
“Drag and Drop” ist das Stichwort hierfür. Ziel des kurzen Spiels ist es, die zwei Bilder richtig zu betiteln. Beide Aufnahmen stammen aus Frankreich. Kennt ihr euch aus - dann ist es leicht?
Dynamische Textausgaben und die Beweglichkeit erzeugt man durch AktionSkripts. Es können so viele Bilder wie nötig eingesetzt werden, da man den Quelltext für jedes weitere Element duplizieren kann. Nur die Variablendefinition muss verändert werden.
Die benötigten Codeelemente sind Grundkenntnisse.
Ein Zuordnungsspiel mit mehr als 10 Bildern ist durchaus möglich und leicht umsetztbar.
Auf diese Weise können auch Formulare in Flash erstellt werden.
Das Spiel ist primitiv und soll die Möglichkeit verdeutlichen, dass der Besucher eine Seite verändern kann, auch interaktives Prinzip genannt.