Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam

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

Incom ist die Kommunikations-Plattform der Fachhochschule Potsdam mehr erfahren

Basics Interface 17|2

Dokumentation der Vorlesung von Boris Müller. Wintersemester 17/18.

01 | Digitales Buch

Aufgabenbeschreibung

Es soll eine digitale Fassung Ihres Lieblingsbuches gestaltet werden. Das Buch kann ein Roman, ein Sach-, Koch- oder Fachbuch, oder auch ein Gedichtband sein. (Keine Comics!) Die digitale Fassung des Buches soll exemplarisch anhand von mindestens vier Screens in zwei verschiedenen Formaten vorgestellt werden - mindestens zwei horizontale Screens im Format von 1024 x 768 Pixeln (XGA) und mindestens zwei vertikale Screens im Format von 240x320 Pixeln (QVGA). Die Screens sollen nicht nur die Inhalte des Buchs wiedergeben, sondern sollen auch das Navigationskonzept verdeutlichen, mit dem die Inhalte des digitalen Buches erschlossen werden können. Lesbarkeit und Klarheit der Darstellung sind die wichtige Kriterien bei der Bearbeitung der Aufgabe. Die Aufgabe soll in Zweierteams bearbeitet werden.

Aufgabe

Ich habe zusammen mit Marius Wies (https://fhp.incom.org/profile/7897) gearbeitet. Für die Aufgabe wir haben das Märchen von Rotkäpchen von die Grimm Brüder zusammen mit der Ilustrationen von Daniel Egnéus. Unsere Adaptation sollte Bild und Text zusammen verbinden so gut wie den gedrücktes Buch.

1024 x 768 Pixeln (XGA)

01_Book_Red_Gross_1.png01_Book_Red_Gross_1.png
01_Book_Red_Gross_2.png01_Book_Red_Gross_2.png
01_Book_Red_Gross_3.png01_Book_Red_Gross_3.png
01_Book_Red_Gross_4.png01_Book_Red_Gross_4.png

240x320 Pixeln (QVGA)

02_Book_Red_Klein_0.png02_Book_Red_Klein_0.png
02_Book_Red_Klein_1.png02_Book_Red_Klein_1.png
02_Book_Red_Klein_2.png02_Book_Red_Klein_2.png
02_Book_Red_Klein_3.png02_Book_Red_Klein_3.png
02_Book_Red_Klein_4.png02_Book_Red_Klein_4.png
02_Book_Red_Klein_5.png02_Book_Red_Klein_5.png

02 | Klangvisualisierung

Aufgabenbeschreibung

Es soll eine aufgezeichnete akustische Begebenheit in einem Zeitraster visualisiert werden. Der zeitliche Ablauf der Begebenheit soll also für den Betrachter nachvollziehbar sein. Das Format der Visualisierung kann frei gewählt werden. Die Audio-Dateien für die akustischen Begebenheiten werden im Kurs zufällig verteilt und sind offen für inhaltliche und visuelle Interpretation.

Aufgabe

Für die Klangvisualisierung haben wir alle Klangen von dem “Sound Map” Projekt die in Floren enstanden ist bekommen: http://www.firenzesoundmap.org/eng/default.asp Mein Sound war http://www.firenzesoundmap.org/eng/dettaglio.asp?id=45 Keine von uns wüste als wir die Aufgabe gemacht haben, wo diese Sounds entsanden waren. Als ich mein Sound gehört habe,war es für mich ein Strand, was ich gehört habe. In mein gemaltes Bild, das Zeit geht nach Innen. Der gemalte Kreis ist durch Links und Rechts in Stereo geteilt. Das Lautstärke der Klängen wird durch die Länge der gemalte „Linien“ representiert.

1.jpg1.jpg
1.jpg1.jpg
2.jpg2.jpg
4.jpg4.jpg
6.jpg6.jpg

Circle.pngCircle.png

03 | GUI – Graphical User Interface

Aufgabebeschreibung

Es soll ein Inspirations-App für das iPhone realisiert werden. Das App soll also eine Gruppe von Designern / Entwicklern bei der Generierung von Ideen, Einfällen und Entwürfen unterstützen. Dabei können assoziative Ansätze genauso verfolgt werden wie strukturelle und systematische. Die genauen Funktionalitäten können in der Konzeptphase entwickelt werden. Es sollen mindestens vier Screens präsentiert werden - gern auch mehr.
Das Ziel ist, einen Entwurf zu erarbeiten, der sowohl den üblichen UI-Standards (iOS oder Android / Material Design) entspricht, aber trotzdem individuelle Züge trägt. Es ist sinnvoll, sich für den Entwurf auf eine Bildschirm-Auflösung festzulegen. Zusätzlich zum Entwurf soll ein Programmablaufplan (Bewegungspfade durch die App) skizziert werden. Die Aufgabe soll in Zweierteams bearbeitet werden.

Aufgabe

Für dieses Aufgabe habe ich zusammen mit Sophie Kremer (https://fhp.incom.org/profile/8598) gearbeitet. Das App heist Creative Minds: „Creative Minds, ist eine App, die Unternehmen, Entwicklern und Designern helfen soll um kreative Lösungen für ein bestimmtes Problem zu finden.Die App wurde vom Double Diamond-Kreativprozess inspiriert. Spielbasierte App“. Die Benutzung der App ist Gedacht als ein Spiel.

App Erklärung:

Das user hat ein Problem und sucht eine Lösung -> er kann in Team oder allein eine Lösung finden -> Durch Zeit und Random Worte werden kreative Sätzen geschrieben -> Diese Sätzen könnten helfen bei die nächte Schritte um die Lösung für das Problem zu finden.

App Flowchart

Screen Shot 2018-02-21 at 11.26.48.pngScreen Shot 2018-02-21 at 11.26.48.png

Creative Minds App

01.Loadingscreen.png01.Loadingscreen.png
02.Login.png02.Login.png
03.1.MainScreen.png03.1.MainScreen.png
03.2.MainScreen_Invitation.png03.2.MainScreen_Invitation.png
04.DefineProblem.png04.DefineProblem.png
05.SelectTime.png05.SelectTime.png
06.GameMode.png06.GameMode.png
07.1.AddMembers.png07.1.AddMembers.png
07.2.FinalTeam.png07.2.FinalTeam.png
08.1.Idee.png08.1.Idee.png
08.2.TastaturIdee.png08.2.TastaturIdee.png
09.TimeOver.png09.TimeOver.png
10.Votation.png10.Votation.png
11.Results.png11.Results.png
12.Export.png12.Export.png

04 | 1000 Worte

Aufgabebeschreibung

Es soll ein komplexer Sachverhalt gesucht und in einem Schaubild oder in einem interaktiven Film dargestellt werden. Die Darstellung darf keinerlei Text enthalten. Der Sachverhalt soll möglichst deutlich und klar kommuniziert werden. Bei der Auswahl eines Themas sollte drauf geachtet werden, dass das Thema hinreichend komplex ist. Naturwissenschaftliche Themen sind z.B. gut geeignet. Es können aber auch Alltagsthemen genommen werden wie z.B. die Zubereitung eines Essens.

Aufgabe

Für dieses Aufgabe habe ich mich darauf entschieden zu erklären wie ein Mexikanisches Mörse produziert wird und wie kann es in der Küche wärwendert werden durch zwei Salsas: „Mexikanisches Salsa“ und „Guacamole.

El molcajete y sus salsas

Screen Shot 2018-02-22 at 09.50.50.pngScreen Shot 2018-02-22 at 09.50.50.png

Die Programmen die für diese Vorlesung benutzen würden sind: Adobe Illustrator, Adobe InDesign und Sketch

Fachgruppe

Interfacedesign

Art des Projekts

Studienarbeit im ersten Studienabschnitt

Betreuung

foto: Prof. Boris Müller

Entstehungszeitraum

Wintersemester 2017 / 2018