Incom ist die Kommunikations-Plattform der Muthesius Kunsthochschule

In seiner Funktionalität auf die Lehre in gestalterischen Studiengängen zugeschnitten... Schnittstelle für die moderne Lehre

Incom ist die Kommunikations-Plattform der Muthesius Kunsthochschule mehr erfahren

Future Ocean Website Redesign – A Responsive Webdesign

Future Ocean Website Redesign – A Responsive Webdesign

Ich habe mich bei meine BA-Thesis mit der Neugestaltung der Website des Exzellenzclusters „The Future Ocean“ der CAU Kiel befasst, wobei das Hauptaugenmerk auf der Entwicklung eines Responsive-Designs lag, welches allen Endgeräten – also auch den neuen mobilen Endgeräte mit vergleichsweise kleinen Bildschirmen – gerecht werden kann.

Responsive Design

future_ocean_01.pngfuture_ocean_01.png
future_ocean_02.pngfuture_ocean_02.png
future_ocean_03.pngfuture_ocean_03.png
future_ocean_04.pngfuture_ocean_04.png
future_ocean_05.pngfuture_ocean_05.png

Eine variable Spaltenanzahl erlaubt dem Layout sich in der Breite dynamisch an die Dimension des darstellenden Endgerätes anzupassen. Vertikaler Überhang bleibt dabei weiterhin durch scrollen erreichbar. Dabei reduziert oder erhöht sich die Spaltenanzahl schrittweise wenn bestimmte Schwellenwerte unter- oder überschritten werden. Gleichzeitig findet eine Umorganisation der Seitenelemente statt, sodass z.B. bei einer Verringerung der Spaltenanzahl Elemente aus nicht mehr vorhandenen Spalten entweder eine andere Position innerhalb des Layouts erhalten oder aber versteckt werden, vom Benutzer jedoch über entsprechende Schaltflächen wieder zur Anzeige gebracht werden können. Eine Vergrößerung bewirkt entsprechend Umgekehrtes. Das Layout mit der minimalen Spaltenanzahl von einer Spalte ist somit z.B. ohne globale Verkleinerung der Website auf Smartphones darstellbar, während bei extremen Auflösungen von über 2000 Pixeln in der Breite normalerweise versteckte Inhalte dauerhaft zur Anzeige kommen können.

Sciencetainment – Entdecke den Ozean der Zukunft

entdeckermodus 01.jpgentdeckermodus 01.jpg
entdeckermodus 02.jpgentdeckermodus 02.jpg
entdeckermodus 03.jpgentdeckermodus 03.jpg
entdeckermodus 04.jpgentdeckermodus 04.jpg
entdeckermodus 05.jpgentdeckermodus 05.jpg
entdeckermodus 06.jpgentdeckermodus 06.jpg
entdeckermodus 07.jpgentdeckermodus 07.jpg
entdeckermodus 08.jpgentdeckermodus 08.jpg

Die Forschungsthemen mit denen sich der Cluster auseinan- dersetzt sind mitunter nicht nur sehr relevant, sonder auch sehr interessant und unterhaltsam für die Bevölkerung. Noch ist die Website jedoch rein informativ konzipiert, obwohl das Medium Internet alle Mittel der Unterhaltungsmedien bereit stellt. Wissenschaft und Unterhaltung gilt es also stärker zu verbinden – nennen wir es Sciencetainment. Die Kernidee dabei ist, ähnliche Inhalte wie sie der Multitouch-Tisch „Future Ocean Explorer“ im Ausstellungskontext anbietet auch online verfügbar zu machen. Es soll eine relativ freie „Spielwiese“ entstehen, auf welcher Inhalte narrativ oder spielerisch inszeniert werden können. Der Benutzer soll sich dabei treiben lassen können und ohne großen Navigationsaufwand interessante Themen präsentiert bekommen. Konkret sollen medial aufgearbeitete gebündelte Themenbereiche präsentiert werden wobei das Medium Video sich hier besonders anbietet. Zusätzlich könnten z.B. interaktive Infografiken auf Grundlage des Key-Visuals entstehen.

Ein Projekt von

Fachgruppe

Zentrum für Medien

Art des Projekts

Bachelorarbeit

Betreuung

foto: Prof. Tom Duscher

Entstehungszeitraum

Wintersemester 2011 / 2012