2021-05-20 17:39:00 +02:00
# Aufgabe M152-b: Storytelling, Wireframes, Mockups
2021-05-18 00:10:39 +02:00
Zeitbedarf:
2021-05-18 01:27:09 +02:00
ca. 2-3 Modul-Halbtage (8-12 Lektionen) plus die eigentliche Umsetzung bis zum Modulende
2021-05-18 01:17:03 +02:00
2021-05-18 01:27:09 +02:00
## Planen Sie Ihre Webseite
2021-05-18 01:17:03 +02:00
2021-05-18 01:27:09 +02:00
### Inhalt Ihrer Webseite
2021-05-18 01:17:03 +02:00
Auf Ihrer Webseite müssen Sie folgendes mindestens erklären (=Inhalte -> überlegen Sie die "gute" Reihenfolge selber):
2021-05-18 01:19:50 +02:00
- 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)
2021-05-18 01:17:03 +02:00
--> Upload auf Ihre Webseite im Internet.
2021-05-18 01:27:09 +02:00
Gehört zum Modul-Bewertungsraster (K1) M152_Bewertungsraster
2021-05-18 01:17:03 +02:00
### Storytelling
1.) ca. 30-40 min
Lesen Sie Kap. 3 im Buch (S. 40-90 , aber bitte nicht jeden Buchstaben -> überflugsmässig)
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/
