Design Portfolio

Stephan Hafner

By

Future Steps

Es gibt einige Dinge die noch weit weg von der Entwicklung sind, dazu gehören:

Erfolge:

achieve

Als Langzeit Motivation für Cook-i soll ein Erfolgssystem eingeführt werden. Der User kann sich registrieren, anschließend kann er Erfahrungspunkte und Erfolge sammeln. Erfahrungspunkte werden für jedes Rezept vergeben, auch das Erhalten von Erfolgen gewährt Erfahrungspunkte. Jeder Rang hat sein eigenes Emblem.

Description:

artikel_description

Falls es Zutaten gibt, die dem User nicht bekannt sind, so soll er direkt neben der Zutat einen Infobutton finden, dieser erklärt ihm um was es sich bei der Zutat handelt (bekanntes Produkt mit unbekanntem Namen etc.).

By

Upload

upload

Der Upload ist schlicht gehalten wie der ganze Rest der Seite. Mit einem Button lassen sich bis zu 20 Zutatenfelder generieren. So wird gewährleistet, dass der User beliebig viele Zutaten (max. 20) hinzufügen kann, ohne von Anfang an eine lange Aufzählung von Zutatfeldern zu haben.
Ein einfaches Dropdown-Menü legt fest, in welcher Kategorie das Rezept abgelegt werden soll.
Um den Upload von Dateien zu vereinfachen, ist ein Multiupload eingerichtet, das dem User erlaubt, mit einem Button mehrere Dateien auszuwählen.

By

Artikel

artikel

Um dem User die Möglichkeit zu geben sein Rezept schnellstmöglich zu verteilen gibt es neben den typischen Share Elementen (Facebook, Google+, Drucken) einen QR-Code, der zu jedem Rezept automatisch erstellt wird, und von dem User frei verteilt werden kann. Alle Bilder und Videos zu einem Rezept befinden sich in einem einheitlichen Player. Im unteren Bereich finden sich die typischen Elemente wie Zutatenliste, Anleitung und Zubereitungszeiten. Bei der Zutatenliste soll später noch eine Beschreibung hinzukommen.

By

Kategorie

kategorie

Die Kategorien sind so unterteilt, dass die wichtigsten Bereiche abgedeckt sind. Bei speziellen Zutaten wird in der Regel die Suche zu Hilfe genommen. Jede Kategorie erhält einen Button mit dem jeweilig passenden Piktogramm.

By

Home

home

Um eine Überflutung an Informationen zu vermeiden, ist die Home Ansicht in 4 Bereiche unterteilt, die immer wieder ausgetauscht werden können.

By

Navigation

navigation

Um eine riesige Ansammlung von Kategorien zu vermeiden, sind die Hauptkategorien in der Navigation direkt ansteuerbar und in diesen findet man lediglich eine kleine Auswahl von weiteren Kategorien.
Der Upload ist nicht in der Navigation zu finden, da er ein eigenes Widget, erhält wodurch er sehr gut sichtbar und immer leicht zu erreichen ist.

By

Background

Nachdem nun die ganzen technischen Herausforderungen gemeistert sind und man ohne Anmeldung einfach und schnell Rezepte hochladen kann, komme ich nun zur Gestaltung von Cook-i.de.
Wie im Farbschema erwähnt, soll der Hintergrund Blautöne enthalten. Ich hab mich für ein Tischtuch mit ähnlichen Look entschieden.

[ File # csp11469477, License # 2310774 ]Licensed through http://www.canstockphoto.com in accordance with the End User License Agreement (http://www.canstockphoto.com/legal.php)(c) Can Stock Photo Inc. / pockygallery

By

Probleme

Wie erwartet kam es zu einigen Problemen beim Upload von Rezepten ohne Anmeldung, WordPress braucht, um Artikel veröffentlichen zu können, einen angemeldeten User. Gemeinsam mit Freddy Macchi haben wir das Problem umgangen, in dem wir dem abgesendeten Formular die Kennung eines Users geben. Jetzt ist jedes Rezept in WordPress von Externel User, in den Artikeln aber werden die eingegeben Namen angezeigt.

By

WordPress

Für die Erstellung der Homepage möchte ich das CMS WordPress verwenden, da es mit seiner Vielzahl an Plugins mir in vielen Bereichen behilflich sein kann. Da ich aber zur einfachen Erstellung von Rezepten auch ohne Login das uploaden ermöglichen möchte, wird es hier wahrscheinlich zu Schwierigkeiten kommen.

By

Logo

Das Logo soll einen seriösen aber auch leicht verspielten Eindruck hinterlassen, leicht im Gedächtnis bleiben und vielseitig verwendbar sein.

logo

Durch eine gewichtige Font erhält das Logo einen seriösen Eindruck. Um dem Ganzen etwas von der Ernsthaftigkeit zu nehmen, ist die Kochmütze da. Die Kochmütze gibt dem Logo einen Wiedererkennungswert sowie einen Hauch Verspieltheit.