Revolution der Autotechnik
Zum PrinzipSpaß! Gemeinschaftsgefühl! Lebensfreude! Karaoke im Auto ist eine innovative, von Tesla entwickelte Technik, die demnächst in ihrem neuen Modell auf den Markt gebracht wird.
Unser ProjektJeder singt gerne während dem Fahren zu seinen Lieblingssongs oder zu Liedern aus dem Radio.
Mit der Karaoke-Software für ihren Tesla können sie noch mehr Spaß beim Singen haben!
Wenn sie im Stau stehen, mit den Kindern in den Urlaub fahren, oder einfach mit Freunden unterwegs sind, mit einer Karaoke-Software in ihrem Tesla wird ihnen und ihren Liebsten nie mehr langweilig.
Ihnen wird angezeigt, ob sie die Töne treffen, oder ob sie am Ziel vorbeischießen. Finden sie heraus ob nicht vielleicht ein Gesangstalent an ihnen verloren gegangen ist.
Wer kann am Besten singen? Finden sie es während einem Ausflug heraus! Es können bis zu 4 Personen einen Song singen.
In der Vorbereitungsphase vor der Challenge haben wir uns auf der Seite startbootstrap.com eine passende Vorlage für unsere Konzeptseite herausgesucht und grob ein Konzept überlegt, wie die Dokumentationsseite aussehen soll. Zudem wurde angefangen diese Vorlage gering zu bearbeiten. Bei dem Produktprototype wurde vor der Challenge an der Textscrollanimation gearbeitet, wobei auch einige Versuche unternommen wurden, Javascript einzubinden.
Für die Texte zur Karaoke wurde eine Lyricdatenbanken API herausgesucht.
Die Gruppe hat in der Vorberitungsphase ebenfalls festgelegt, wer bei der Challenge welche Aufgaben übernimmt.
Demnach haben sich Sebastian und Arthur um den Prototypen der Caraoke und Caroline und Viktoria um die Konzeptseite gekümmert.
Am Challengetag hat sich...
... Sebastian mit dem Lyricsbereich der Caraoke und der damit verbundenen Animation beschäftigt. Zudem hat er den Playbutton und den Titel Select Bereich geschrieben und entworfen.
... Arthur mit der Musixmatch API Implementierung, Progress Bar-Animation und dem Musikspieler Controls beschäftigt.
... Caroline mit den Hintergrundbildern und dem Mittelteil der Konzeptseite beschäftigt
... Viktoria mit der Gestaltung des Footers und des Headers der Konzeptseite sowie dem Dokumentationsteil beschäftigt.
Es wurden folgende Frameworks, Templates, größere Code Snippets oder sonstige Quellen verwendet
Für die Dokumentationsseite :
Framework: https://startbootstrap.com/template-overviews/creative/
(https://blackrockdigital.github.io
/startbootstrap-creative/);
Für den Caraoke-Prototype :
Musicplayer Icons: flaticon.com
upward_arrow: designed by freepik
search_icon: designed by Smashicons
previous_track: designed by Hanan
next_track: designed by Hanan
play_button: designed by Hanan
pause_button: designed by Hanan
Eine Schwierigkeit bestand darin, die Lyricdatenbanken API zu laufen zu bekommen. Es wurde sich aufgrund von zu hohem Zeitaufwand dazu entschieden, die API wegzulassen. Was aufgrund von zeitlichen Problemen zur Schwierigkeit wurde, ist die Gestaltung des Dokumentationsbereichs auf der Konzeptseite. Dort sollten zudem noch Tabellen eingefügt werden, die sich während der Challenge ebenfalls als Problem darstellten. Eine weitere Schwierigkeit, die selbst mit Beratung der Betreuer nicht lösbar gewesen ist, war die Pausierung bei CSS-Transition für den Prototype.
Avarices ist eine fiktive Agentur im Rahmen eines Projektes des Fachs WBA 1 (Web-basierte Anwendung 1) an der Technischen Hochschule Köln. Bei dieser Seite handelt es sich ebenfalls um eine nicht reale Seite und eine fiktive Anwendung für die Marke Tesla.
07.12.2017
Sebastian Faust, Arthur Tissen, Caroline Jungjohann & Viktoria Müller
