WEB PORTFOLIO FACHKLASSE GRAFIK 3A/3B - 2016-2017

Portfolio Projekt

PROJEKTBESCHRIEB PORTFOLIO WEB

Verlangt wird eine selbst gestaltete und programmierte Portfolio Website, welche vom Gestaltungskonzept her an die Print Version des Portfolios angelehnt sein muss (eigene Corporate Identity bewahren). Diese Website dient der eigenen präsentation im Web im Allgemeinen und der künftigen Bewerbung für das Praktikum im Speziellen.

AUFGABENSTELLUNG

Auszug aus der Bildungsverordnung Grafiker EFZ, siehe auch PDF

Das individuelle Portfolio dient den Grafikerinnen und Grafikern zu Bewerbungs- und Dokumentationszwecken.
Die Arbeit am Portfolio beginnt im fünften Semester und dokumentiert in einer geeigneten medialen Form die persönliche gestalterische Leistung aus der Ausbildungszeit gemäss Richtziel 3.1.3 des Bildungsplans. Mediale, strukturelle und gestalterische Möglichkeiten werden vorgestellt und ausprobiert. Konzipiert und umgesetzt wird das eigene Portfolio im Lehrbetrieb. Den Lernenden wird die dafür notwendige Zeit zur Verfügung gestellt.

Die Form und der Umfang des Portfolios sowie der Materialeinsatz sind frei wählbar. Das Portfolio muss
selbsterklärend, jederzeit betrachtbar sein und von einer Person ohne grösseren Aufwand transportiert
werden können.

Portfolio Elemente:

Neben einem Kommentar zum Gestaltungsprozess, zu den eigenen Leistungen und zum konkreten Resultat enthalten die Erläuterungen Angaben zu den folgenden Punkten:

  • Projekt Kurzbeschrieb
  • Entstehungsjahr
  • (Kunde/Auftraggeberb falls vorh.)
  • Weitere Rahmenbedingungen
  • Anteil der eigenen Leistung

EIGENE DOMAIN MIT HOSTING

Die Website muss auf einer eigenen Domain publiziert werden. Wer bereits eine Portfolio Website oder zumindest eine Domain betreibt, evtl. mit anderen Inhalten als dem eigenen Portfolio, soll sich mit mir in Kontakt setzen. Das eigene Portfolio sollte im Hauptordener der Website gespeichert sein und besser nicht in einem Unterordner. Wer bereits ein Web Portfolio mit einem Content Management System betreibt, soll sich ebenfalls bei mir melden.

Details zum Thema Domain und Hosting buchen hier.

PROJEKTVORGABEN PORTFOLIO WEB

Art:

  • Portfolio Website – Darstellung der eigenen Arbeiten

Bauweise:

  • Eigens erstelltes HTML und CSS. Erlaubt ist das Verwenden von einzelnen Codefragmenten aus dem Internet, nicht jedoch das Verwenden von kompletten Vorlagen (Templates)
  • Die Website muss responsiv sein (Smartphone/Tablet/Laptop/Desktop)
  • Kein Content Management System (CMS) erlaubt (Ausnahme: wer bereits eine Portfolio Website per CMS betreibt, erhält eine individuelle Aufgabenstellung)

Anforderungen:

  • Einstiegsseite (Home) mit funktionierender Navigation
  • Galerie/Portfolio Seite(n) mit  Bildumfang vergleichbar zu Print (kann gleich, weniger oder auch mehr sein)
  • Eine "Über mich/Kontakt" Seite mit Kontaktangabe (Email Pflicht, Wohnort ohne Adresse empfohlen, Adresse und Telefon nicht empfohlen). Selbstportrait sehr empfohlen.

Technische Spezifikationen:

  • Dokumente mit HTML5,  CSS3 und UTF-8  erstellen
  • Einbinden von Schriften empfohlen (Google Fonts, eigene Schriften, usw.). Bei der Eindbindung lokaler Schriften ist die Lizenz abzuklären. Nicht eingebundene 'Websafe Fonts' wie Arial, Verdana, Courier, Times usw. sind zugelassen, aber auf Grund ihrer Überpräsenz im Web vom Gestalterischen her nicht unbedingt empfohlen
  • Funktionierende Navigation – Benutzer muss auf jeder Seite sinnvoll navigieren können
  • Head/Meta: Korrekte <title> Tags, korrekte Stylesheet / Javascripts Pfade; Viewport Tag; weitere Meta Tags fakultativ
  • Styles in der CSS Datei festgelegt, keine In-Line Styles im HTML

Zugelassen:

  • Verwendung von HTML und CSS Codefragmenten aus dem Web
  • Javascript /jQuery Elemente wie Navigation, Slideshows können übernommen, müssen aber individuell gestaltet werden
  • Videos (Vimeo, Youtube, lokale, usw.)
  • Flash Movies  (als einzelne Elemente, aber nicht als Gesamtwebsite)

Pageload:

  • Es ist auf das Dateigewicht jeder einzelnen Seite zu achten
  • Insbesondere bei "One-Page"-Konzepten ist auf den Pageload zu achten
  • Eine Seite sollte maximal 2-3 MB schwer sein (muss auf Mobilnetz 3G schnell genug geladen werden können)
  • Kontrolle des Pageload möglich auf https://tools.pingdom.com/ (URL der Site eingeben, "Start Test", dann "Page Size" beachten)
  • Bildformate sind angemessen zu bestimmen und insbesondere JPG's korrekt zu komprimieren (vor allem bei One-Page Sites muss extrem komprimiert werden, JPG Qualität bis unter 20%)

BEWERTUNGSKRITERIEN PORTFOLIO ALLGEMEIN (BiVo)

Medium

  • Das gewählte Medium entspricht den Arbeiten
  • Der Materialeinsatz ist angemessen
  • Das Portfolio ist sauber umgesetzt
  • Die Art und Weise ist eigenständig/zeigt Persönlichkeit

Konzeption

  • Der Aufbau ist nachvollziehbar und interessant
  • Die Navigation ist logisch und hilfreich
  • Die Auswahl der Arbeiten ist zweckdienlich
  • Das Portfolio kann beliebig erweitert/adaptiert werden.

Gestaltung

  • Der Einsatz von Schrift (Typografie, Satz) ist gekonnt umgesetzt
  • Die Inszenierung der Arbeiten ist überzeugend und qualitativ hoch
  • Das Layout ist ansprechend gestaltet
  • Das Layout ist mediengerecht gestaltet

Erläuterung

  • Die Erläuterungen sind vollständig (gemäss Aufgabenstellung)
  • Der Umfang macht in Bezug auf die Arbeiten Sinn
  • Die Selbsteinschätzungen/Aussagen sind schlüssig

Download Auszug Bildungsverordnung Grafiker EFZ (PDF)

BEWERTUNGSKRITERIEN PORTFOLIO WEB-SPEZIFISCH

Zwischenabgabe

  • Struktur (Foto Post-it's genügt), Fotos von Layoutskizzen (Desktop/Mobil), Screenshots von allfällig bereits vorhandenen Musterseiten

Gestaltung

  • Frontend Design: Gestaltung der Website im Allgemeinen
  • Interface Design: Gestaltung der Bedienungslemente im Speziellen
  • Webgerechte Medieneinsatz: Formate  png/Grafiken, jpg/Fotos, gif/Anim., Grössen nicht mehr als 30% darüber, Farbmodus  RGB, Auflösung 72 dpi
  •  Korrekte Bildbearbeitung ( angemessene Kontraste, Sättigung, Schärfe, usw.)

Technik

  • Informationsarchitektur: Strukturierung, Benennungen der Rubriken, angemessene Beschreibungen der Inhalte, Rechtschreibung
  • Technische Funktionalität (muss einwandfrei sein – keine Bugs)
  • Responsivität
  • Usability: Nachvollziehbare, benutzerfreundliche Bedienung
  • Dateibenennungen und Pfade korrekt
  • Server korrekt eingerichtet

Arbeitshaltung

  • Einhaltung der Termine (Zwischenabgabe, Präsentation)
  • Lernhaltung (will Schwierigkeiten meistern)
  • Wille zur Autodidaktik
  • Disziplin (pünktliches Erscheinen, zielgerichtetes Vorgehen)