Skinnen mit Illustrator CS3

Ich skinne read more at nun schon seit geraumer Zeit Flexkomponenten mit Illustrator CS3. Dabei bin ich über einige Lösungen/Probleme gestolpert. Bei letzterem habe ich mich mehr als nur einmal gefragt ob ich der einzige Mensch auf Erden bin der diese Art von Problem hat.

Also, um auf dem neuesten Stand zu bleiben solltet Ihr euch die Flex Extension für Illustrator downloaden und installieren. Diese bekommt Ihr bei Adobe. Da ist dann auch alles beschrieben wir Ihr darauf zugreifen könnt. Ich werde es trotzdem kurz beschreiben.

Nachdem die Extension installiert wurden taucht unter Datei >> Skripten >> „Create Flex Skin“ auf. Hier kann zwischen specific (einzelne Komponenten) und multiple (gesamtes Template) gewählt werden. Im Normalfall werdet ihr euch für multiple entscheiden, hier könnt ihr den gesamten look eures Designs umsetzen.

Allerdings gibt es einige Dinge die beachtet werden sollten.

  • Das neu herausgegebene Template von Adobe hat gegenüber seiner Vorgängerversion von Flex 2 einige Macken. Das Panel z.B. sollte möglichst umgangen werden, da es selbst bei völlig unverändertem Zustand nicht richtig dargestellt wird (Abstände und Buttons sind hier das Hauptproblem).
  • Bei den Scrollbars sollte penibelst darauf geachtet werden nicht ausversehen die Bounds (wie ich Sie nenne) zu verändern oder gar zu löschen. Es handelt sich um die unsichtbaren Rahmen die um die thumbs der Scollbar herum sind (HScrollBar_thumbIcon, HScrollBar_thumbDownSkin, HScrollBar_thumbUpSkin usw…).
  • Ich setze meine Screendesigns immer zuerst in Photoshop auf, dort lassen sich einfach bessere Effekte erzielen. Nach fertigstellung des Designs müssen die Komponenten aber in Illustrator reproduziert werden. Einige Effekte lassen sich in Illustrator allerdings nicht nachstellen und somit bleibt nichts anderes übrig als Bitmap Grafiken in das Template zu integrieren. Hier habe ich festgestellt das Scale-9 nicht sonderlich gut bei der vertikalen skalierung arbeitet. Das Problem ist allerdings schnell behoben wenn Ihr ein in Illustrator erstelltes Vektorobjekt dahinter legt. Danach müsste die Skalierung wieder tadellos funktionieren.
  • Transparenzeffekte wie z.B. Abdunkeln oder Multiplizieren werden nach meiner Feststellung zum größten Teil beim Export verworfen, anstatt des Effektes wird einfach die eingestellte Transparenz dargestellt. Also nicht erst mal bei dem ganzen Template Effekte anwenden, sondern zwischendurch immer wieder mal testen.

Es gibt sicher noch weitere Dinge die mir momentan nicht einfallen. Einfach ab und an bei labs.zeroseven.de vorbeischauen, ich werde das Thema sicher immer weiter ausbauen.