aktuelle.kurse/m152/auftraege/b
harald.mueller@tbz.ch 834793a71f ressourcen
2021-07-05 23:00:44 +02:00
..
README.md ressourcen 2021-07-05 23:00:44 +02:00

Aufgabe M152-b: Storytelling, Wireframes, Mockups

Zeitbedarf: ca. 2-3 Modul-Halbtage (8-12 Lektionen) plus die eigentliche Umsetzung bis zum Modulende

Planen Sie Ihre Webseite

Inhalt Ihrer Webseite

Auf Ihrer Webseite müssen Sie folgendes mindestens erklären (=Inhalte -> überlegen Sie die "gute" Reihenfolge selber):

  • Ihr Styleguide
  • Ihr Webseitenkonzept (inkl. Sitemap)
  • Ihre Galerie
  • Ihr Impressum
  • Ihre Erklärungen bezüglich Urheberrecht
  • Ihr Minifilmprojekt und die Einbindung des Filmes in eine Webseite
  • Seite wie man Animationen mit CSS macht (mehrere)
  • Seite wie man Animationen mit "Multi-Gifs" macht und die in die Webseite einbindet
  • Seite was die Unterschiede der Bildformate sind
  • Seite was die Unterschiede zu den Videoformaten & Audioformate sind
  • Ihre Reflexion (in der man sieht, welche "learnings" und welche Erfahrungen Sie gemacht haben)

--> Upload auf Ihre Webseite im Internet.

Gehört zum Modul-Bewertungsraster (K1) M152_Bewertungsraster

Storytelling

1.) ca. 30-40 min

Lesen Sie Kap. 3 im Buch (S. 40-90 , aber bitte nicht jeden Buchstaben -> überflugsmässig)

x_gitressourcen/Buecher_Skripts_Praesentationen/SaewertRiempp2019_Digital-Storytelling-im-Web_9783658230555.pdf

/x_gitressourcen/Buecher_Skripts_Praesentationen/SaewertRiempp2019_Digital-Storytelling-im-Web_9783658230555.pdf

x_gitressourcen/Buecher_Skripts_Praesentationen/SaewertRiempp2019_Digital-Storytelling-im-Web_9783658230555.pdf

../../../x_gitressourcen/Buecher_Skripts_Praesentationen/SaewertRiempp2019_Digital-Storytelling-im-Web_9783658230555.pdf

https://bscw.tbz.ch/bscw/bscw.cgi/d31695006/SaewertRiempp2019_Digital-Storytelling-im-Web_9783658230555.pdf

und lassen Sie sich davon inspirieren,

Mockup, Wireframes

2.) ca. 30-40 min

Studieren Sie, was Mockups und Wireframes sind und schreiben Sie mit eigenen Worten in 3-4 Sätzen, was der Unterschied ist und wozu man das braucht. (Abgabe in txt-File hier im Auftrag)

https://www.webschmoeker.de/webdesign/unterschied-wireframe-und-mockup/

https://bscw.tbz.ch/bscw/bscw.cgi/31665901

Wireframe anwenden

3.) ca. 60-80 min

Erstellen Sie eine Planung Ihrer Webseite mit einem Wireframe-Tool (oder skizzieren Sie von Hand / dann scannen oder fotografieren) und stellen Sie die entstanden Bilder/Grafiken/Scans in Ihrer neuen Webseite dar.

wieviele und welche Seiten was ist in Etwa drauf (keine Details!!)

https://www.elmastudio.de/eine-neue-webseite-entsteht-teil-2-die-layout-vorlage-mockup/

Und machen Sie es so, wie diese Firma es für ihre Kunden anbietet.

https://www.snowflake.ch/ux-design/