IFD:WebApps/Felix Trojan: Difference between revisions

From Medien Wiki
No edit summary
No edit summary
Line 39: Line 39:
===Carpet und Interaktion===
===Carpet und Interaktion===


[[Image:Fc_carpet.png]]
[[Image:Fc_carpet.png|600px|]]


Der Nutzer kann den direkten Aufbau des Carpets(je nach Internetverbindung nun miterleben). Sollten die Login-Daten nicht korrekt sein, wird der Nutzer darauf hingewiesen, sind in der Liste aber korrekte Daten neben inkorrekten enthalten werden die korrekten trotzdem verarbeitet und angezeigt. Nach dem Aufbau stehen dem Nutzer einige Interaktionsmöglichkeiten zur Verfügung. Bei einem Mouseover über ein Profilbild erhält er zusätzliche Information zur Person(Name, Netzwerk, Account unter dem er gefunden wurde). Bei einen Klick auf ein Pofilbild wird die entsprechende Profilseite des zugehörigen Netzwerkes in einer neuen Browserseite bzw. Tab aufgerufen. Weiterhin ist es möglich die Größe der Profilbilder zu ändern. Die Profilbilder werden auf ein bestimmtes Format "zugeschnitten", was manchmal dazu führt, dass man nicht das komplette Bild sieht, deshalb gibt es die Option das originale Bildverhältnis für alle Bilder anzuzeigen. Weiterhin gibt es ein Suchfeld, welches die Bilder während der Eingabe filtern kann. Der Teppich reduziert sich auf die Profilnamen die Teile der Eingabe enthalten.
Der Nutzer kann den direkten Aufbau des Carpets(je nach Internetverbindung nun miterleben). Sollten die Login-Daten nicht korrekt sein, wird der Nutzer darauf hingewiesen, sind in der Liste aber korrekte Daten neben inkorrekten enthalten werden die korrekten trotzdem verarbeitet und angezeigt. Nach dem Aufbau stehen dem Nutzer einige Interaktionsmöglichkeiten zur Verfügung. Bei einem Mouseover über ein Profilbild erhält er zusätzliche Information zur Person(Name, Netzwerk, Account unter dem er gefunden wurde). Bei einen Klick auf ein Pofilbild wird die entsprechende Profilseite des zugehörigen Netzwerkes in einer neuen Browserseite bzw. Tab aufgerufen. Weiterhin ist es möglich die Größe der Profilbilder zu ändern. Die Profilbilder werden auf ein bestimmtes Format "zugeschnitten", was manchmal dazu führt, dass man nicht das komplette Bild sieht, deshalb gibt es die Option das originale Bildverhältnis für alle Bilder anzuzeigen. Weiterhin gibt es ein Suchfeld, welches die Bilder während der Eingabe filtern kann. Der Teppich reduziert sich auf die Profilnamen die Teile der Eingabe enthalten.

Revision as of 11:55, 17 April 2011

Friend Carpet

Fc logo.png

Idee und Motivation

Social Networks erfreuen sich immer größerer Beliebtheit. Je nach Region, Hobbies, Popularität, Beruf oder Karriere kann man das für sich passende Netzwerk auswählen. Dabei komm es häufig vor, dass Freunde oder Bekannte andere Netzwerke bevorzugen als man selbst, was oft dazu führt das man in mehreren Social Networks anmeldet und nicht überall die selben Freunde hat. Bei der Webanwendung "Friend Carpet" geht es zum einen darum eine Brücke zwischen diesen verschiedenen Netzwerken zu schlagen, indem ein virtueller Teppich dessen Flicken Bilder von Freunden aus Netzwerken verschiedener Accounts bestehen. Zum anderen geht es um eine andere Art seine Freundeskreis zu betrachten und spielerisch zu entdecken.

Aufbau

Der Grundlegende Ablauf:

  1. Login Daten für 1-n Accounts in 1-m Netzwerken abfragen
    1. es können sich auch mehrere Accounts im selben Netzwerk befinden
  2. einen Account auswählen und dessen Freunde crawlen
  3. für jeden ermittelten Freund Profil-Link und Profilbild URL extrahieren
    1. eventuell Qualität der Bilder anpassen
  4. Div-Container mit Bild,Link und sonstigen Informationen generieren und ausgeben
  5. 1-4 solange wiederholen bis alle Accounts abgearbeitet sind

Technologien

  • HTML4.1
  • PHP (crawlen der Netzwerke und generieren des Teppichs)
  • JavaScript (auf Usereingaben zu reagieren)
  • Lampp (Apache Webserver mit PHP)
  • phpThumb (PHP Library zur Bildmanipulation)
  • cURL Unterstützung für PHP(umfangreiche HTTP Anfragen zum crawlen + CookieJar)

Login

Fc login form.png

Der Nutzer wird begrüßt mit dem "Friend Carpet"-Logo und einer Login Box. Dort kann er für ein bestimmtes Netzwerk(im momment Facebook oder StudiVZ) seine Login-Daten eingeben und per "add"-Button in eine Liste einfügen. Dies kann beliebig oft wiederholt werden um mehrere Accounts und Netzwerke in die Erstellung des Teppichs einfließen zu lassen. Ist der Nutzer zufrieden mit der Zusammenstellung kann er mit "Create Carpet" seinen persöhnlich Teppich erstellen lassen.

Carpet und Interaktion

Fc carpet.png

Der Nutzer kann den direkten Aufbau des Carpets(je nach Internetverbindung nun miterleben). Sollten die Login-Daten nicht korrekt sein, wird der Nutzer darauf hingewiesen, sind in der Liste aber korrekte Daten neben inkorrekten enthalten werden die korrekten trotzdem verarbeitet und angezeigt. Nach dem Aufbau stehen dem Nutzer einige Interaktionsmöglichkeiten zur Verfügung. Bei einem Mouseover über ein Profilbild erhält er zusätzliche Information zur Person(Name, Netzwerk, Account unter dem er gefunden wurde). Bei einen Klick auf ein Pofilbild wird die entsprechende Profilseite des zugehörigen Netzwerkes in einer neuen Browserseite bzw. Tab aufgerufen. Weiterhin ist es möglich die Größe der Profilbilder zu ändern. Die Profilbilder werden auf ein bestimmtes Format "zugeschnitten", was manchmal dazu führt, dass man nicht das komplette Bild sieht, deshalb gibt es die Option das originale Bildverhältnis für alle Bilder anzuzeigen. Weiterhin gibt es ein Suchfeld, welches die Bilder während der Eingabe filtern kann. Der Teppich reduziert sich auf die Profilnamen die Teile der Eingabe enthalten.

Friend Carptet auf mobilen Geräten

Erfahrungen und Fazit

Anhang: Crawling Magic