Backyard Brew

Bier? Bier! Lecker Bier!
Zusammen mit Freunden bin ich unter die Heimbrauer gegangen. Wir gründeten Backyard Brew und es musste natürlich ein Logo, ein Etikettendesign und eine Webseite her. Bevor es an das Designen der Etiketten und der Webseite ging, musste erstmal ein Logo samt Namen entwickelt werden. Der Name war schnell gefunden: wir treffen uns regelmäßig in unserem Hinterhof zum Bierchen trinken und da bot sich natürlich der Name Backyard (engl. für Hinterhof / Garten) an. Wir wollen uns auf Craft-Biere konzentrieren und dafür wird eine ordentliche Portion an Hopfen benötigt. Aus diesem Grund ziert eine große Hopfenblüte unsere Wort-Bild-Marke. Im nächsten Step konnten die Etiketten gestaltet werden. Nach einer Recherche, was alles auf ein Bier-Etikett muss, ging es auch direkt los. In den nächsten Wochen und Monaten planen wir viele Biere zu brauen - daher ist es wichtig, dass man die Bierstile anhand des Etiketts auf dem ersten Blick unterscheiden kann, aber trotzdem, ein einheitliches, konsistentes, aufgeräumtes Etikettendesign hat. Auf der linken Seite des Etiketts wird das Backyard Brew Logo zusammen mit dem Mindesthaltbarkeitsdatum dargestellt. Das Mindesthaltbarkeitsdatum kann nach der Bierabfüllung auf dem Etikett angekreuzt werden. Das macht es einfacher und kostengünstiger, da die Etiketten in größerer Menge bestellt und wiederverwendet werden können, sollte das Bier nochmals gebraut werden. Auf der rechten Seite des Etiketts werden Biertitel, die Zutaten und weitere notwendige Informationen aufgelistet. Im Hintergrund wird ein passendes Muster und Illustration aufgemalt.
„Ein Logo ist dann gut, wenn man es mit dem grossen Zeh in den Sand kratzen kann.“
Kurt Weidemann, Typograph, Gestalter

Vom Logo und Etikett zu einer responsive Webseite
Da es aktuell noch an Content mangelt, bzw. dieser erst nach und nach entstehen wird, setzte ich beim Design-Prozess der Webseite auf große Fonts und stellte die zwei bereits gebrauten Biere in den Vordergrund. Auf der Bier-Detailseite gibt es einen kurzen Überblick, wie es zum Bier kam, wie die Auflage ist, wie viel Umdrehungen es hat und wie ausgeprägt die Hopfig- Malzig- und Bitterkeit ist. Das Design vom Etikett sollte sich außerdem auf der Webseite und der entsprechenden Bier-Sektion wiederfinden. Das Content-Management-System Contao ist im Einsatz, um die Pflege einfach zu halten und die Webseite schnell erweitern zu können. Es wurden diverse Inhaltselemente programmiert, damit neue Biere easy und unkompliziert hinzugefügt werden können.
Die Webseite wird noch weiterentwickelt. Um den Gär- und Reifeprozess zu überwachen, befindet sich ein Raspberry Pi mit verschiedenen Sensoren im Braukeller. Ich würde gerne noch diese Live-Daten auf die Webseite bringen. Des Weiteren würde ich mir noch eine Bewertungs- und Kommentarfunktion auf der Bier-Unterseite wünschen.
Der Weg zur Backyard Brew Webseite
In der Konzeptions-Phase wurden Webseiten von Brauereien betrachtet. Ein Entwurf von Herny Gillis, welchen er auf Dribbble veröffentlicht hatte, hat mich sehr angesprochen, da dort mit großen Fonts gearbeitet und der Fokus auf die Biere, sowie deren Eigenschaften gelegt wurde. Auf der Webseite der BrewDog-Brauerei fand ich die Darstellung ein Einordnung der Geschmacksnoten gelungen.
Außerdem wurden rechtliche Aspekte abgeklärt. So ist es bei einer Brauerei-Webseite notwendig, eine Altersabfragung zu integrieren. Wenn der User die Webseite besucht, muss er bestätigen, dass er über 18 Jahre alt ist.
Im Anschluss wurden erste Skizzen angefertigt, die Seitenstruktur bestimmt und der Design-Prozess in Adobe Photoshop angegangen. Die Erkenntnisse aus der Konzeptions-Phase und die Skizzen wurden in ein ansprechendes Design umgewandelt.Die Farben aus den Bier-Etiketten, sowie aus dem Marken-Logo, ergaben die Farbpalette der Webseite. Ich wählte ein dunkles Theme mit kräftigen Akzentfarben, um die Biere und Informationen hervorzuheben.
Nachdem das Design stand wurde die Webseite programmiert. Das Content-Management-System Contao ist im Einsatz, um eine unkomplizierte Inhaltspflege und Erweiterbarkeit zu gewährleisten. Zum Abschluss wurde die Webseite noch für mobile Endgeräte optimiert und ausgiebig getestet.