Skizzen

Ich habe Adobe XD echt lange herausgeschoben. Hatte irgendwie keine Lust, ein neues Programm zu lernen. Das klingt echt doof, i know. Drum habe ich meinen Klick Dummie einfach mal überhüpft und einfach ein lausiges Layout im InDesign gebastelt. Dies hat mir geholfen, mir spezifischere Gedanken zum Layout und der Gestaltung zu machen.

Nach dem Coaching wurde ich ermutigt, mit mehr Farben oder Icons zu arbeiten. Zudem wurde mir die Angst vom Programm genommen. Ich beschloss einfach mal im XD drauf los zu basteln. Uns siehe da, mein Layout hat sich in vielen Schritten weiterentwickelt. Ich habe gemerkt: Hey hier fehlt noch was. Oder einfach gesehen, dass meine Vorstellungen auf den Skizzen besser aussahen, schlussendlich aber nicht Benutzerfreundlich waren.

Hintergrundfarbe

So ist mir beim erstellen zum Beispiel aufgefallen, dass eine rein Weisse Hintergrundfarbe echt langweilig wirkt. So habe ich mein buntestes Icon genommen (Das Huhn) und es auf verschieden-farbige Hintergründe platziert. Herausgekommen ist eine Farbe, welche mich echt überrascht hat. #E2EEFF eine Mischung aus Blau und Flieder war die perfekte Hintergrundfarbe, welche Schrift und Illustrationen super zu Geltung bringt.

Navigation

Auch die Navigation wurde noch einmal angepasst. Die Reihenfolge musste ich ändern, da sich die Animationen im Adobe XD in die quere kamen. Zudem wurde der Truck durch das Brunch-Angebot ersetzt. Einfach, weil ich keine Food Truck-Bilder auftreiben konnte.

Das Animieren der Navigation kostete mich auch viel Nerven und Zeit. Schaut man von jenen Versuchen ab, die zwar geklappt haben, ich aber nicht gespeichert habe, bin ich sicher 3 Tage dran gesessen. Ich wollte eine Navigation als Dropdown, welche jedoch mit Hower die Interaktion des Users anzeigt – klingt doch einfach nicht? Nicht für XD. Aber irgendwie habe ich es einigermassen hinbekommen.

Footer

Der Footer wurde ganz schön voll. Ich wollte eine Metanavigation einbauen, einfach weil ich die praktisch finde. Zudem brauchte es Info zum Kontakt, Social Media und ein fänsi Newsletter-Tool.

Brot-Tinder und Co

Nach meinen anfänglichen Schwierigkeiten mit Adobe XD habe ich mich echt in das Tool verliebt. InDesign und Illustrator können einige Features echt gut gebrauchen. Da ich gerade im Flow war, habe ich mir noch einige Spielereien überlegt. Eine davon ist das Brotaufstrich-Tinder, wo man gleich mal erfährt was zu einem passt. Jedoch kamen auch andere Seiten dazu, welche ich nicht von Anfang an eingeplant habe. So ist mir aufgefallen, dass man den Warenkorb ja auch noch braucht und den irgendwie befüllen sollte. Zudem will man im Shop ja auch was kaufen, wie kann man dann zahlen? So viele Fragen die noch aufgetaucht sind. Folgende Zeiten sind im nachhinein noch dazu gekommen:

  • Brot-Tinder
  • AGB und Datenschutz
  • Warenkorb (leer und befüllt)
  • Produktbestellen
  • Animationen wie Bestellung, Reservation und der Hofladenkarte