Website der Psychologischen Beraterin Renate Tiemann aus Pfalzgrafenweiler. Ihr Tätigkeitsschwerpunkt liegt in der Hypnose, Rückführung, Clearing, Kinesiologie und Gesprächspsychotherapie nach Carl Rogers.
Das Design wurde an eine bereits bestehende Broschüre angelehnt. Auf Grund des begrenzten Budgets und unregelmäßiger Aktualisierungen war eine statische Website für die Kundin ausreichend. Das Kontaktformular ist mit jQuery/JavaScript realisiert.
Praxis Lichtpunkt
Dig Dis! mediaplayer
Für den digitalen Musikvertrieb Dig Dis!, der sich auf elektronische Musik jeglicher Couleur eingeschworen hat, wurde ein Mediaplayer auf Basis des Freeware-Produkts jPlayer entwickelt. jPlayer bietet HTML5 Audio & Video aus Basis des JavaScript-Frameworks jQuery und ist somit auch auf Apple-Produkten einsetzbar. Ein Fallback für alte Browser steht über Flash bereit.
Der Player lässt sich über eine Administrationsoberfläche einfach konfigurieren, indem entweder direkt über den Artist oder das Label ein Release ausgewählt wird. Desweiteren besteht die Möglichkeit zwischen drei verschiedenen Designs – “Standard” (Dig Dis! blau), “Light Air” und “Mono Dark” – und vier Größen – Mini (Myspace-Seitenleiste), Myspace, Mobile und Standard (Facebook-Canvas) – zu wählen. Der Player lässt sich mit Hilfe eines iFrames (so auch im nebenstehenden Beispiel) in jede Website oder Newsletter einbinden. Für eine stärkere Verzahnung mit Facebook kann ein Highlight-Track ausgewählt werden, der als Statusmittleilung auf Facebook gepusht wird. Der Highlight-Track-Player für Facebook basiert auf Flash und ist auf die wesentlichen Bedienelemente reduziert. Als vollwertige Facebook-App ist es zudem möglich den Player als zusätzlichen Tab auf einer beliebigen Facebook-Page einzubinden.
Dig Dis! player – Eigenen Player konfigurieren
Dig Dis! player – Facebook-Infoseite der App
Kern Weine
Die redesignte Website der Familienkellerei Wilhelm Kern GmbH ging bereits 2008 online. Damals wurde durch eine selbstentwickelte PHP-Lösung die Navigationleiste auf der linken Seite aus einer CSV-Datei generiert. Nicht selten kam es zu Problemen durch Leerzeichen oder Zeilenumbrüchen in der CSV-Datei, die zu einer fehlerhaften Darstellung der Navigation führten. Durch die Portiertung der Website auf das CMS Contao erhält der Kunde ein leicht verständliches Content-Management-System, mit dessen Hilfe inhaltliche Änderung selbst ohne Probleme durchgeführt werden können. Das leidige Thema der Navigation entfällt nun komplett. Die Seitenstruktur und damit auch die Navigationsleiste kann innerhalb von Contao über den gleichnamigen Menüpunkt im Administrationsbereich gepflegt werden und wird automatisch generiert ohne, dass irgendwelche Dateien direkt editiert werden müssen.
Der Newsbereich auf der rechten Seite zeigt die letzten fünf Mitteilungen an und über einen weiteren Link gelangt man auf eine Übersichtsseite, die zehn Mitteilungen auf einen Blick anzeigt und weitere Mitteilungen über verschiedene Seiten hinweg verteilt (Stichwort “Pagination”, vgl. Googles Suchergebnisse).
Das Projekt wurde in Zusammenarbeit mit Hacker Media durchgeführt.
KommunikationsZeit – Marcel Baars
Als mein zweites Projekt mit Contao darf ich die Website von KommunikationsZeit vorstellen. Hinter KommunikationsZeit steht der Stuttgarter Marcel Baars, dessen Dienstleistung es ist, als Kommunikator, Rezipient und Zeitgeist für ein persönliches Gespräch zur Verfügung zu stehen.
Die Website für KommunikationsZeit ist in Erdtönen und hellem Grau gehalten und entspricht der Gestaltung der bereits bestehenden Geschäftsausstattung. Auf der Home-Seite können Unterkategorien dank Contao und der Erweiterung zArticleImage mit einem Bild und einem kurzen Beschreibungstext angeteasert werden.
Das Projekt wurde in Zusammenarbeit mit Hacker Media durchgeführt.
Rehm Arbeitsbühnen Munderkingen
Im Zuge dieses Projekts habe ich neben dem Design der Seite von Rehm Arbeitsbühnen Munderkingen auch die Technik dahinter auf einen zeitgemäßen Stand gebracht. Die Wahl fiel hierbei auf das Content-Management-System Contao. Im Gegensatz zu WordPress beispielsweise ist die Verwaltung vieler Dateien bedeutend komfortabler und zum lassen sich Inhalte für Tabellen, welche ein essentieller Bestandteil der Seite sind, leicht via CSV-Dateien importieren. Durch eine kleine Modifikation der Importfunktion können auch Textlinks, Verlinkungen zu PDF-Dateien und Thumbnails von Bildern und deren Großansicht (MooTools / Lightbox) für den Kunden leicht in die zu importierende CSV-Datei eingegeben und für die Ausgabe automatisch generiert werden. Die Tabellen lassen sich via JavaScript nach beliebigen Spalten sortieren.
Das Projekt wurde in Zusammenarbeit mit Hacker Media durchgeführt.
WALLENWEIN Facility Management GmbH
WALLENWEIN Facility Management GmbH ist ein in Stuttgart ansässiges, mittelständisches Unternehmen, das sich auf Gebäudemanagement spezialisiert hat und unter anderem 2009 mit dem Sicherheitspreis des Landes Baden-Württemberg für sein intelligentes internetbasiertes Wächterkontrollsystem (I-Safety) prämiert wurde. Der Kontakt kam zustande, nachdem der Geschäftsinhaber Herr Wallenwein meinen Artikel über NFC und mobile Zahlungssysteme gelesen und mich daraufhin angeschrieben hatte.
Für die Wallenwein Facility Management GmbH aus Stuttgart habe ich ein Rund-Um-Redesign vorgenommen, das hauptsächlich eine attraktivere Startseite vorsah, aber auch für die unzähligen Unterseiten eine Layoutvorlage umfasste. Eine Tabnavigation bringt die nötige Struktur und kommt dank Hilfe von JQuery (JavaScript) beim Auswählen von Subkategorien ohne Klicks aus. Um die Startseite grafischer und für den Benutzer ansprechender zu gestalten, wurde neben diversen Bildelementen auch Verwendung einer selbstprogrammierten “Coverflow”-Flash-App (bekannte durch Apples iTunes) gemacht, um die Hauptthemen der Website anzuteasern. Der Systemadminstrator kann die Inhalte des Coverflows bequem über eine XML-Datei bearbeiten. Auch das Logo erfuhr während des Redesigns eine Frischzellenkur. Die Layoutvorlage für die Inhaltsseiten umfasst diverse zwei- und dreispalten Layouts, Bilder mit umfließendem Text, Bildergalerien und Listen. Die Technik hinter der redesignten Fassade stammt vom IT-Dienstleister Multispektral aus Auetal.
Mathieu Hauck Redesign 2010
Schon seit einiger Zeit habe ich ein paar Änderungen an meiner Gewerbewebsite durchgeführt. Dieses Thema konnte ich perfekt mit der Vorlesung “Internetstrategien und -konzepte” verbinden, die ich im Sommersemester 2010 belegt. Die Motivation dahinter war die schwache Auftragslage in diesem Jahr im Allgemeinen und die Frage, wie man Kunden als Kleingewerbebetreibender im Bereich Online- und Printmedien evtl. auch über eine Website akquirieren kann (was in der Vergangenheit nie der Fall funktionierte). Im Zuge dessen entstanden neben der Website zum einen eine 22-seitige Ausarbeitung und eine fünfminütige Präsentation, in denen ich auf die Ausgangslage (Besucherstatistiken, Kundenfeedbacks etc.) und die daraus abgeleiteten Maßnahmen (Operation “Ansprechendere Referenzenseite”, Social Media Anbindung etc.) kurz eingehe. Viel Spaß beim Lesen!
» Internetstrategie Mathieu Hauck 2010
» Präsentation der Internetstrategie Mathieu Hauck 2010
pm33.de – Innovatives Projektmanagement
Die Website “pm33.de – Innovatives Projektmanagement” entstand in einer knapp dreimonatigen Zusammenarbeit mit dem Betriebswirt und Projektmanager Werner Ehmann aus Stuttgart. Das minimalistische Design (drei Spalten, Logo, Text) wird perfekt durch die edel wirkenden, sich langsam einblendenden Subkategorien in der Navigationsleiste ergänzt (zum Stand 01.10.2010 leider noch nicht sichtbar, da keine Untermenüpunkte vorhanden). Diese Effekt wurde mit dem JavaScript-Framework MooTools erzielt, das fester Bestandteil des verwendeten Content-Management-System Contao ist. Mit Hilfe von Contao erhält der Kunde die Möglichkeit seinen Content in Zukunft selbständig zu pflegen. Contao ist dabei leichtgewichtiger und benutzerfreundlicher als beispielsweise TYPO3, jedoch deutlich mächtiger als WordPress. Insbesondere der “Interne Bereiche”, der sich unter dem Menüpunkt “Informationen” befindet, ließ sich dadurch recht einfach realisieren und kann durch den Kunden in Zukunft um weitere Nutzer und zusätzliches Schulungsmaterial erweitern werden.
ECHT Massivhäuser
Die Website “ECHT Massivhäuser” wurde durch den Stuttgarter Architekten Alexander Echtler in Auftrag gegeben. Es wurde ein gefälliges, jedoch schlichtes Design in den Hauptfarben Weiß, Grau und Grün mit einer plastisch wirkenden Navigationsleiste gewünscht. Der Kunde hatte bereits eine klare Vorstellung vom Aussehen der Website, sodass diese Idee im Zuge der Umsetzung verfeinert wurde. Die Basis bilden statische HTML-Seiten, die an einigen Stellen noch mit etwas JavaScript angereichert wurden (VVS-Widget, Google Map). Um textlastige Seiten möglichst übersichtlich darzustellen, wurde von Accordion-Menüs Gebrauch gemacht, sodass man bei Interesse relevante Inhalte nachträglich einblenden kann (“detail on demand”).
ECOntrol: Mobile Home Automation
ECOntrol ist eine Home Automation Anwendung für Android-Devices mit Fokus auf dem Thema Energieverwaltung und -management. Sie soll den Benutzer beim effizienten Stromsparen unterstützen und dabei die Umwelt schonen sowie einen Mehrwert durch Einsparung von Strom‐ und Heizkosten bieten. Diese Grundidee wird durch komfortable Möglichkeiten der Steuer-ung von im Haus verfügbaren elektronischen Komponenten ergänzt. ECOntrol nutzt openAMI: open source home automation framework als technische Infrastruktur.
Bei diesem Projekt zeigte ich mich hauptsächlich für das Projektmanagement (im Rahmen einer Veranstaltung) zuständig. Anstatt mich ausschließlich den dabei anfallenden Dokumenten zu widmen, versüßte ich mir die Pausen mit dem Gestalten eines Logos. Ebenso gestaltete ich zwei Plakate (DIN A1 und DIN A3) für die Präsentation auf der Media Night an der Hochschule der Medien Stuttgart am 01.07.2010.