Vintage Effekte für Photos mittels jQuery

Screenshot der Vintage.js Homepage

Ich steh ja auf diese Vintage-Effekte für Photos, und insbesondere auf die ganzen Instagram-Filter die es so gibt. Früher war es ja so, dass man diese zwar auch auf Bildern einer Webseite anwenden konnte, aber in der Regel ging das nur mit PHP. Heutzutage gibt es HTML5 und insbesondere das Canvas-Element. Was liegt also näher als ein Bild in ein Canvas zu kopieren, und dort zu manipulieren?

Screenshot der Vintage.js Homepage

Das jQuery-Plugin vintageJS macht exakt dies: Bild in Canvas kopieren, manipulieren und fertig ist der Vintage-Effekt. Darüber hinaus kann es auch nach Sepia, grün und rot färben und dem Bild somit auch einen „alten Anstrich“ verpassen. Die Verwendung das HTML-Canvas-Elements hat natürlich entscheidende Vorteile: auf dem Server befindet sich das unveränderte Original-Bild und die Last zum Filtern des Bildes liegt beim Client. Jegliche Form von Image-Caching auf dem Server entfällt. Habe ich keine Lust mehr auf Vintage schalte ich das Plugin eben wieder ab und habe meine Originale wieder – oder einen gänzlich anderen Effekt.

Die Anforderungen der Frontend-Enwicklung haben sich in den letzten Monaten drastisch geändert. Die Entwicklung ist weg von PHP (und dem Server) in Richtung JavaScript (und dem Client) gegangen – eine Entwicklung die leider noch nicht überall angekommen ist.

Ähnliche Beiträge

jQuery.payment: Kreditkarten-Validierung Inzwischen dürfte es sich auch bis in die hintersten Ecken herum gesprochen haben, das man Kreditkarten nicht mit Regular Expressions beikommen kann. ...
Bacon.js – Bezier-Kurven für Texte Das Leben eines Webworkers ist nicht einfach, vor allem dann wenn man einem Kunden erklären muss, dass ein Bild mit Transparenz - auch wenn es dreimal...
Lettering.js für jQuery Ich fürchte die Sache mit den Webfonts ist noch lange nicht ausgestanden, zum einen kämpft man ständig mit Unstyled Content, zum anderen können die Br...
Ninja User Interface – Schicke Widgets für jQuery... Alleine schon wegen dem Namen „jQuery Webjutsu“ ist die Ninja UI erwähnenswert. Es sollte sich inzwischen bis in die hintersten Ecken herumgesprochen ...

Schreibe einen Kommentar