Home

Webdesign · Ziele & Zeit

Content

Ziele

Lernziel

  • Die Studierenden sollen in der Lage sein ein Webprojekt technisch und gestalterisch zu verstehen
  • Eine Gestaltung passend zum Problem kann gefunden werden
  • Der Gestaltende soll in der Lage sein, dem Techniker/Programmierer seine Anforderungen zu vermitteln.
  • Grundlagen der Webtechnologie sind verstanden.

Nicht im Fokus

Technische Realisation von Websiten

Neue Form (Lessions Learned)

  • Die Arbeitslast der Studierenden wurde als zu hoch erachtet neu werden nur noch drei Praxisarbeiten gemacht (zuvor vier).
  • Die Theorie-Blöcke sollten mehr aufgebrochen werden und mit mehr Interaktion versehen sein.
  • Es wurde gewünscht, einwenig tiefer in die Technik zu schauen.
  • Die Vorstellung der Schriften wird aufgrund der positiven Rückmeldung beibehalten.

Anspruch HF 2015

  • Kollektive Arbeitsformen sollen im Unterricht einfliessen
  • Unterlagen sollen in HTML gelöst werden

Ablauf

Der nachfolgende Zeitplan gilt als grobe Übersicht, es kann je nach Arbeitsgeschwindigkeit zu Abweichungen kommen.

Aufgaben

Insgesamt wir es drei praktische Aufgaben geben:

  • Adressregister (mit Update)
  • Gerät
  • Architekten (mit Update)

Zusätzlich muss jeder Schüler eine Schrift vorstellen und im Kollektiv muss ein Wikipedia-Artikel erstellt werden. Es wird mit 4h Hausarbeit pro Woche gerechnet.

Sonstiges

Alle Unterlagen werden am Ende des Moduls digital abgegeben. Alle von Stefan Huber erstellten Inhalte für das Modul «Web» an der Schule medienformfarbe im Jahr 2017 können unter der Lizenz Creative Commons Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) genutzt werden.

Zeit

Grundlagen

24. Februar 2017

Gestaltung
  • Paperprototype
  • Screensizes
Praxisarbeit
  • Install-Party
  • Adressregister – Papierprototype (4 Gruppen)
  • Adressregister – Update
  • Adressregister – Besprechung in Klasse
Font
  • Open Sans
Technologie
  • Geschichte Internet
  • Aufbau Internet
  • Domains (Registrar)
Hausarbeit
  • Adressregister – Entwurf
  • Font
  • Wiki

Raster

3. März 2017

Gestaltung
  • Raster
  • One-Pager
Praxisarbeit
  • Wikipedia-Artikel
  • Adressregister – Besprechung
Font
  • Fira Sans
Technologie
  • HTML
  • (JS Bin)
Hausarbeit
  • Adressregister – Entwurf
  • Font
  • Wiki

Next Design

10. März 2017

Gestaltung
  • Responsive Design
  • Corporate Design
Praxisarbeit
  • Adressregister – Besprechung in Klasse
  • Gerät – Besprechung
Font
  • Source Sans Pro & Source Serif Pro
  • Ubuntu Font Family
Technologie
  • Browser
  • HTML & CSS
Hausarbeit
  • Gerät – Entwurf
  • Font
  • Wiki

17. März 2017

Gestaltung
  • Menüführung
Praxisarbeit
  • Gerät – Besprechung
Font
  • Droid Schriftsippe
  • PT Sans & PT Serif
Technologie
  • HTML, CSS & JavaScript
Hausarbeit
  • Gerät – Entwurf
  • Font
  • Wiki

Paradigmen

24. März 2017

Gestaltung
  • Interaktion
  • Flat Design, Material Design und Skeuomorphismus
Praxisarbeit
  • Gerät – Besprechung in Klasse
  • Architekten – Besprechung
Font
  • Aller
  • Abril Fatface
Technologie
  • FTP & REST
  • Server-Technologie
  • Database
Hausarbeit
  • Architekten – Entwurf
  • Font
  • Wiki

Fonts

31. März 2017

Gestaltung
  • Fontlizenzen
  • Fontskaufen
  • Freefonts
  • Responsive Fonts & Variable Fonts
Praxisarbeit
  • Architekten – Besprechung
Font
  • Arial & Helvetica (im Bezug auf CJK)
  • San Francisco (Apple)
Technologie
  • Fontdarstellung
Hausarbeit
  • Architekten – Entwurf
  • Font
  • Wiki

Lesen

7. April 2017

Gestaltung
  • Typografie im Detail
  • Mengentext
Praxisarbeit
  • Architekten – Besprechung
  • Architekten – Update
Font
  • Verdana & Lucida (im Bezug auf Screen-Anwendung)
  • Montserrat
Technologie
  • Lizenzen
  • Rechte
  • (freie) Quellen
Hausarbeit
  • Architekten – Entwurf
  • Font
  • Wiki

Neue Welten

5. Mai 2017

Gestaltung
  • Neue Devices
  • Neue Inputs
  • Zukunft
Praxisarbeit
  • Architekten – Besprechung
Font
  • Lato
Technologie
  • Mobile
  • Wearables
  • TV
  • Zukunft
Hausarbeit
  • Architekten – Entwurf
  • Font
  • Wiki

Verbinden & Verknüpfen

12. Mai 2017

Gestaltung
  • Fremde Komponenten
  • Videos
  • Sound
  • Kunst
Praxisarbeit
  • Architekten – Besprechung in Klasse
Font
  • Anivers
  • Vollkorn
Technologie
  • iframe (ojemine) & co
Hausarbeit
  • Webshop – Interaktion
  • Font
  • Wiki

Inhalt & Prototype

19. Mai 2017

Gestaltung
  • Frameworks
  • Tempates
  • Website Builder
  • CMS
  • ((Puffer))
Praxisarbeit
  • Wiki – Besprechung
  • Webshop – Besprechung
Font
  • Alegreya
Technologie
  • CMS
  • Tracking, Stats







Hinweis

Gemäss Schulleitung müssen Hausarbeiten pünktlich abgegeben werden. Ist dies nicht der Fall, so wird die Arbeit mit der Note 1 bewertet.

Ziele & Zeit · Dipl. Gestalter/in HF, Kommunikationsdesign