Die bayrische Bäckerei Hummel, welche seit mehr als 22 Jahren existiert, will ihr Angebot online präsentieren. Der Familienbetrieb bietet Backwaren nach alten Rezepturen an, die ohne Zusatzstoffe produziert werden. Jeden zweiten Sonntag liefert die Bäckerei ihre Backwaren auf Vorbestellung aus und will einmal pro Monat einen Workshop anbieten. Für die Bäckerei wird eine Website erstellt. Der Webauftritt wird als Onepager aufgebaut. Jeder Bereich des Familienunternehmens (Unser Betrieb, Backwaren, Kaffee & Tee, Nudeln & Mehl, Workshop, Kontakt) soll mithilfe eines kurzen Infotexts erklärt werden. Die Infotexte werden mit anschaulichen Bildern ergänzt. Zu Beginn des Arbeitsprozesses werden Skizzen für die Desktop-, sowie für die Smartphonevariante entworfen. Anschließend werden Wireframes erstellt und mit Inhalt befüllt, daraufhin dann als Mockup präsentiert. Im Anschluss steht der finale Dummy zur Schau. Die Inhalte werden mithilfe von eigens kreierten Formen umgesetzt. Es wird nicht auf vorgefertigte Templates zurückgegriffen, um die persönliche Designvorstellung bestmöglichst darzustellen und für die Bäckerei Hummel ein weiteres Alleinstellungsmerkmal zu gewährleisten. In der Desktop-Variante wird mit einem 12-Spalten-Raster gearbeitet, in der Mobile-Variante hingegen mit einem 4-Spalten-Raster. Der Inhalt in der mobilen Version ist äquivalent zu dem der Desktop-Version. Die Menüleisten sind am oberen Bildschirmrand fixiert, damit die Menüpunkte jederzeit erreichbar sind. Diese sind auf den Unterseiten „Impressum“ und „Datenschutz“ identisch. Der Footer, der die Verlinkungen der eben genannten Unterseiten enthält, tritt ebenfalls auf allen Seiten unverändert auf. Um das Mockup möglichst ansprechend anzufertigen, wird im Vorhinein ein Design Manual ausgearbeitet, in dem Schriftwahl, Farbwahl, Formensprache, Bildsprache, Buttons und Icons definiert werden. Die Schriftwahl fällt auf die moderne Grotesk-Schrift Futura. Die serifenlose Linear-Antiqua von Paul Renner verkörpert die Modernität und Eleganz der Bäckerei Hummel und unterstützt den zeitgemäßen Onlineauftritt. Hervorhebungen und Hierarchien werden mit drei verschiedenen Schriftschnitten der Futura-Font und mithilfe von variierenden Farbigkeiten dargestellt. Die Farben korrespondieren mit der Innenarchitektur der Bäckerei Hummel, welche sich schwarzen Stahlkonstruktionen, grauen und weißen Dekorationsinhalten und Holzelementen bedient. Die Produkte geben eine Goldbraune Farbe ab. Die Farbe Weiß sorgt für den neutralen Hintergrund des Onepagers. Überschriften, textliche Hervorhebungen, Konturen und Icons greifen auf die Farbe Schwarz zurück, die sich durch den Hell-Dunkel-Kontrast zum Hintergrund klar abhebt. Grau ergänzt die Farbreihe perfekt und reiht sich hierarchisch unter dem Schwarz ein. Somit eignet sich die Farbe optimal für die Paragrafen und Hintergründe. Die Formensprache beschränkt sich auf rechteckige Formen mit abgerundeten Ecken und schwarzen Konturen. Grau gefüllte Formen ohne Konturen ergänzen die Auswahl und werden beispielsweise für Bildhintergründe verwendet. Die Formen vermitteln ein harmonisches Zusammenspiel mit der Typografie. Die Bildsprache orientiert sich an der Farbwahl und an den Eindrücken des Backshops der Bäckerei Hummel. Die Bilder haben das herausragende Präsentieren der goldbraunen Backwaren als Ziel. Die Produkte sollen hochauflösend mit professioneller Belichtung auf grauem oder hölzernen Hintergrund in Szene gesetzt werden. Der finale Website-Dummy enthält alle Inhalte, tritt einheitlich und ansprechend auf und ist technisch umsetzbar.

©NicoMediaDesign