Das Navigationkonzept wurde hingegen neu erstellt und arbeitet ohne Seitenreloads, da die Übergänge der einzelnen Seiten teilweise mit Animationseffekten realisiert wurden. Die Inhalte der neu angeklickten Seiten werden per AJAX nachgeladen.

Als Javascript-Framework kamen die mootools zum Einsatz. Da dieses auch bei vielen TYPO3-Extension verwendet wird bietet sich diese Bibliothek an. Neben den AJAX-Calls sind die mootools auch für die Animationseffekte eingesetzt worden.

Für werkraum und auch für mich persönlich gewinnen Webseiten mit AJAX-Navigation immer mehr an Bedeutung. Allerdings benötigt man eine gewisse Erfahrung, um diese Technologie sinnvoll einzusetzen und den eventuellen Nebeneffekten Herr zu werden.

Mit SWFAddress können relativ einfach Deeplinks und eine funktionierende Browserhistorie realisiert werden. Für werkraum war es bei diesem Projekt eine besondere Herausforderung, die Animationseffekte während des Ladeprozesses beim Seitenübergang zu kontrollieren, damit diese weder Flackern noch “Herumspringen” von Inhalten verursachen. Dies konnte durch Verketten der einzelnen Lade- bzw. Animationsprozesse erzielt werden.

Die Inhalte, welche per AJAX nachgeladen werden natürlich auch von TYPO3 gerendert. Über get-Parameter wird gesteuert, dass keine unnötigen Informationen oder Headerdaten bei AJAX-Anfragen versendet werden.

Im Mittelpunkt der Webpräsenz steht eine Bildergalerie, die über eine animierte Thumbnailnavigation mit 2 Ebenen verfügt. Diese wurde mit dem neuen Extension-Framework von TYPO3 “extbase” und der Templateengine “fluid” implementiert.

Am Ende steht nun eine Seite mit einer schlichten Bildergalerie, die durch ein pfiffiges Navigationskonzept Spaß macht.

Für die Umsetzung der Seiten nutzen wir das Gaia Flash Framework, das bei der Erstellung von Flash-basierten Internetseiten wesentliche Vorteile bringt. So werden etwa die einzelnen Unterseiten und die Menustruktur über eine XML-Datei (nämlich die site.xml) definiert, welche das Gaia Framework parst und – entsprechend den darin enthaltenen Elementen – vollautomatisch die benötigten Flash-, ActionScript- und swf-Dateien in einer vorher vom Nutzer festzulegenden Ordnerstruktur anlegt.
Eine einfache XML-Datei dieser Art könnte ungefähr so aussehen:

<site title=”Gaia Framework Site: %PAGE%” indexFirst=”true” >
<page id=”index” title=”Index” src=”index.swf” >
<page id=”nav” src=”nav.swf” title=”Navigation” >
<page id=”home” title=”Home” src=”home.swf” menu=”true” />
<page id=”about” title=”About” src=”about.swf” menu=”true” />
<page id=”contact” title=”Contact” src=”contact.swf” menu=”true” />
<page id=”imprint” title=”Imprint” src=”imprint.swf” menu=”true” />
</page>
</page>
</site>

Der oberste Knoten <site> umschließt die gesamte Seitenstruktur, gefolgt von der <index>-Containerseite, die hier erstmal keine inhaltliche Relevanz hat.
<nav> ist ebenfalls eine Containerseite, welche nun sämtliche Inhaltsseiten, die vom Gaia Framework generiert werden sollen, enthält. Es sind auch weitere Verschachtelungen möglich; um bei komplexeren Seiten den Überblick zu behalten, gibt es den “Gaia Site Creator”, eine kleine AIR-Anwendung, mit deren Hilfe auch umfangreichere, gültige site.xml-Dateien auf visueller Basis erstellt werden können, die das Gaia Framework akzeptiert.

Wurde die site.xml erstellt, kann das Framework angewiesen werden, sie zu verarbeiten und das Gerüst – also die oben bereits erwähnten .fla, .as, …-Dateien – zu erstellen. Die Zeitersparnis ist, eine bereits erfolgte Einarbeitung natürlich vorausgesetzt, wirklich enorm! Die erzeugten Dateien können jetzt in Flash mit Inhalten und Code befüllt werden, wobei es sehr angenehm ist, dass das Framework dem Entwickler nicht in die Quere kommt, resp. ihm irgendwelche frameworkspezifischen Eigenheiten aufzwingt: innerhalb des erstellten Gerüsts kann der Entwickler so weiter arbeiten, wie er es bisher im Umgang mit Flash gewohnt ist.

Das Gaia Flash Framework bringt einige nette Features mit, die das Leben mit Flash ein wenig angenehmer machen:

1. Transitions: Der Seitenwechsel erfolgt standardmäßig über transitions, die das Framework mitbringt. Wird eine neue Seite innerhalb der Seitenstruktur aufgerufen, so blendet die alte Seite aus und die neue ein.
2. Preloader: Gaia bringt einen eigenen Preloader mit, der z.B. bytegenaues preloading mit kaum Entwicklungsarbeit möglich macht. Der Preloader berechnet die Größe sämtlicher Assets, die die Seite verwendet und bezieht die errechneten Werte in die benötigte Ladezeit mit ein.
3. Tweening: im Paket enthalten ist die bekannte Tweening-Enging “TweenLite” (http://www.greensock.com/). Sie bringt alle gängigen Tweeningmechanismen mit, die im Bereich Flash-Animation von Nutzen sind.
4. API: Das Framework bringt einige durchaus sinnvolle Funktionen mit; ganz vorn sollte die Methode “goto()” genannt werden. Damit kann zur Laufzeit die Seite gewechselt werden, wobei die Methode den Knoten aus der site.xml, zu dem gewechselt werden soll, übergeben bekommt. Wollten wir etwa die Seite “contact” öffnen, wäre der entsprechende Aufruf im AS-Code

Gaia.api.goto(‘index/nav/contact’);

5. SWFAddress: Mittels SWFAdress ist z.B. Deeplinking auf Flashseiten problemlos möglich. Mit SWFAdress werden beim Navigieren innerhalb einer Flashseite eindeutige URLs generiert, die es – im Gegensatz zu reinen Flashseiten ohne Verwendung von SWFAdress – ermöglichen, Links zu Inhalten innerhalb der Seite abzuspeichern und später wieder aufzurufen. Ein weiteres nettes Feature ist, dass somit auch die History des Browsers nutzbar ist: vorwärts- und zurücknavigieren ist damit kein Problem mehr (wer kennt es nicht: man befindet sich auf einer Flashseite, drückt irgendwann gewohnheitsmäßig den Back-Button und landet gleich nochmal ganz am Anfang beim Intro, das mit ganz viel “Glück” nichtmal einen Skip-Button hat…)!

Fazit:

Das Gaia Flash Framework erfordert, wie die meisten Dinge im Web, eine gewisse Einarbeitung. Die braucht einfach ihre Zeit. Hat man diese Zeit jedoch erst einmal investiert, so wird das Framework zu einem durchaus nützlichen Tool bei der (manchmal etwas ruckeligen) Arbeit mit Flash. Seiten sind schnell angelegt und Arbeitsschritte, die ansonsten eines größeren Aufwandes bedürfen – etwa der Wechsel zwischen einzelnen Unterseiten in der Navigation – werden durch Methoden, die die Gaia API mitbringt, erheblich erleichtert. Fazit: in Kombination mit der Tweening Platform von greensock absolut empfehlenswert!

Begleitend zum Veröffentlichung des “Cheers Magazine” wurde von werkraum die Flash-Website auf Basis der Gestaltung von know idea umgesetzt.

Viel Spaß damit & Cheers!

Auf der anderen Seite ist Magento in aller Munde und gehört sicherlich zu den führenden Produkten im Bereich Shopsoftware. Auch ich wurde kurz nach der Installation ein Fan dieses Shopsystems. Das durchdachte Attributesystem sorgt für gute Flexibilität. Durch den Bekanntheitsgrad von Magento ist die Anbindung an Payment-Provider gewährleistet. Alles Probleme, die uns bisher immer viel Arbeit bereitet haben.

Eine moderne Website mit Shopbereich wird aber erst richtig interessant, wenn diese beiden Systeme ineinander greifen und der Besucher gar nicht wahrnimmt, ob er nun im Shopbereich oder auf „normalen“ Inhaltsseiten surft. Als CMS kann Magento natürlich nicht annähernd soviel leisten wie TYOP3. Umgekehrt gibt es in TYPO3 derzeit kein vergleichbar mächtiges Shopsystem. Was bleibt uns nun?

• Wir nutzen TYPO3 und die dort vorhandene (weniger mächtige) Shopfunktionalität, können jedoch alles aus einem Guss darstellen.
• Wir nutzen ausschließlich Magento, haben eine mächtige Shopsoftware, jedoch machen wir Abstriche bei den Möglichkeiten, Inhalte zu präsentieren. Also auch keinen Blog, keine Bildergalerien, …
• Wir nutzen beide Systeme parallel und nehmen in Kauf die Inhalte nicht „mischen“ zu können.

Keine dieser Alternativen macht mich hierbei glücklich. Zum Glück hat die Firma flagbit aus Karlsruhe die Extension „typogento“ entwickelt, die neue Möglichkeiten eröffnet.

Nun ist es möglich, gezielt Magento-Inhalte (genannt Blöcke) als Inhaltselemente (FrontEnd-Plugins) auf TYPO3-Seiten zu platzieren. Die Idee dahinter ist, dass die Shop-Inhalte von der Magento-Engine gerendert werden und dann fertiger HTML-Code an TYPO3 geliefert wird. Jedoch voll integriert, ohne Frames oder dergleichen.

Die Idee ist super. Wenn man die ersten Installationshürden überwunden hat, kommt man auch zum versprochenen Ergebnis: Shopinhalte und TYPO3-Inhaltselemente können zu einer Hybrid-Seite gemischt werden. Wunderbar.

Aber ganz zufrieden bin ich damit noch nicht. Derzeit arbeitet werkraum an einem Shop, der ein ausgefeiltes Navigationskonzept vorsieht, welches mit den Standard-Magento-Mitteln nicht abbildbar ist. Darüber hinaus wird es einen Produktkonfigurator geben und die Produkt-Attribute sollen teilweise nicht mehr aus einfachen Werten wie „Länge = 15cm“, „Hersteller = abc“, … bestehen, sondern selbst weitere Daten enthalten. Produkt-Attribute brauchen weitere Felder. Beispielsweise soll es ein Attribut „Region“ geben, die Auskunft über die Herkunft des Produktes gibt. Dabei sollen Bilder der Region, Texte, Links, … dargestellt werden. Der Einsatz von typogento liefert hierfür nicht die Lösung. Sicherlich kann man Magento selbst diesbezüglich erweitern, diesen Ansatz verfolgen wir jedoch nicht. Aus meiner Sicht ist es erstrebenswert, Shop-Objekte (Produkte, Attribute, Warenkorb) von Magento zu erhalten und dann diese in TYPO3-Extension weiterzuverabeiten und auszugeben. Damit hätte ein TYPO3-Entwickler seine gewohnte Freiheit und Flexibilität, müsste die Shopfunktionalität jedoch nicht neu implementieren.

typogento lieferte mir den Ansatz dazu. Durch erzeugen einer Instanz des „Mage“-Objektes durch inkludieren der notwendigen PHP-Files aus der Magento-Installation hat man genau dieses Ziel erreicht. Nun können auf TYPO3-Seite im TCA neue Tabellentypen angelegt werden, deren Datensätze Bezug auf Magento-Attribute nehmen und somit ist es ein leichtes Attribute von reinen Primitiven zur Objekten zu „befördern“. Erste Ergebnisse werden demnächst sichtbar werden. Ich werde berichten….

Die Verwaltungssoftware besteht zum Einen aus einem lokalen AIR-Client, welcher auf dem Verwaltungsrechner installiert wird. Dieser Client beherbergt das User Interface und die Funktionen, die zur Darstellung und Verwaltung der Daten notwendig sind.
Auf der anderen Seite befindet sich ein PHP-Server mit installiertem Zend-Framework. Über das AMF-Protokoll verbindet sich der Client zum Server und behandelt Datenabfragen wie z.B. das Lesen aus bzw. Schreiben in die dort installierte MySQL-Datenbank.

Kernfeatures der im Flash Builder 4 umgesetzten Software sind:

• die effiziente Verwaltung von Personen, die im Kontakt zur Schule stehen (hauptsächlich Studenten)
• Kategorisierung von Personen in die diversen Studiengänge, Kurse usw.
• den Kontakt via E-Mail an einzelne Personen, Personengruppen, ganze Semester oder Fachbereiche
• das Verwalten und Ausdrucken von Studienbescheinigungen für die Semester, die ein Student absolviert hat

Eine besondere Anforderung an die Anwendung war die Unterstützung von Office-Dokumenten (z.B. OpenOffice) für den Druck von Studienbescheinigungen, da das bisher dafür genutzte Serienbrief-System beibehalten werden sollte.
Um aus der AIR-Anwendung heraus Serienbriefdokumente drucken zu können, liefert der Client bei der Installation ein Dummy-Exemplar eines Office-Dokuments mit, welches die statischen Inhalte und die dynamisch befüllbaren Felder enthält. Im Client wird bei Bedarf dynamisch eine dem Office-Dokument als Datenquelle zugewiesene CSV-Datei mit den im Client ausgewählten Inhalten erzeugt und mit den ab AIR 2 vorhandenen neuen File-Funktionen – hier: openWithDefaultApplication() – wird das Serienbriefdokument mit der Standardanwendung des jeweiligen Benutzers/Betriebssystems geöffnet.

Diese Funktion ist besonders praktisch, weil sie den Nutzer in keine Softwareabhängigkeiten drängt: der Druck der Dokumente funktionierte im Test sowohl mit Microsoft Word als auch mit OpenOffice Writer.

Weitere Features, wie z.B. die Verwaltung der schulinternen Bibliothek und die Integration eines automatischen Updatemechanismus, sind geplant.

Für das in Wolfurt ansässigen LTW Intralogistics GmbH wurde eine weitere 3D-Visualisierung einer bereits im Bau befindlichen Anlage der ZIZALA Lichtsysteme GmbH durchgeführt. Die Herausforderung besteht bei LTW-Projekten immer in der enorm hohen Komplexität und Menge der CAD-Daten. Wiedereinmal hat sich die jahrelange Erfahrung von werkraum im Bereich der 3D-Visualisierung ausgezeichnet, da das Projekt schnell und in der von werkraum bekannten hohen Qualität umgesetzt werden konnte.

Die Webseite wird mit folgenden Features ausgestattet:

• Eigenentwickelte Extension BauträgerScout24
• News-Extension
• Newsletter Integration
• Suchmaschinen Optimierung
• Web2.0 Features mit Lightbox2
• Einsatz von RealURL

Kostenkontrolle und Officesoftware für den Wohnbau

Wir stellen bekanntes in Frage und entwickeln neue Lösungen im Einklang mit den Anforderungen an eine menschenfreundliche Arbeitsumgebung.

So entstand die Bauträgersoftware ” LEONARDO” , die das Zusammenarbeiten und die Kommunikation aller an einer Aufgabe beteiligten erleichtert und das gemeinsame Ziel transparent macht.

http://www.bautraegerscout24.de

Neue Features des Raumplaners

• Neue Kompressoren
• Undo für den Rohrleitungsplaner
• Weitere Sprachen, der Raumplaner ist nun in 12 Sprachen verfügbar
• Service Mann als 3D-Objekt
• Aktualisierte Softwareaktivierung

Mehr Druck für bessere Leistung!

Mit dem richtigen Druck laufen Produktion und Technik zur Höchstform auf. Ob Krankenhäuser oder Handwerk, Industrie, Luftfahrt und unzählige Branchen mehr – Druckluft ist ein unverzichtbarer Prozessbestandteil in allen Wirtschaftsbereichen.

Der Name ALMIG steht dabei für Produkte der Spitzenklasse, innovative Technologie- und Servicekonzepte sowie Kundennähe.

http://www.almig.de/