In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre
In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre
Digital Design Projekte im SS 23/24 von Rebecca Sophia Klassen
Anschließend folgen die Poster die ich über die Website gestaltet habe, dabei habe ich verschiedene Lösungsansätze ausprobiert und bei meinem Favoriten eine zweite Lösung gestaltet.
Für das erste Moodboard meiner Website habe ich mich für das allgemeine Thema der 50er entschieden, weil die Schrifterstellerin sich damals von den Postern und Schildern der 50er in Montserrat hat inspirieren lassen.
Dafür habe ich mir ein Farbschema aus den 50ern und dann verschiedene Plakate und Formen rausgesucht. Anhand dieser Inspiration, kann ich dann meine Website um einiges interessanter und persönlicher gestalten.
Das zweite Moodboard entstand aus einer Idee heraus. Ich habe versucht aus dem Schriftzug „Montserrat“ Formen zu erstellen und dadurch hatte ich die Idee das „O“ durchzuschneiden und eine Seite der Form zu füllen. Da das wie eine Scheibe einer Citrusfrucht aussah, kam mir die Idee, ein Moodboard dazu zu gestalten.
Für die dritte Variante, wollte ich mir noch ein ganz anderes Design überlegen, welches ein wenig dunkler ist. Dabei habe ich mir überlegt mit Leuchtschriften und -schildern zu arbeiten, um eine Art Nachtleben darzustellen.
Letztlich entschieden habe ich mich für das erste Design, da es farblich und thematisch am besten zur Schrift passt.
Nun konnte ich anhand unseres fertigen Artboards, eine eigene Gliederung für die spätere Typografie Website bauen. Hierbei habe ich möglichst verschiedene Größen von Modulen verwendet und diese in verschiedener Weise angeordnet. Beim konstruieren dieser Gliederung, habe ich zeitgleich schon im Hinterkopf überlegt, welche Inhalte ich in diese Module einsetzen würde und demnach entschieden, wie groß ein Modul ungefähr sein müsste.
Aus dem nun fertigen Artboard, habe ich drei verschiedene Rhythmus Übungen gemacht, um ein Gefühl dafür zu bekommen, wie ich solche Module anordnen kann.
Bei den ersten beiden Versuchen habe ich noch relativ gradlinig und Box-artig gearbeitet. Das Ergebnis ist dadurch klar strukturiert und übersichtlich.
Beim dritten Versuch wollte ich mal etwas verrückter und verspielter an die Sache rangehen. Dafür habe ich eine Art versetzte Galerie erstellt, welche als Teiler der jeweiligen Abschnitte fungiert.
In dem Artboard haben Kristin und ich nun alle Module aus meinem Raster hinzugefügt und dieses dann um fehlende Teile aus Kristins Raster ergänzt. Zum Schluss haben wir noch die fehlenden vorgegebenen Textmodule ergänzt.
Da die Spalte ganz links nicht richtig in das Raster passt, habe ich diese für den späteren Verlauf weggelassen, da sie keine weitere Relevanz hat.
Unsere nächste Aufgabe war, dass wir eine Website raussuchen sollten, welche viele verschiedene Elemente enthält wie ein Filtersystem, ein Kontaktformular oder einfache Bild und Textelemente.
Hierbei haben Kristin und ich uns für die Seite von Viessmann entschieden, da sie alle gewünschten Kriterien erfüllt.
Im nächsten Schritt, sollten wir verschiedene typografische Internetseiten raussuchen, welche verschiedene Module im Raster haben.
Nachdem wir jeweils viele verschiedene Internetseiten durchforstet haben, bin ich am Ende bei dieser hier für das Raster gelandet.
https://www.grillitype.com/typeface/gt-america
Link für geteiltes Figma-Board:
Als erstes sollten wir uns ein Hobby von uns überlegen, welches wir in einer Figma-Website darstellen möchten.
Dabei habe ich mich für das Hobby „Makramee knüpfen“ entschieden.
Hierbei haben wir ein Grundgerüst in Figma erhalten und konnten dort ganz einfach unsere eigenen Texte und Bilder von Unsplash verwenden.
Nun sollten wir die Website interaktiv über das Prototyping machen, heißt eine wechselnde Bildergalerie und eine funktionierende Navigationsleiste. Bei der Bildergalerie war auch wichtig, dass man ein Feedback bekommt beim Hovern.