Es ist mittlerweile schon über ein Jahr her, dass wir uns zu Viert aufmachten, russische Züge und tibetische Höhenpässe zu erkunden. Trotzdem hab ich mich nochmal daran gemacht, die Website komplett zu überarbeiten. Brotlose Kunst in Reinform.

Im Endeffekt störte mich an der alten Version die Geschwindigkeit und der fehlende Zusammenhang zwischen einzelnen Bildern.

Um die Geschwindigkeit zu verbessern, verabschiedete ich mich zunächst von meinem guten Bekannten WordPress und setzte voll und ganz auf CodeIgniter. Nicht nur weil ich dieses Framework während meiner Diplomarbeit schon verwendet hatte, sondern auch um die geplanten Änderungsmaßnahmen wesentlich einfacher durchführen zu können. Auf der anderen Seite hieß das aber auch, dass die Seitenstruktur komplett neu erarbeitet werden musste. Ergo ging viel Zeit flöten.

Der Zusammenhang der Bilder sollte über Farbwerte und Stichworte hergestellt werden.

Farben

Das mit den Farben war schwieriger als zunächst angedacht. Allein die RGB-Farbwerte auszulesen war mich nicht genug, sondern es musste der HSV-Farbraum werden. Nein, nichts mit Fussball. H = Farbton ( 0° – 360°), S=Farbsättigung und V=Hell/Dunkel (grobgesagt). Mit diesen Werten war es für mich einfacher einzelne Bilder zu vergleichen. Außerdem war der Farbregler besser zu gestalten. Für das Auslesen der Farbwerte war der Eintrag von Mikko (Color Analysis) sehr hilfreich.

Im Endeffekt kam in die Datenbank ein Red, Green, Blue, Hue, Saturation, Value und Websafe Wert. Zu jedem Bild 10 Werte auslesen lassen, bis der Rechner qualmte. Machte am Schluss 24,221 Farben (bei 2,551 Bildern … ja genau, doppelte Werte sind rausgeflogen).
Für die Farbauswahl musste natürlich ein selbst gebastelter Farbwähler her.
Beispiele:

R(100)G(50)B(250)R(23)G(10)B(100)R(227)G(57)B(4)R(98)G(179)B(89)

Stichworte

Das Filtern der Bilder sollte außerdem mit Hilfe von Stichworten erleichtert werden. Anders als bei den Farbwerten war das Setzen der Stichworte hier ein nicht zu unterschätzender Arbeitsschritt . 😉 Allerdings war diese Aufgabe mit Hilfe von Adobe Bridge relativ einfach durchzuführen.

Danach konnten die zugewiesenen Stichworte, die als Metadaten an die Bilder angehängt wurden, ausgelesen werden (Sprich PHP liest EXIF). Ich häts mir sicher auch einfacher machen können, aber naja … Die Außwahl an sich, sollte dem Benutzer außerdem den Zusammenhang zwischen den Stichworten darstellen. Am besten anschauen, dann wirds deutlicher:

Beispiele:

• Mongolei
• Mongolei + Stefan
• Stefan + Tibet
• Stefan + Tibet + Yardrog Yutsho
• Tibet + Yardrog Yutsho + Evelyn
• usw.

Von der Funktionalität her, sind das die zwei wesentlichen Neuerungen, die die Website aufzuweisen hat. Neben dem vermehrten Einsatz von AJAX (siehe das Tagebuch oder eine Einzelbildseite), graphischen Überarbeitungen, Auslesen der Geokoordinaten der Bilder, Darstellung der Reiseroute, Firlefanz wie Ausblenden einzelner Seitenblöcke …

Nachdem die Seite online zu begutachten ist, werden hier keine weiteren Screenshots folgen.

»Quer durch Asien

Eingesetzte Technik (u.a.):

• CodeIgniter (1.7.2)
• jQuery (1.4.2)

Einen interessanten Artikel gibt es bei Joshua Porter zu lesen. Er vergleicht die beiden social network Seiten facebook und twitter miteinander und kommt zu dem Schluss, dass facebook wohl langfristig das gleiche „Beziehungssystem“ wie twitter verwenden wird. Einfacher Grund: Innerhalb von facebook gibt es nur die Möglichkeit „friend and Not Friend“ zu sein. Bei twitter dagegen kann man die Nachrichten von anderen Leuten verfolgen ohne diese zu kennen bzw. befreundet zu sein. Das führt dazu, dass man bei twitter mehr „Verbindungen“ besitzt, als bei facebook. Mehr Verbindungen, mehr Nutzer .. usw.
Wird spannend wie sich facebook entwickelt.
Link:Relationship Symmetry in Social Networks: Why Facebook will go Fully Asymmetric

Mein Firebug hat Zuwachs bekommen. Er wurde erweitert durch FirePHP. Ein wirklich nützliches Plugin für Firefox, das das Debuggen für PHP wirklich vereinfacht. Kein var_dump o.ä. mehr. Einfach in der Console des Firebugs ausgeben und fertig. Tutorials und Einbau gibts auf folgenden Seiten:

• Firebug Extension for AJAX Development
• Quickstart FirePHP
  Vor allem ist hier beschrieben, wie das Output Buffering aktiviert wird
• FirePHP erleichtert die PHP-Entwicklung
• Speziell fürs Zend Framework: FirePHP and Zend Framework 1.6