Auftrag fertig…

Juni 12, 2007

…die Buttons mussten warten 🙂

fanus_gmbh.jpg

Auftraggeber: FANUS GmbH

Marksegement: hauptsächlich Pflanzenlogistik (ohne Scheiß, das gibt’s wirklich)

Arbeit: Neugestaltung Internetauftritt | Logo

Advertisements

Kontra: Gleichschaltung aller Teilnehmer

Versuchskaninchen – im wahrsten Sinne der Wortes – sind alle Teilnehmer des Seminars E-Learning-Technik, meine Wenigkeit eingeschlossen. Eine bunt zusammengewürfelte, kritische Menge an StudentInnen, bei der jeder unterschiedlichste Voraussetzungen, Vorwissen und Technikaffinität mitbringt –  viele betreten mit Blog’s, Wikis sowie dem Austesten diverser Softwarelösungen völliges Neuland, manche eher weniger. Und genau in dieser Vielschichtigkeit der Teilnehmer liegt, zumindest meiner Meinung nach, der Pferdefuß des Konzepts: Formuliere ich meine Blog-Einträge für Laien? Oder für fortgeschrittene Nutzer? Oder für Profis? Wie viel Vorerfahrung mit der Software ist bereits vorhanden, was muss ausführlicher erklärt werden? Warum werden Inhalte doppelt (im Blog und im Wiki) abgelegt? Wäre eine systematische Verlinkung der Blogs nicht ausreichend? Oder könnte man sich auf ausführliche Abhandlungen im Wiki beschränken? Unsere Seminarleiter sind zweifelsohne hoch motiviert und geben auch telefonisch unbürokratische Hilfe. Aber alle Teilnehmer „über einen Kamm zu scheren“ und zumindest teilweise nach dem „Laizzes-Faire-Prinzip“ agieren zu lassen, ist nicht der optimale Ansatz. Zum Lösen der Mediator-Aufgabe etwa habe ich mir keinen einzigen Blog- oder Wiki-Eintrag zum Gemüte geführt. Eine „Einteilung“ der Teilnehmer nach Vorerfahrung gleich zu Beginn des Seminars wäre wichtig gewesen, um eine gewisse „Frustration“ auf der einen und „Langeweile“ auf der anderen Seite zu vermeiden. Der Zeitaufwand zum Erstellen der Inhalte ist teilweise extrem hoch – erst recht in der ISWI-Woche (daher auch der verspätete Fireworks-Eintrag)

Pro: Technische Themenvielfalt

Das technische Themenspektrum des Seminars ist sehr breit aufgestellt und – zumindest für mich – durchgehend interessant. Der Tutorblog gibt jederzeit Überblick auf wichtige Informationen und Aufgaben, die etwas unübersichtlich daher kommende „Protopage“-Zentrale als zentrales Linkverzeichnis zu allen Blogs ist praktisch. Alles in allem wird im Seminar mit vielen Werkzeugen (Blog, Wiki, Chat, Skype…) des Web2.0-Mitmach-Internets hantiert, die Sinn ergeben, aber die Menge an unterschiedlichen Seiten und Informationsquellen führt teilweise auch zu einer gewissen „Byte-Überfrachtung“.

Alles in allem ist das fortschrittliche, technikorientierte Konzept des Seminars zu begrüßen und führt vor allem Laien in vielschichtige Netz- und Softwarelösungen ein.   

Für die Aufgabe des zweiten Themenkomplexes (Umsetzung einer einfachen Seitennavigation) habe ich mich für das Autorenwerkzeug „Mediator 8 Pro“ der Softwareschmiede MatchWare entschieden. Zwei verschiedene Testversionen (Pro / Exp) stehen auf dem Internetauftritt des Herstellers zur Verfügung, eine Registrierung ist MIT ANGABE der eigenen E-Mail-Adresse notwendig, leidige Werbebotschaften lassen sich jedoch durch das entsprechende Deaktivieren eines „Häkchens“ im Feld „Infos per Mail von MatchWare“ während der Registrierung unterbinden.

Download und Installation

Der Download der rund 50 Mbyte großen Datei läuft mit durchschnittlich 248 KByte/s erfreulich flott über den Datenäther, anschließend leitet eine Setup-Routine (nach Doppelklick auf die heruntergeladene Datei „mediator80_pro_ge_demo.exe“) durch den weiteren Installationsprozess.

Nach der Installation kann das Softwareprodukt unter „Start“ – „Alle Programme“ – „MatchWare“ – „Mediator 8.0 Pro“ – „Mediator (Demo)“ gestartet werden.

Anmerkung: Eine kommerzielle Nutzung ist bei der Demo-Version untersagt, zusätzlich ist die Seitenanzahl auf 5 Stück pro Projekt (die nur 7 Tage nutzbar sind) begrenzt. Auch der Medienkatalog fehlt im Testprodukt – wie dem auch sei, immerhin lassen sich die Grundfunktionen der Vollversion genauer unter die Lupe nehmen.

Nach dem Start des „Mediators“ leitet ein recht übersichtlicher Assistent durch den weiteren Projektverlauf. Drei verschiedene Auswahlmöglichkeiten: „Standard (CD-Rom etc)“, „Flash“ und „HTML“ stehen dabei zur Verfügung. Danach lässt sich der gewünschte Bildschirmmodus: „Fenster(Window)“ , „Ganzer Bildschirm mit Rand“ oder „Ganzer Bildschirm(Fullscreen)“ selektieren um im letzten Schritt des Assistenten die gewünschte Auflösung – die man im Übrigen auch an die individuellen Vorstellungen anpassen kann – auszuwählen. Da das Ziel eine „webbasierte Anwendung“ sein soll, entscheide ich mich für die HTML-Variante.
001_mediator8_pro_assistent1.jpg

001_mediator8_pro_assistent21.jpg

001_mediator8_pro_assistent3.jpg

Anmerkung: Ob MatchWare’s „Mediator 8.0 Pro“ das geeignete Werkzeug für Flash- bzw. HTML-Projekte ist, bleibt fraglich. Für beide bieten alternative Lösungen, etwa „Adobe Dreamweaver“ oder „Macromedia Flash MX“, wesentlich umfangreichere Optionen. Außer Frage steht jedoch, dass der „Mediator“ für CD-ROM-Produktionen ein passables Software-Instrument darstellt.

Realisierung der Projektaufgabe

Nach den obligatorischen Abhandlungen des Projektassistenten erscheint eine leere Seite, die es nun gilt, mit Inhalten zu füllen. Auf der linken Seite des Mediators befinden sich verschiedene Auswahlfenster (Eigenschaften, Seiten, Objekte), darüber eine Werkzeugleiste, aus der unter anderem die Auswahlfunktion, Textfelder, Schaltflächen und Bilder selektiert werden können.

001_mediator8_pro_schaltflaeche_03.jpg

Abb. 1: Die Werkzeugleiste des Mediator

Prinzipiell ist es von Vorteil, zunächst eine Prototyp-Seite mit Navigationselementen (Für die in der Aufgabenstellung vorgegebenen Rubriken „Technik“, „Content“ und „Organisation“), Textfeldern, Überschriften und dem Druck-Button anzufertigen. Diese Elemente der fertigen Prototyp-Seite brauchen später nur noch in die anderen Seiten kopiert werden (die Navigationselemente sind schließlich in allen drei Seiten gleich) – die variablen Inhalte wie Texte und Überschriften lassen sich später schnell anpassen.

Schaltflächen für das Navigationsmenü anlegen

Zunächst wird ein Navigationsbutton (In der Werkzeugleiste den Button „Schaltfläche“ auswählen, auf die Arbeitsfläche wechseln und „ein Rechteck bei gedrückter linker Maustaste ziehen“) angelegt.

001_mediator8_pro_schaltflaeche_01.jpg

Abb. 2: In der Werkzeugleiste kann der Button „Schaltfläche“ zum Anlegen des Navigationsmenüs ausgewählt werden .

Danach kann das Auswahlwerkzeug in der Werkzeugleiste aktiviert werden, um anschließend den angelegten Button im Arbeitsbereich auszuwählen. Der voreingestellte Text kann gelöscht werden, da für die Navigationsleiste externe Bilder (vgl. Material) zur Verfügung stehen. Anschließend kann man im Fenster links („Eigenschaften von Schaltfläche…“) den Button „Bild“ anklicken und wählt im Feld „Bildpfad normal“ die zur Verfügung gestellte Vorlage aus.

001_mediator8_pro_ereignisse_03.jpg

Abb. 3: Schaltflächen mit individuellen Bildern versehen

Gegebenenfalls kann nun die Größe der Schaltfläche angepasst werden (Im Arbeitsbereich die Schaltfläche auswählen und an den schwarzen Randpunkten mit gedrückter linker Maustaste ziehen)

001_mediator8_pro_auswahlwerkzeug.jpg

Abb. 4: Mit dem Auswahlwerkzeug können Elemente auf der Arbeitsfläche justiert, verzerrt und (später) mit bestimmten Aktionen ausgestattet werden.

Die so erzeugte Schaltfläche muss in einem nächsten Schritt mit der ersten Seite verknüpft werden. Dazu genügt ein Klick im Kontextmenü (rechte Maustaste – Ereignisse), bei der per „Drag&Drop Aktionen miteinander verknüpft werden können. Dazu einfach im linken Bereich „Mausklick“ und im oberen Bereich „Seitenwechsel“ in das zunächst leere Feld ziehen und den passenden Seitennamen angeben.

001_mediator8_pro_ereignisse_01.jpg

001_mediator8_pro_ereignisse_02.jpg

001_mediator8_pro_ereignisse_05.jpg

Abb. 5 – 7: Schaltflächen mit bestimmten Ereignissen verbinden.

Auf diese Weise können nun nacheinander drei Schaltflächen angelegt werden, die zunächst alle auf die eine vorhandene Seite verweisen.

Textfelder für Überschriften und Textinhalte

Um die Prototyp-Startseite fertig zu stellen, werden Textfelder für die Überschrift und den Textinhalt benötigt. Dazu klickt man in der Werkzeugleiste auf den Button „Text“ und zieht bei gedrückter linker Maustaste im Arbeitsbereich ein entsprechendes Feld. Per Doppelklick lassen sich nun Schriftart- und Farbe auswählen. Die in den Vorlage-Dokumenten (Seite1.doc, Seite2.doc, Seite3.doc) bereits vorgehaltenen Inhalte lassen sich bequem per „Copy&Paste“ einfügen.

001_mediator8_pro_ereignisse_03_textfeld.jpg

Abb. 8: Textfelder editieren

Titelbild einfügen

Fehlt noch das Titelbild, welches auf allen drei Seiten erscheinen und im Beispiel am unteren Bildschirmrand positioniert werden soll. Dazu in der Werkzeugleiste den Button „Bild“ auswählen und im Arbeitsbereich mit gedrückter linker Maustaste ziehen. Danach kann das Pixelmaterial (titel.gif) ausgewählt, positioniert und ausrichtet werden.

001_mediator8_pro_bild.jpg

Abb. 9: Bilder einfügen

Neue Seiten anlegen, Inhalte ändern

Nachdem das Layout der ersten Seite steht, werden im Fenster links (Seiten) per Kontextmenü (rechte Maustaste – „Neu“) zwei weitere Seiten angelegt, da schließlich drei Stück („Technik“, „Content“ und „Organisation“) davon benötigt werden. Diese zunächst leeren Seiten werden nun mit den fertigen Elementen der ersten Seiten (In der Werkzeugleiste den Button „Auswahlwerkzeuge“ anklicken und im Arbeitsbereich bei gedrückter Strg-Taste und linker Maustaste alle Elemente markieren, anschließend im Menü unter „Bearbeiten“ –
Kopieren“ wählen, auf die zweite Seite wechseln (linkes Fenster „Seiten“) und im Menü „Bearbeiten“ – „Einfügen“ klicken – fertig!

001_mediator8_pro_schaltflaeche_04.jpg

Abb. 10: Neue Seite anlegen

HTML produzieren

Nachdem alle drei Seiten erstellt, verlinkt und mit Inhalten gefüllt sind, soll im letzten Schritt das Mediator-Projekt in das HTML-Format exportiert werden. Dazu im Menü „Datei“ – „Runtime erzeugen“ – „Schnell“ wählen und als Ausgabeformat „HTML(Website)“ markieren. Der Ausgabeordner kann ggf. modifiziert und auf entsprechenden Webspace geladen werden.

001_mediator8_runtime_erzeugen.jpg

001_mediator8_runtime_erzeugen2.jpg

Abb. 11-12: Projekt in HTML konvertieren

Finales HTML-Produkt:

001_mediator8_pro_final_html.jpg

FERTIGES HTML (externe Seite)

Probleme:

Dynamische Navigationselemente mit Mausover-Effekt ließen sich im Mediator ebensowenig einbinden wie die gewünschte Druckfunktion.

Weiterführende Links:

Einführung

Drupal, ein unter der GNU-Lizenz (freie Software) stehendes, neudeutsch auch als „Content Management System“ (CMS) bezeichnetes, dynamisches Dokumentenverwaltungssystem für Internetseiten besitzt mit einer Vielzahl an Erweiterungsmöglichkeiten (über Module), einer schon fast restriktive anmutenden, interaktiven Benutzerverwaltung und durch die Unterstützung verschiedenster Internet-Kommunikationsmittel typische Eigenschaften einer so genannten „Web 2.0“-Anwendung – wenn auch die Bezeichnung als „E-Learning“-Anwendung etwas abgehoben wirkt – vielmehr ähnelt Drupal mit seiner hierarchischen Nutzerverwaltung einem Internet-Redaktionssystem – gespickt mit allerlei technischen Raffinessen und einer breiten Unterstützung durch die Internet-Gemeinschaft.

 

Das Drupal durchaus auch das Potenzial für prominentere und größere Projekte bietet, zeigt beispielsweise auch der Internetauftritt des „New York Observer“.

Typische Drupal-Startseite

Abb.1: Startseite von Drupal

Drupal -frisch serviert

Drupal kann entweder auf einem „sehr großen“ Rechenknecht (Server) installiert (wobei es auch so genannte „Hosting“-Anbieter gibt, die das komplette System vorinstalliert zur Verfügung stellen) werden, oder auf einem lokalen Computer (hier empfiehlt sich das auch für Einsteiger praktische PHP/MySQL/Apache-Dreigespann XAMPP) nach Gutdünken ausgetestet werden.

Aktuell ist Drupal in Version 4.7 bzw. 5.1 erschienen.

Video: Installationsprozedur von Drupal unter dem „Pseudo-Betriebssystem“ MAC OSX

Dokumentenarten

 

Dupal bietet neben einer Volltextsuche auch die Möglichkeit an, Beiträge – ähnlich wie bei so genannten „Wiki’s“ – zu versionieren. Mit Modulen lassen sich diverse Dokumentenarten wie HTML, OPML, DOC, Taxonomien, CSV-Daten u.s.w. importieren bzw. exportieren. Eine Liste mit passenden Erweiterungs-Modulen findet sich hier.

 

Kommunikationswerkzeuge

Die Liste an Kommunikations-Modulen sprengt mit 95 Einträgen den zeitlichen Rahmen dessen, was im Seminar „Elektronisches-Lernen-Technik“ abgehandelt werden kann. Eine einfache Publikations-Funktion (auch „Blog“ genannt) wird in der Drupal-Grundausstattung mitgeliefert. Prinzipiell können über das integrierte Nutzer-System beliebig viele Schreiberlinge an einem Projekt-Text arbeiten oder einzelne Beiträge veröffentlichen. Drupal lässt sich aber auch mit Chat-Funktionen, Freundeslisten (umgangssprachlich auch als „Buddy-Liste“ geläufig), Forum (das weltweit am häufigsten anzutreffende PHPBB kann ebenfalls integriert werden), Gemeinschafts-Schlagwörtern (Community Tags), Favoritenlisten, Flickr-Bildmaterial, Gästebüchern, so genannten „Organic groups“ (Nutzer können damit eigene Gruppen verwalten, was beispielsweise als Tutor-Funktion sinnvoll erscheint) et cetera erweitert werden.

 

Wichtig: Der Zeit- und mitunter hohe Testaufwand zum Einbinden externer Module in Drupal sollte dabei jedoch keineswegs unterschätzt werden.

Ergänzende Links:

 

 

Hallo Welt!

Mai 2, 2007

Das ist mein erster Weblog und mich hat das Blogging-Fieber schon voll subjektiv erwischt! Hier findet ihr später Info’s zum Seminar E-Learning Technik.