Photoshop mit Javascript

Zu sagen man kennt Photoshop nicht wäre als wenn ein Eisverkäufer mit der Gabel die Waffeln füllt. Erstaunlicherweise ist es aber so, dass nicht ein Browser oder halbwegs intelligente Programmiersprache etwas mit den PSD-Dateien anzufangen weiß. Das bringt einige Probleme mit sich wenn man zum Beispiel eine Bilddatenbank programmieren will, und automatisch Thumbnails erstellen lassen möchte.

Screenshot von psd.js

Lustigerweise gibt es (oder besser gesagt soll es geben) einen Parser für PSD in Javascript. Das Projekt psd.js kann schon die grundlegenden Informationen aus einer PSD-Datei heraus holen. Gehostet wird natürlich (wie sollte es anders sein) auf GitHub. Der Source ist in Coffeescript und sieht recht sauber aus, Ebenen werden bereits erkannt, der Quelltext ist auch recht intuitiv:

{PSD} = require 'psd'
 
psd = PSD.fromFile './path/to/file.psd'
psd.parse()
 
for layer in psd.layers
console.log "Layer: #{layer.name}"
console.log "Size: width=#{layer.cols}, height=#{layer.rows}"
console.log "Position: top=#{layer.top}, left=#{layer.left}"
 
psd.toFile "/path/to/output.png"

Was die Library kann (oder können soll) ist folgendes:

  • Eine PSD als PNG ausgeben
  • Eine PSD als Canvas ausgeben
  • Einzelne Ebene extrahieren und anzeigen
  • Informationen über das Bild und/oder Ebenen bereitstellen

Ein recht ambitioniertes Projekt wie ich finde, und keins das jemals fertig werden wird. Man kann sich mal mit Notepad eine PSD anschauen und wird schnell merken, so einfach ist das alles nicht. Ich bin mir sicher das es immer wieder die eine oder andere PSD-Datei geben wird, die das Skript nicht interpretieren kann. Aber sowohl Idee als auch Umsetzung sind genial, und vor allem: man kann das echt brauchen. Man darf also abwarten wie sich das Projekt weiter entwickelt, aber immerhin bekommt man jetzt die Möglichkeit PSD eventuell mal direkt anzuzeigen anstatt händisch wilde Konvertierungs-Orgien durchzuführen.

Ähnliche Beiträge

jwerty – JavaScript Keyboard Events vom Fein... Keyboard Events in Javascript sind in Backends das vielleicht am meisten unterschätze Feature! Wenn man mal ehrlich ist: man benutzt die Tastatur kaum...
HTML5 Audio mit Buzz HTML5 Audio ist ein nerviges kleines Biest! Das liegt nicht an der Umsetzung, sondern daran das jeder Browser sein eigenes Süppchen hinsichtlich Codec...
Plugins für jQuery Ich sehe und übernehme einiges an Seiten und muss leider sagen, dass scheinbar bei Javascript-Programmierung vor Beginn der Arbeiten das Hirn einmal r...
Syntax Highlighting in Javascript Syntax Highlighting ist – als Blogbetreiber – eine recht anstrengende Sache. Zunächst einmal muss man WordPress erklären, dass es bitte schön die Fing...

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.