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

Kinderbuch App mit eigenen Interface- Publishing Trends

Kinderbuch App mit eigenen Interface- Publishing Trends

Die meisten Medien bieten an Bücher und Apps in der selben Form wie Bücher was sich nicht immer eignet. Meine Aufgabe war es ein Design von einem einfachem Buch gestalten und von einer App in Form von Ipad und Handy.

Einleitung

Der Kurs thematisiert die Folgen der digitalen Transformation für unabhängige Buch- und Zeitschriftenverlage. Am Beispiel des Oekom-Verlags, einem Fachverlag für Ökologie und Nachhaltigkeit mit Sitz in München, sollen aktuelle und zukünftige Entwicklungen, z.B. zu neuen Vertriebs- und Finanzierungsmodellen (u.a. Crowd Publishing, Multi-Channel-Strategien), möglichen neuen thematischen Schwerpunkten, Medienformaten und Produkten (u.a. Interactive Storytelling, Apps, partizipative Formate), Zielgruppen sowie redaktionellen Gestaltungsfragen (u.a. Design Systeme, CD/CI) untersucht und diskutiert werden.

Recherche

Ich beschäftigte mich von Anfang an in diesem Kurs mit digitalen Büchern vor allem mit E-books. Meine Recherche betrug am Anfang nur die Preise, dessen unterschied zu gedruckten Büchern im Durchschnitt nur 20% betrug. Meine Frage lautete warum es so sei, denn für die gedruckten Bücher ist mehr Aufwand verbunden und die Materialien, die es bei den elektronischen Büchern nicht gibt. Dazu können diese nicht weiterverkauft werden, oder reduziert werden. Was für mich auch ein Problem war, dass die Form des Buches auf beiden Medien gleich ist. Auch wenn ich die .pdf auf meinem Handy kaufe bekomme ich auf dem kleinem Display genau das selbe zu sehen wie in einem A4 Buch. Das führt zu Unübersichtlichkeit, ich muss dann jedes mal alles Zoomen und lesen, weiter scrollen und zurückgehen. Der Lesefluss wird unterbrochen und irgendwann bin ich verloren auf der Seite die ich lese.

Dies gab mir eine Idee für mein Projekt.

Projekt

Ich entschied mich für ein Projekt wo ich ein Design von einem Buch in eine App überbringe. Ich habe dabei mich extra für eine App entschieden, da diese kostenlos sind und mehr und mehr Kinder bevorzugen Technik statt gedruckte Medien. Vieles hängt auch von den Eltern ab, die heutzutage weniger und weniger Zeit für eigene Kinder haben.

Meine Ursprüngliche Idee war es eine App für ein Ipad (Apple) allerdings bei der Umsetzung bin ich auf ein paar Probleme gestoßen, von allen ging es darum einen geeigneten Programmierer zu finden und die Technik, die man dafür braucht. So bleib mir nicht anders übrig als es in Adroid als eine Handy-App raus zubringen.

Das Buch, das ich wählte war mein anderes Projekt aus einem anderen Kurs. Es handelt sich dabei um ein Fabelwesen, das in einem Wald lebt und viele Abenteuer erlebt und neue Freundschaften erschließt.

Untitled.pngUntitled.png

Das war mein Design für die Ipad App. Im meinem gedruckten Buch war immer eine Seite mit dem Text und die zweite mit einem Bild versehen. Das wäre für eine App zu klein und unübersichtlich. Die Texte auch wenn die nur aus 4 Sätzen aufgebaut waren, wären zu lang um es auf dem kleinen Display zu zeigen. Vor allem für die kleinen, die gerade mal das Lesen gelernt haben. So entschied ich mich den Text aufzuspalten und es auf zwei Seiten zu zeigen. Danach würde ein Bild folgen. Manchmal haben ich nur eine Textseite statt zwei, da das Bild besser zu dem Text passt.

Man öffnet die App und hat den Cover zuerst. Dort befindet sich der Button mit „Lesen“. Wenn man diesen betätigt wird man zu den eigentlichen Cover mit dem Titel geleitet. Von dort kann man die Seiten mit dem Finger nach links oder recht schieben.

Oben an jeder Textseite befindet sich ein Bild von einem Lautsprecher, würde man diesen anklicken, wäre der Text vorgelesen. Leider konnte ich diese Funktion für meine ungesetzte App nicht übernehmen.

Android.pngAndroid.png
Android-2.pngAndroid-2.png
Android-1.pngAndroid-1.png

Meine eigentliche App wurde nochmal durchgearbeitet für eine Handyapp. Am Anfang wollte ich mein Design 1:1 übernehmen aber ich sah schnell dass es so nicht geht. Man muss bedenken, dass ein Display von einem Handy (die neuen Modelle) eine „unbequeme“ Größe von 18:9 (2:1) oder 16:10 (~3:2). Schon dort fingen die Probleme an, da meine Bilder perfekt für ein Tablett passten aber viel zu „quadratisch“ für ein Handy waren (3:3,5). Das bedeutete, dass nur 1:3 von meinem Bild zu sehen wäre bei der Fullscreen Darstellung. Der Text, der sich bei meinem früheren Design in einem pinken Kasten befand würde zu viel Platz einnehmen.

Androisd.pngAndroisd.png

So musste ich komplett neues Design erstellen. Das war auch meine Kernidee für den Kurs und somit bekam ich das beste Beispiel an meinem eigenen Projekt.

Ich veränderte alles und entschied mich für ein „Dauerfluss“ von dem ganzen Buch. Die läge ist dabei nicht problematisch. Ich machte eine Startseite mit dem Cover und und zwei Buttons „Lesen“ und „?“. Bei dem Fragezeichen bekommt man alle Informationen über die App und bei „Lesen“ geht man zu dem eigentlichen Buch.

Die Bilder habe ich auf die breite der Seite angepasst. Wenn man möchte kann man diese anklicken und vergrößern. Die Texte werden in zwei Absätzen präsentiert und daraufhin folgt wieder ein Bild. Die leeren, weißen Seiten werden zusätzlich mit pinken Details versehen wie z.B. die drei Punkte, die damit sagen, dass der Text weiter geht.

Androisd-1.pngAndroisd-1.png

Um die volle und funktionale App sich anzusehen, schlage ich vor die zu downloaden:

https://play.google.com/store/apps/details?id=com.wilczyca.butterflies

Mia.PNGMia.PNG

Fazit

Mein Zeil der Arbeit war es sich mit dem Design für jedes Mittel auseinanderzusetzen. Das Problem für mich persönlich ist, dass man nur eine Form von einem Medium bekommt, dass meistens überall gleich aussieht und es nicht an die Technik angepasst wird. Bei meinem Projekt habe ich mich mit vielen Problemen und Fragen auseinandergesetzt und diese wollte ich so gut wie ich konnte Lösen. Mit dem Endergebnis bin ich sehr zufrieden und es zeigt, dass man das Design gut an die Technik anpassen kann.

Ein Projekt von

Fachgruppe

Interfacedesign

Art des Projekts

Studienarbeit im zweiten Studienabschnitt

Betreuung

foto: Prof. Dr. Frank Heidmann foto: Prof. Franziska Morlok

Entstehungszeitraum

Wintersemester 2018 / 2019