Kategorie: Studium

Initialprojekt: Portfolio

Im Wintersemester 2014 sollten wir für die Masterklasse „Mobiles Internet“ eine kleine mobile Webapplikation unter dem Motto „Print – To – Mobile“ umsetzten. Ziel dieses Projekts war es, möglichst viele Personen über ein Printprodukt, und ohne Eintippen einer URL, zur mobilen Applikation zu führen.

Ich habe dieses Projekt genutzt, um mich selbst zu präsentieren. Ich habe als Printprodukt Visitenkarten erstellt, auf denen mein Name, mein Berufsfeld und ein QR-Code abgebildet sind. Beim Scannen des QR-Codes gelangt man auf mein Portfolio.

Design

Es wurden drei Farben verwendet. Weiß (#000000) für den Hintergrund, ein etwas helleres Schwarz (#323232) für Text und ein heller Blauton (#00AEEF) für Überschriften.

Fonts wurden Gotham und Arimo ausgewählt. Gotham wurde in zwei verschiedenen Ausführungen für die Visitenkarten verwendet. Der Name wurde in Gotham Bold und Developer in Gotham Rounded Light geschrieben, beides in Versalien. Für die Website wurde die GoogleFont Arimo verwendet.

farbenFonts_klein

Visitenkarte

Die verschiedensten Logos und Layouts der Visitenkarte wurden zuerst auf einem Zettel Skizziert. Die finale Version des Logos wurde in Photoshop umgesetzt. Die Visitenkarten wurden in InDesign erstellt und das Logo von Photoshop importiert. Der QR-Code wurde auf die Rückseite der Visitenkarte platziert. Beim QR-Code handelt es sich um einen dynamischen QR-Code damit die Ziel-URL später verändert werden kann.

Die Visitenkarten wurden möglichst einfach gehalten um Personen neugierig zu machen und sie dazu zu verleiten auf die Website zu schauen.

Die Visitenkarten wurden in einer professionellen Druckerei gedruckt.

businesscard

Website

Die Website wurde mithilfe von HTML, CSS und dem Plugin jQuery Fullpage erstellt. Die Bilder die auf der Seite angezeigt werden, wurden mit Photoshop erstellt. Dafür wurden Screenshots gemacht und diese dann in Mockups eingefügt. Für Logos wurden hauptsächlich SVGs verwendet. Die Website selber wurde sehr clean gehalten und responsive erstellt um sie auf mobilen Devices gut anzeigen zu können.

Um die Seite responive zu halten wurde mit Media Querys gearbeitet. Dabei wurde auf Screens über und unter 480px Breite eingegangen.

Webs-Screens-Presentation-Mock-up

Fazit

Bei der Erstellung der Visitenkarten und meines ersten Portfolios habe ich viele Erfahrungen gesammelt. Zum Beispiel, dass die Schriftgröße und die Schriftfarbe die ich für das Wort ‚Developer’ auf der Visitenkarte verwendet habe, schlecht lesbar ist.

Auch die Anordnung der Bilder auf Desktop PCs und Tablets ist noch nicht perfekt. Ich wurde darauf aufmerksam gemacht, dass die Schriftgröße bei der mobilen Version nicht gut lesbar sei und auf manchen mobilen Geräten das Bild die Schrift überdeckt.

Da das Portfolio nicht ganz fertig ist, wird daran weiter gearbeitet.

Link zu meinem Portfolio

logo
Datum: Samstag, 25.10.2014
Kategorien: Allgemein, Projekte
 

Initialprojekt: Happy Stomach

Idee

Als Initialprojekt für den Masterstudiengang Mobiles Internet, sollten wir eine mobile Webapplikation umsetzen. Ziel dieser Applikation war es möglichst viele Leute zu motivieren ohne Eintippen einer URL diese aufzurufen. Da ich sehr gerne koche und mich durch meine Fruktoseintoleranz schon sehr viel mit Nahrungsmittelunverträglichkeiten auseinandergesetzt habe, wollte ich eine responsive Website erstellen, die viele Rezepte für Menschen mit Nahrungsmittelunverträglichkeiten beinhaltet. Mit dem Menü kann ich die Rezepte nach Fruktose oder Laktose-Intoleranz filtern. Weiterlesen…

mobawn_logo_beitragsbild
Datum: Dienstag, 21.10.2014
Kategorien: Projekte, Studium
 

Usertesting einer Webapp

Während der Entwicklung von Herculess führen wir laufend kleinere Usabilitytests durch um herauszufinden ob die Abläufe und die User Interface Elemente verstanden werden. Dabei ist uns wichtig, dass die getesteten Personen nicht immer dieselben sind, sondern sie die Webapp zum ersten Mal benutzen. Dabei geben wir den Testern eine kurze Beschreibung des Projekts und starten dann gleich los.

Weiterlesen…

 

codefront.io

Acht Studierende der Masterklasse Mobiles Internet des Studiengangs Digitale Medientechnologien besuchten gemeinsam mit Grischa Schmiedl und Kerstin Blumenstein am 10. Mai 2014 die Front-End Developement Konferenz codefront.io. In der nicht weit von St. Pölten entfernten Johannes Kepler Universität in Linz fanden den ganzen Tag parallel in vier Hörsälen Vorträge zu verschiedensten Themen statt.

Weiterlesen…

 

Erstellen eines dynamischen Styleguides mit KSS

KSS – was?

Wie schon in einigen vorigen Blogbeiträgen berichtet, arbeiten wir an einem Projektmanagementtool names Herculess. Da das Projekt Mobile First konzipiert wurde, aber immer weiter wächst, war von Anfang an klar, dass wir in irgend einer Form einen Styleguide benötigen. Zuerst war der Ansatz da, dass ich händisch von Scratch einen eigenen Styleguide baue. Weiterlesen…

kss
Datum: Freitag, 04.04.2014
Autor:
Tags: , , , ,
 

Android Ball Maze

Im Wintersemester 2013 beschäftigte ich mich mit der Verbindung zwischen Android Smartphone und Arduino Mikroprozessor um damit ein Kugellabyrinth zu steuern. Mein Ziel war es, die Daten des Accelerometer-Sensors auszulesen und somit durch Kippen und Neigen des Smartphones das Holzlabyrinth mittels zwei Motoren zu bewegen.
Weiterlesen…

AndroidBallMaze
Datum: Sonntag, 30.03.2014
 

Bluetooth LE Presence Awareness mit iOS und Raspberry Pi

Aus der mehrfachen Beschäftigung mit Bluetooth Low Energy und iOS im Laufe dieses Semesters gepaart mit meinem Interesse für Intelligente Hausautomation entstand die Idee das Smartphone und die BLE-Technologie zur Anwesenheitserkennung zu verwenden. Das Smartphone hat man ja meistens mit eingesteckt, eignet sich daher ja bestens für diese Aufgabe. Seit iOS7 ist es ja möglich, dass Apps auch im Hintergrund BLE-Komunikation betreiben. Weiterlesen…

 
12345...7