Timo Clasen 5 min 06.02.2015

Die neue Codeatelier Website

Wie ihr sicherlich bemerkt habt, haben wir eine neue Website. Nicht weil wir zu wenig zu tun haben, sondern weil uns die Alte nicht mehr richtig repräsentiert hat.

Genau wie wir, hat sich auch das Web weiterentwickelt. Immer mehr Geräte, auf denen wir richtig und vor allem auch schnell dargestellt werden wollen. In diesen Bereichen war die alte Seite einfach nicht mehr zeitgemäß.
Die originelle Idee mit dem 2 MB großen Fullscreen-Hero-Bild wurde also gleich wieder verworfen. ;)

Wie wir herangegangen sind?

Zuerst haben wir uns überlegt, für was unsere eigene Website eigentlich da ist. Und nein wir wollen nicht nur unsere tollen Mitarbeiter-Fotos zeigen. :)
Wir haben für uns zwei Zielgruppen ausgemacht:

  1. Potentielle Kunden für Auftragsarbeiten
  2. homee-Nutzer, die mehr über uns erfahren wollen

Als nächstes mussten wir beantworten, was wir den definierten Zielgruppen kommunizieren wollen.

Potentielle Kunden sollen uns als Agentur im Bereich des Internets der Dinge wahrnehmen. Als Dienstleister und Partner bieten wir alles, von der Konzeption bis zur Umsetzung.
homee-Nutzer sollen sehen, wer hinter ihrem digitalen Mitbewohner steckt – und was wir sonst noch so machen.

Konzept

Wir hatten von vornherein das Ziel, eine schlanke, übersichtliche Seite zu entwickeln. Die wichtigsten Infos gibt’s auf der Startseite – direkt mit Kontaktformular falls Interesse geweckt wurde. Für das Team war eine Seite wichtig, auf der jeder kurz vorgestellt wird. Man möchte ja auch mal zeigen können, wo und an was man arbeitet. Das Ganze zu pflegen sollte jedoch kein zu großer Aufwand sein, Ziel ist es ja weiter zu wachsen und neue Mitarbeiter einfach hinzufügen zu können (Dazu aber gleich mehr). Bewerbungen übrigens hier her ;)
Der zweite und letzte Menüpunkt ist der Blog. Bloggen sehen wir als optimales Mittel um die eigene Arbeit zu reflektieren, homee Begeisterte auf dem Laufenden zu halten und unsere Expertise in allen Bereichen zeigen zu können. Wir nehmen uns also vor, regelmäßig Artikel über Details aus Konzept, Design und Programmierung zu schreiben.

Um das Lese-Erlebnis möglichst positiv zu gestalten, werden die wichtigsten Fragen des Lesers sofort beantwortet:

  • Wie heißt der Artikel? (= um was geht es?)
  • Von wann ist der Artikel? (= ich brauche keinen Webdesign Artikel von 1999)
  • Wer hat den Artikel geschrieben? (= Fragen? Feedback?)
  • Wie lange brauche ich ca. zum Lesen? (= lese ich ihn jetzt oder später?)
  • Wem gehört denn der Blog (= was machen die eigentlich?)

Nach dem Artikel kann der Autor (im Moment manuell) andere interessante Artikel für den Leser vorschlagen. Dies soll später durch ein automatisches System ersetzt werden. Wir taggen die Artikel, damit wir dem Leser thematisch passende Posts vorschlagen können.

Umsetzung

Bei zwei Bereichen der Seite war es uns wichtig, einfach Seiten hinzufügen und bereits existierende editieren zu können:

  • Team
  • Blog

Wir mussten unsere Seite also mit einem CMS umsetzten. Aufgrund der schlanken Seite wollten wir aber kein zu großes und für unsere Zwecke übertriebenes CMS einsetzten. Die Wahl fiel auf Kirby. Kirby ist Datei-basiert und arbeitet ohne Datenbank. Es bietet jedoch ein ausreichend zu konfigurierendes Web-Editier-Panel. Mehr als genug findet man darüber in der überaus tollen Kirby-Dokumentation.

Der Blog besteht in Kirby aus einem Ordner „Blog“, mit Unterordnern für jeden Beitrag. In diesen Ordnern befinden sich Textdateien mit Artikelinhalt und Metadaten. Bilder die in den Artikel eingebunden werden sollen, befinden sich ebenfalls im selben Ordner.
Die Logik passiert in zwei Templates – einmal in der Blog-Übersicht und einmal im Blog-Artikel. Das Übersichts-Template schaut nach, wie viele Unterordner (also Artikel) es gibt, stellt jeweils Titel, Metadaten und Vorschau (die ersten 300 Zeichen) dar und verlinkt auf den Artikel. Im Artikel greift das Artikel-Template und holt sich alle Daten aus der Textdatei des Artikels. Hier wird der Textinhalt von Markdown in HTML umgewandelt.
Einen neuen Blog Eintrag hinzuzufügen ist also denkbar einfach. Man erstellt einen neuen Ordner/ eine neue Seite (je nachdem ob man es im Dateisystem oder im Web macht), füllt Felder wie „Titel“, „Autor“, „Datum“ und „Text“ aus und schon hat unser Blog einen neuen Eintrag.

Die Team-Seite funktioniert gleich wie der Blog, nur, dass es keine Detailseiten zu den Mitarbeitern gibt. Das Template holt sich somit einfach alle Informationen aus den Unterordnern der Mitarbeiter. So ist das Hinzufügen, Löschen und Neu-Anordnen ein Kinderspiel.

Die komplette Seite wurde zuerst nur mit HTML und CSS statisch gebaut und anschließend durch Kirby und PHP nach und nach dynamisch gemacht. Teile der Seite, wie der Blog und die Team-Seite sind nun komplett editier- und erweiterbar. Bei anderen Teilen, wie der Startseite sind im Webpanel nur die Texte editierbar.

Ich persönlich habe als Informationsdesigner mit wenig Programmiererfahrung schon lange ein CMS gesucht, mit dem ich extrem einfach, komplett individuelle Designs in CMS Templates umwandeln kann. In Kirby habe ich genau das gefunden <3

Euch Lesern wünschen wir viel Spaß auf unserer neuen Seite und wir freuen uns natürlich riesig, wenn ihr wiederkommt.

Tanja Brodbeck 8 min 14.12.2020

Fragen an das UX-Team

Katharina und Tanja haben einige Fragen zu User Experience und dem Mehrwert für Mensch und Umwelt beantwortet. Die Antworten zu dieser und weiteren Fragen könnt ihr in unserem nachstehenden Interview erfahren.

Tanja Brodbeck 3 min 10.12.2020

Nachhaltigkeit in der Frontend Entwicklung

In der Frontend Entwicklung ist es wichtig die einzelnen Lebenszyklusphasen eines Softwareprodukts zu analysieren und dabei die Aspekte der Nachhaltigkeit in den Entwicklungsprozess zu integrieren. Mehr dazu könnt ihr im nachfolgenden Beitrag lesen.

Tanja Brodbeck 16 min 08.12.2020

Nachhaltigkeit im UX-Design

Wie passen User Experience und Nachhaltigkeit zusammen? Katharina und Tanja haben sich in einem Gespräch dazu ausgetauscht – Ihre Gedanken, Hoffnungen und Wünsche zu diesem Thema könnt ihr nun im Folgenden nachlesen.

Tanja Brodbeck 2 min 07.12.2020

Fragen an das Frontend-Team

Wir haben mit unserem Werkstudent David über seine Arbeit und seine Wertvorstellung als angehender Frontend-Entwickler gesprochen. Seine Antworten dazu könnt ihr in unserem nachfolgenden Beitrag lesen.

Jochen Schöllig 3 min 29.01.2018

5 Jahre Codeatelier & homee

Dieser Beitrag ist eine persönliche Nachricht an alle Mitarbeiter von Codeatelier und vor allem an alle homee-Nutzer und unsere unglaubliche Community.

Chris Bertko 4 min 04.10.2017

homee 2.15 und der Winter kann kommen

Seit heute steht die homee Version 2.15 zur Verfügung. Passend zum Winter haben wir den Fokus auf das Thema „Heizen“ gelegt.

Thomas Hartwig 3 min 21.03.2017

Don't guess, measure!

Eure Privatsphäre ist uns schon immer sehr wichtig gewesen und ist es auch nach wie vor, jedoch mussten wir feststellen, dass es schwierig ist, ein Produkt zu entwickeln, ohne über dessen wirkliche Benutzung bescheid zu wissen.

Timo Clasen 4 min 04.01.2017

homee 2017

Im Januar 2016 haben wir nach langer Entwicklungszeit homee 2.0 veröffentlicht 🚀

Lisa-Marie Schwarz 3 min 27.09.2016

Codeatelier @ CODE_n new.New Festival

Festivalbändchen gefällig? Na klar! Fancy Foodtrucks & Indie-Rock-Pop? Internationale Top Startups? Da dürfen wir natürlich nicht fehlen!

Desiree Schneider 3 min 27.06.2016

homee 2.5 - Chart it up!

Das homee Update 2.5 hat neben den üblichen Änderungen und Fehlerbehebungen vor allem ein großes Feature für euch im Gepäck, das wir euch gerne in diesem Blog-Post und im Video vorstellen möchten:

Desiree Schneider 4 min 16.06.2016

Einbrecher mit dem Radio verscheuchen? Die homee Entwickler verraten, wie die Würfel ihr Zuhause smarter machen.

Smart Home Zentralen wie homee regulieren Dinge wie Licht und Heizung – so zumindest meine Annahme, bis ich vor nicht allzu langer Zeit zu Codeatelier gekommen bin. Aber weit gefehlt! Schon nach wenigen Tagen im Team wurde mir klar: Das ist nur die Spitze des Eisbergs! Denn der liebe homee kann auch Einbrecher in die Flucht schlagen und euch zu einer optimalen Sauerstoffversorgung verhelfen…

Desiree Schneider 2 min 09.06.2016

Entwickeln, Beta-testen, releasen: Das System hinter den homee Updates

Vielleicht haben es einige von euch schon bemerkt, aber nach einer langen Durststrecke ohne regelmäßige Updates haben wir mittlerweile ein funktionierendes System, um euch mit neuen Features und Fehlerbehebungen zu versorgen. Wir haben das Ganze jetzt erstmal ein paar Monate auf seine Umsetzbarkeit getestet und sind heute so weit, euch verbindlich zu informieren:

Desiree Schneider 5 min 03.06.2016

homee Entwickler verraten ihre Lieblings-WebHooks

Mit dem Update auf Version 2.4 haben wir für euch Ende Mai die bisher schon viel erwähnten WebHooks als neues Feature in die homee Familie mit aufgenommen. homee kann jetzt WebHooks erstellen, mit deren Hilfe ihr spannende Aktionen auslösen könnt und die euch auf einen Schlag eine Fülle neuer Möglichkeiten bieten. Um euch auf den Geschmack zu bringen, möchten wir euch heute drei coole Beispiele vorstellen, was ihr so mit diesen WebHooks anstellen könnt.

Desiree Schneider 3 min 27.05.2016

homee 2.4 - Homematic, WebHooks, Lebenstracker

Pünktlich zum 27. des Monats ist homee mit dem Update 2.4 für euch am Start! (Vielleicht habt ihr schon gemerkt, dass dies nun unser monatlicher Update-Zyklus ist.) Wir möchten euch die wichtigsten Infos zum Update kurz vorstellen:

Desiree Schneider 4 min 20.05.2016

Die neue homee Community: Forum für Support, Bugreports, eure Vorschläge, Features und Stories

Der liebe homee hat uns heute Morgen anerkennend auf die Schultern geklopft - und zugegeben, auch wir sind ein wenig stolz!

Katharina Clasen 7 min 27.01.2016

homee 2.0 – Funktionen

Die 2.0 Version eures homees und damit auch neue Versionen aller Apps (Android, iOS und Web) sind da. Ihr habt gespannt darauf gewartet und uns auf dem Weg dorthin mit tollen Ideen und hilfreichem Feedback versorgt. Die wichtigsten neuen Funktionen und Änderungen die dabei entstanden sind möchten wir euch hier vorstellen.

Katharina Clasen 10 min 27.01.2016

homee 2.0 – Der Redesign Prozess

Seit Ende 2014 arbeiten wir an der 2.0 Version unseres homees. Wir überarbeiten den homee Kern aber auch alle Apps. Konzept und Design der Apps war dabei mein Part und ich möchte euch heute einen kleinen Einblick in den Prozess gewähren.

Jochen Schöllig 5 min 01.10.2015

Das Leben als Lean-Startup

Heute vor drei Jahren erblickte Codeatelier das Licht der Welt. Es ist also definitiv an der Zeit ein erstes Ré­su­mé zu ziehen und interessierten Lesern und vor allem den ersten homee Nutzern einen Einblick in unser Leben als Startup zu gewähren.

Katharina Clasen 6 min 15.04.2015

Wir arbeiten am homee App Update

Inzwischen hat sich herumgesprochen, dass wir an einem umfangreichen Update für homee arbeiten. Immer wieder erreichen uns Fragen und Feedback unserer User. Die meisten dieser „Requests“ sind bereits berücksichtigt, denn die Meinung unserer User ist uns enorm wichtig.