Axure und Scriptaculous

Mein Kollege Thomas Piribauer von Frequentis hat letzte Woche Möglichkeiten ausprobiert unser neues Prototyping Tool Axure mit Scriptaculous zu kombinieren. Grund dafür sind die derzeit noch fehlenden Möglichkeiten von Drag and Drop, die von Axure noch nicht unterstützt werden.

Der Lösungsansatz wird in der folgenden Skizze kurz beschrieben und läuft folgendermaßen ab. Basis des ganzen bildet natürlich die Axure Umgebung. Thomas hat über den Bereich der Drag and Drop unterstützen soll, einen Inline-Frame gelegt und diesen mit einer externen HTML Seite verknüpft, die (bingo!) die scritpaculous Libraries verwendet.

axure.png

externehtmlseitemitscriptaculous.png

Nun wurde noch der Hinergrund des Inline-Frames transparent gemacht und die Drag and Drop Objekte richtig (absolut) über der Axure Seite positioniert. Womit wir eine fast perfekte Drag and Drop Operation simulieren können.

kombination.png

draganddrop.png
Der Nachteil hierbei ist natürlich, dass die externe HTML-Seite und Axure nicht miteinander kombiniert werden können und man somit diese Objekte auch nicht im Prototypen weiterverwenden kann.

Aber bis Axure selber Drag and Drop anbietet ist dies eine absolut pipifeine Möglichkeit um Drag and Drop Verhalten mit Benutzern testen zu können. Und darum geht es hier in erster Linie.

Was sind eure Erfahrungen mit Drag and Drop Prototypen.
Verwendet jemand von euch z.b. die prototype.js Library intensiver?

Schön’ Gruß,
Erhard

Published by

Erhard Wimmer

Master of Desaster

3 thoughts on “Axure und Scriptaculous”

  1. > Aber ich ferstehe es noch nicht

    Ja, ehrlich gesagt, dachte ich mir das schon 🙂
    Ich hatte eh vor, ein Beispiel zu bringen. Das Problem ist, dass ich das Kundenprojekt erst für die Öffentlichkeit adaptieren muss, da das natürlich alles “streng geheim” ist 😉

    Gimme some time, ich meld mich wieder sobald ich es hab.

  2. beim test mit IE 6 und IE 7 is mir aufgefallen, dass die von erhard beschriebene lösung dort nicht funktioniert, da der IE die iframes, in denen die scriptaculous files angezeigt werden, per default nicht transparent darstellt (trotz entsprechender CSS deklaration fuer den BODY des scriptaculous files).

    direkte abhilfe schafft nur ein eingreifen in den von axure generierten html source code und dem hinzufügen des attributs ‘allowtransparency=yes’ zum entsprechenden iframe.

    cheers, thomas.

Comments are closed.