Blogthemen filtern:

Unsere Blogthemen

Es geht voran!

Nachdem Severin die letzten Mockups unserer neuen Webseite finalisiert hatte, konnte ich endlich mit dem Design beginnen. Doch wie sollte die neue Webseite aussehen? Wir waren uns einig, dass wir ein reduziertes, klares Design brauchen, das modern wirkt und den Content unterstützt, anstatt ihn durch Effekte in den Hintergrund zu drängen. Schnell fiel der Begriff "Flat Design", doch was zeichnet Flat Design eigentlich aus?

Flat Design bedeutet die Reduktion auf das Wesentliche, d.h. keine Farbverläufe, keine Schlagschatten, keine Texturen, keine 3D-Effekte. Im Gegenzug jedoch klare Konturen, vollflächige Farben und verstärkter Einsatz von Typografie als Gestaltungsmittel.

Microsoft hat es vorgemacht und mit der Modern UI (Metro-Design) ein neues Designkonzept entwickelt, dass sich deutlich vom "Skeuomorphism Design" von Apple unterscheidet und einfach den visuellen Nerv der Zeit getroffen hat. 

Aber auch aus technischer Sicht hat das Flat Design Vorteile. Dadurch, dass auf Effekte nahezu vollständig verzichtet wird, können zahlreiche Grafiken mittels CSS3 realisiert werden, wodurch es schlichtweg ressourcenschonender ist. Hinsichtlich leistungsschwächerer Prozessoren in Smartphones und schlechten Datenverbindungen ein Punkt, der nicht außer Acht zu lassen ist.

Aber wieder zurück zum Design. Nach einigen Diskussionen sind wir zu dem Ergebnis gekommen, dass wir das Design nicht gänzlich Flat gestalten, sondern es mit dezenten Kanten versehen, um dem Design somit das gewisse Etwas zu verleihen. 

Eine Herausforderung sind unsere vier Firmenfarben, da diese durch vollflächigen Einsatz in verschiedenen Browsergrößen stets anders wirken, sie aber dennoch mit dem Rest der Webseite harmonieren sollen.

Da wir in der Konzeption mit der mobilen Ansicht begonnen hatten ("Mobile-First"), habe ich auch beim Design zuerst die Mobilvariante gestaltet, bevor ich mich schrittweise der Desktopvariante näherte. Für mich war es spannend zu sehen, welche Möglichkeiten einem offen stehen, wenn man in der nächst größeren Version plötzlich mehr Raum zur Verfügung hat. Auf einmal ist es möglich zusätzliche Elemente wie z.B. Bilder und längere Texte zu verwenden oder das Design einfach luftiger zu gestalten.

Eine weitere Herausforderung war der "One-Page"-Charakter der einzelnen Seiten. Um viel Content auf einer einzigen Seite sinnvoll darzustellen, haben wir diesen in einzelne Sektionen eingeteilt, welche auch visuell voneinander getrennt sein sollten, was mit einer einzigen Farbe und nur einem Grauton nicht immer einfach war.

Doch jetzt ist es geschafft und ich bin mit dem Design soweit fertig, dass es mit Umsetzung losgehen kann.

Es geht voran!

Startseite in 320 Pixel Breite

Startseite in 480 Pixel Breite

Startseite in 768 Pixel Breite

Startseite in 1024 Pixel Breite

7. August 2013

Gridelements auf www.enkey.de

Individuelle Inhaltselemente in TYPO3 sind ein wichtiges Feature zur vereinfachten Pflege und eine einheitliche Eingabe von projektspezifischen Inhalten (z.B. Teaser-Boxen, mehrspaltige Elemente oder Slider) im CMS.

Neben TemplaVoilà bietet auch die Extension Gridelements die Möglichkeit zur Implementierung individueller Inhaltselemente mit Verschachtelung. Die Konfiguration der verfügbaren Elemente mit Angaben zur Aufteilung wird dabei meistens in der Datenbank vorgenommen. Häufig gibt es allerdings die Anforderung, dass jegliche Konfigurations- und Template-Informationen versionierbar abgelegt werden sollen. Dies hat den Vorteil, dass Änderungen an der Konfiguration kontrolliert werden können und eine Übernahme in verschiedene Installationen reibungslos vorgenommen werden können.

Neben dem Datensatz zur Konfiguration eines Gridelements kommt die passende TypoScript-Konfiguration hinzu, welche aber direkt in versionierbare Dateien ausgelagert werden kann (statische TypoScript-Einbindung). Über diesen Weg arbeitet man allerdings immer noch mit Datensätzen, die in der Datenbank abgelegt werden. Dies bedeutet insbesondere bei komplexeren Deployment-Strukturen zeitaufwändige Anpassungen, die bei jeder Installation (z.B. Testing, Staging, Production und bei allen Entwicklungssystemen) durchgeführt werden müssen. Außerdem sind die Datensätze nicht versionierbar und unbeabsichtigte Änderungen können nur schwer nachvollzogen werden.

24. Juli 2013

Die "TYPO3 Developer Days" sind neben der TYPO3 Konferenz (T3CON) ein weiteres offizielles Event der TYPO3 Association. Während es sich bei der T3CON um eine klassische Konferenz handelt, entwickeln sich die DevDays Jahr für Jahr immer mehr in Richtung "Entwickler und Contributor Treffen", bei dem insbesondere die Weiterentwicklung von TYPO3, Flow und Neos im Vordergrund steht.

In diesem Jahr wurde ein weiterer Schritt in diese Richtung gegangen, sodass sich dieses Event mittlerweile sehr deutlich von der T3CON abgrenzen kann.

networkteam hat in diesem Jahr die so genannte Codingnight gesponsert und war gleich mit 5 Personen anwesend. 5 Personen, 5 verschiedene Erfahrungen, Interessen und Eindrücke und daraus resultierend 5 Erfahrungsberichte:

17. Juli 2013

Ob Smartphone, Tablet, oder irgendwo dazwischen: Beinahe wöchentlich erscheinen neue Geräte. Egal wie verschieden sie jedoch sind, alle diese Geräte können Webseiten darstellen. Auf diese Weise entstehen ständig neue Situationen und Kontexte, in denen eine Webseite genutzt wird. Ob in der U-Bahn, am Flughafen, im Café oder zu Hause auf der Couch - Ziel des Nutzers ist es immer, die Informationen einer Webseite so einfach und effizient wie möglich zu erhalten.

11. Juli 2013

Diese Woche starten in Hamburg die 8. TYPO3 Developer Days unter dem Motto „Getting together to make it happen!“.

Ab Donnerstag treffen sich Entwickler des TYPO3 Universums zu der jährlichen Entwickler-Veranstaltung. Das Ziel der Developer Days besteht darin die verschiedenen Systeme und Extensions weiter zu entwickeln und auch Neulingen einen Einstieg in die verschiedenen Teams zu geben. Bereits in den letzten Jahren haben sich die Developer-Days von einem vortragsbasierten Ansatz zu Workshops unter dem Motto „Getting things done“ entwickelt. In diesem Jahr wird es vorerst nur ein Tutorial geben, alle weiteren Time-Slots werden mit Workshops gefüllt.

2. Juli 2013

Mobile Endgeräte werden immer wichtiger in unserem Alltag. Große Monitore sind auf unseren Schreibtischen auch bereits die Norm. Dieser technologische Fortschritt hinterlässt seine Spuren bei der Entwicklung von Webseiten. Daher werden Webseiten nun immer häufiger "responsive" aufgebaut.

Responsive Webdesign stellt eine aktuelle Technik dar, wobei mit Hilfe von HTML5 und CSS3 Media-Queries eine Optimierung des Layouts und der Inhalte auf Desktop PC, Tablet und Smartphone vorgenommen werden kann.

24. Juni 2013

Um beispielsweise Überschriften etwas mehr Individualität zu geben, ist man immer auf der Suche nach neuen CSS-Styles, mit deren Hilfe man diese noch ansprechender gestalten kann. Über Schriftfarben mit Verläufen, Rahmen und Schatten kann man mit einem schönen Schriftschnitt schon Einiges anstellen. Was ist aber, wenn man diese gerne mit einer fotorealistischen Textur oder den Effekt einer ausgestanzten Schrift darstellen möchte?

19. Juni 2013

Vor zwei Wochen fand in Karlsruhe ein TYPO3 Neos Code Sprint statt, bei welchem nicht nur an den offenen Features gearbeitet wurde, sondern auch zu verschiedenen Themen Diskussionen stattfanden.

Eines dieser Diskussions-Themen beschäftigte sich mit der Team-Struktur, denn auch das TYPO3 CMS Team hat erst kürzlich eine Überarbeitung seiner Team-Struktur bekannt gegeben. Dies war im Falle des CMS dringend nötig, denn seit den Anfängen des CMS gab es keine Anpassungen an neue Bedingungen wie eine gewachsene Team-Größe oder verstärkte Unterteilung in Unterprojekte für spezifische Teile des TYPO3 Kerns.

Für TYPO3 Neos ist es vor allem wichtig, dass das Team einfacher wachsen kann. Für Interessenten sollte es möglichst einfach sein an Neos oder Flow mitarbeiten zu können und gleichermaßen sollte jeder Beitrag auch als solcher anerkannt werden. Die gesamte Team-Struktur baut hierbei auf gegenseitiges Vertrauen auf, denn jeder aktiv Mitwirkende erhält einige Privilegien (z.B. Merge-Rechte im Git-Repostitory und Zugriff auf die Projekt-Webseite). Weiterhin wird es keine technischen Hürden geben, die sich beispielsweise nach einem gewissen Aktivitäts-Level oder der Art der Beiträge richten. Dadurch kann das Team auf diverse kleinere Unterrollen verzichten und sich auf zwei verschiedene Hauptrollen Contributor und Active Contributor beschränken.

Neben der Mitarbeit an Neos selbst und dem Framework gibt es in einem solchen Team allerdings auch Aufgaben, die in jedem Fall erledigt werden müssen und für die es klare Zuständigkeiten geben sollte. Aus diesem Grund hat das Team beschlossen neben den folgenden Haupt-Rollen auch ein paar weitere Gruppen und Rollen zu definieren.

31. Mai 2013

Vor zwei Wochen fand in Kolbermoor (bei Rosenheim, München) die Inspiring Flow Konferenz (2012 noch F3X) statt und hat zum zweiten Mal Interessierte rund um das PHP Framework TYPO3 Flow in den Süden Deutschlands gelockt.

Die größten Änderungen der Konferenz vom letzten Jahr zu 2013 bestanden in der Internationalisierung der Konferenz und der Verlängerung auf zwei Tage. Aufgrund der großen Nachfrage wurden die Talks dieses Jahr nicht mehr auf Deutsch sondern auf Englisch gehalten und konnten so ein internationales Publikum ansprechen. Dass das Interesse an Flow groß ist und das Know-How von 2012 zu 2013 einen großen Sprung gemacht hat, konnte man vor allem daran merken, dass trotz der doppelten Anzahl an Talks alle Slots mit unterschiedlichen Themen rund um das Framework gefüllt werden konnten.

Als TYPO3 Flow Agentur waren natürlich auch wir wieder mit von der Partie und Christopher hat nicht nur selber einen Talk zu dem Thema Single Sign-On gehalten sondern damit auch den zweiten Platz beim Voting belegt. Platz eins ging an den Gast und Keynote-Speaker des zweiten Tages: Stefan Priebsch. Durchaus provokant hat er sich mit dem Thema MVC im Web beschäftigt und die Zuhörer nicht nur durch eine spontane Schauspiel-Einlage einiger Teilnehmer gefesselt.

Neben Talks über ergänzende Techniken zu dem Framework (NoSQL mit CouchDB, Ember.js oder TypoScript und EEL) gab es in diesem Jahr auch einige Praxis-bezogene Talks in welchen Flow im Live-Einsatz gezeigt wurde. Dazu zählten zum Beispiel das beeindruckende Projekt medialib.tv bei dem Dominique Feyer ein Video on Demand Portal basierend auf Flow und TYPO3 Neos entwickelt hat, Talks zum Thema Deployment (z.B. mit TYPO3 Surf, Git und Jenkins) oder die Integration von Solr. Christophers Talk lief unter dem Titel „A fully integrated single sign-on solution with TYPO3 Flow“ und gab einen Einblick in die Single Sign-On Lösung die wir in Zusammenarbeit mit Robert Lemke für einen Kunden entwickelt haben.

Auch das Rahmenprogramm der Konferenz konnte, wie bereits im letzten Jahr, überzeugen. Das hervorragende Catering während der Konferenz und das Flying Buffet des Social Events machten das Event zusammen mit der „traditionellen“ Flow-Torte zu einer rundum gelungenen Veranstaltung.

Wir werden im nächsten Jahr auf jeden Fall wieder dabei sein und freuen uns auf noch mehr neue Erfahrungen und Erfahrungsaustausch nach einem weiteren Jahr Flow Entwicklung.

Alle Talks wurden übrigens aufgezeichnet und werden nach dem finalen Schnitt zusammen mit Bildern und Slides der Konferenz auf der Inspiring Flow Webseiteveröffentlicht.

Quelle: Flickr: Pankaj Lele

Die Inspiring Flow Torte

6. Mai 2013

Zweimal im Jahr findet an der Fachhochschule Kiel die sogenannte "Interdisziplinäre Woche" statt. Mit diesem zusätzlichen Angebot der Hochschule wird den Studenten ermöglicht, über die Grenzen des eigenen Studienfaches hinaus, Wissen zu erwerben. Studierende der Fachhochschule Kiel erhalten auf diese Weise die Möglichkeit, neben fundiertem Fachwissen auch andere Kompetenzen zu entwickeln.

Bei der kommenden "Interdisziplinären Woche" bietet networkteam in Kooperation mit dem Fachbereich Medien einen Workshop mit dem Titel "Modernes Webdesign im Zeitalter von Tablets und Smartphones" an.

26. April 2013