To explore its relevance for defining some sort of standardized UI for identity interactions, I mocked up just such an interface (flash).
In principle, both UI components and sequencing could be standardized.
FWIW, the code for the above mock-up is:
<canvas>
<view y ="30" >
<simplelayout axis="x" spacing="5"/>
<view id="cart" bgcolor="#666699"
height="250" width="125">
<text fgcolor="#FFFFFF"
x="5" y="5" >Available Identities</text>
</view>
<view id="wish" bgcolor="#666699"
height="100" width="125">
<text fgcolor="#FFFFFF"
x="5" y="5" >Chosen Identity</text>
</view>
</view>
<view x="${cart.x+10}" y="${cart.y+55}"
resource="blast.jpg"
onmousedown="dragging.apply()"
onmouseup="dragging.remove();">
<dragstate name="dragging"/>
<method name="stop">
if (this.x>wish.x) {
this.animate("x", wish.x+10, 300);
this.animate("y", wish.y+55, 300);
} else {
this.animate("x", cart.x+10, 300);
this.animate("y", cart.y+55, 300);
}
</method>
</view>
<view x="${cart.x+10}" y="${cart.y+125}"
resource="choo.jpg"
onmousedown="dragging.apply()"
onmouseup="dragging.remove();">
<dragstate name="dragging"/>
<method name="stop">
if (this.x>wish.x) {
this.animate("x", wish.x+10, 300);
this.animate("y", wish.y+55, 300);
} else {
this.animate("x", cart.x+10, 300);
this.animate("y", cart.y+55, 300);
}
</method>
</view>
<view x="${cart.x+10}" y="${cart.y+195}"
resource="astro.jpg"
onmousedown="dragging.apply()"
onmouseup="dragging.remove();">
<dragstate name="dragging"/>
<method name="stop">
if (this.x>wish.x) {
this.animate("x", wish.x+10, 300);
this.animate("y", wish.y+55, 300);
} else {
this.animate("x", cart.x+10, 300);
this.animate("y", cart.y+55, 300);
}
</method>
</view>
<text x="5" y="5">
Drag chosen identity to
</text>
<button x="160" y="150">Select</button>
</canvas>
2 comments:
I click on the link for the Flash demo and get a redirect, but, unfortunately, the target server doesn't seem to exist :-(
I've donated 88k of my Sun blogspace to the cause - Get your lovely demo here
:-)
Post a Comment