DecoBox Widget for Axure

axure-decobox

I developed this widget for the Web App UI at my full time job. Since most of the applications we build are data heavy I had to come up with a way to allow separation of different data types and page functionality while making viewing of the data easy with minimal scrolling.

I basically combined a box container with the drawer metaphor. I call it the DecoBox.

It can be as simple as just a display box with a title bar or as complex as a collapsible/expandable drawer action with a toolbar that has it’s own sliding trays for, wel… whatever you want.

I can say it’s been a huge success where I work. The users love that they can get things out of their way, but still have it handy with a single mouse click. The developers like having the sliding tray for forms and AJAX calls. It’s been a very flexible and intuitive UI element.

So I’ve taken the time to document it pretty thoroughly in the .rp file and make it a Custom Widget. I now offer it out to the Axure community at large.

It’s in grayscale since wireframes should be so IMHO. The width can easily be adjusted to fit your needs.

So… enjoy! If you have any questions feel free to ask @iconic_arts on Twitter or post a comment here.

Demo

Download the 5.5 .rp file

Advertisements

5 Responses

  1. Dude… I just saw this. I’ve gotta tell you man, I L-O-V-E it! Niftay! Way to go.

  2. Hi Scott,

    I love to try this out but the download link is not working atm.

    Grtz,
    BParty

  3. Great little widget. I’ll be using heaps in my new cms designs.

    Big Huzzah to you sirs!
    T

  4. Thank you so much for creating this. Would you mind telling me how best to import this into a project? Since it’s a .rp file and not a .rplib file, this can’t be loaded into the library.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s

%d bloggers like this: