September 29, 2008
45 Comments

Axure Design Pattern Library v2.0

This is Version 2 of the first Axure stencil library.

Demo the HTML OR  Download the Axure (.rp) File


What’s new in this version?

I’ve gone a little nuts with some of these.  There are a few new techniques, described in my last post about Click and Drag simulation, as well as some simpler but useful widgets.

  • AJAX Field Validation
  • Carousel
  • Carousel with simulated “Click and Drag”
  • Field Validation
  • Hover Tip
  • iPod Menu
  • Map
  • Map with simulated “Click and Drag”
  • Progress Bar
  • Self-Healing Delete from List
  • Tabs Left

The “Click and Drag” widgets are still a bit rough around the edges, so I’ve marked them “beta” and recommend against using them for user testing.

What if I want to add something to this library?

People have contacted me interested in contributing to the library, and I think that’s a great idea.  Until a site gets set up where users can upload their own, the current method for submitting designs to this template is to e-mail me at: loren at acleandesign dot com.   I’ll be happy include well-polished masters and to credit the author.  It’s not a permanent solution, but I don’t have time to create a full community site.

  • Pingback: estetika » Blog Archive » links for 2008-10-08 | portfolio of interaction, art and stuff

  • http://www.kazenda.nl Yvonne

    Great library, thank you!

  • Pingback: The Top 10 Axure Resources | A Clean Design

  • Abid

    This is brilliant! For me, the lack of an Axure library was the software’s biggest disadvantage. Thanks for producing this.

  • MH

    I’m very new to Axure(moving from OSX to have a propper prototyping tool) – how do I install this brilliant library?

    The lack of a “widget library” is frustrating compared to Omnigraffle fx.

  • http://acleandesign.com Loren

    The library is an .rp file – all you should have to do is open it with Axure. Alternatively, you can go to “File > Import from .rp File”, select the library and take whichever masters you need.

    If you’re having trouble downloading, try using Firefox. Some other browsers have trouble with the download.

  • http://infofoundry.net Ezra

    Great Library! Thank you – kudos

  • Pingback: mokarzel.com » Biblioteca para o Axure

  • http://www.usabilitylab.co.uk Frankie

    This is absolutely brilliant! Thanks for taking the time to develop the library and for sharing it with everyone.

  • Pingback: Best Usability Mockup Tools | Scott Savage’s Blog

  • http://www.axure.org axure.org

  • Pingback: Tanek » Blog Archive » Présentation d’Axure - Outil de prototypage

  • Jonathan

    Erk! This library is under a CC BY-NC-SA license!

    This means you can’t distribute derivative works based from it and make money from that. It’s in the nature of a pattern library that you can make derivative works from it. A BY-NC-SA restriction means very few people can legitimately this unless they were working in and for non-profit organisations.

    Is there a reason why this isn’t under simply a BY license?

  • http://acleandesign.com Loren

    @Jonathan Because, being inexperienced with copyright law, I poked around creative commons and used one that looked reasonable without fully understanding the implications! Thank you for pointing that out – I’ll be sure to update the license ASAP.

  • Jonathan

    That’s OK Loren – and apologies for my ranting (and typos)!

    This does illustrate a potential problem with CC licensing though: it’s deceptively simple. For example, I think your use of the “share-alike” restriction would mean that any derivative work from this library would demand that the works (ie the web sites) that they were used in would also have to be under the same licence – what might be termed a “viral” effect. But I’m not sure, and it may depend on the jurisdiction, which in turn depends on whether CC has been “ported” to that jurisdiction… hm.

    And while I’m rambling, you can of course change the licence (or give the library more than one type), but a licence is non-revocable. This means that in theory you might still be able to prosecute somebody who made commercial use of a pattern while the library was under a non-commercial restriction. Whahoo!

  • http://acleandesign.com Loren

    Thankfully I’m not the prosecutorial type :) if that’s even a word.

    I think it also depends on how you define derivative works – for instance, these widgets are used in Axure prototypes, which are just designs. If someone builds a website based on these designs, but reuses none of the code, does that count as reuse? Personally, I don’t think it does, but I am no expert.

  • Pingback: MotionLab » Blog Archive » Primeiros passos com o Axure

  • Pingback: Axure RP users… Library of very funky widgets, and a set of Apple ones too « Idle Time

  • Berry

    When I open the .rp file I only see the carousel and map widgets. How do I view the others?

    Thanks for the great work!

  • http://acleandesign.com Loren

    Hi Berry,

    I think you’re downloading an .rp file from another post: http://www.acleandesign.com/2008/09/click-and-drag-simulation-in-axure/

    Try the one above on this page and it should work! http://www.acleandesign.com/m/Axure_Stencils_2_ACleanDesignDotCom.rp

  • Pingback: Wireframing « electronet

  • Thomas

    Not sure if anyone has posted this here yet, but the Yahoo stencils are finally available for Axure. Since I haven’t had the chance to test them yet somebody else would have to do it. ;)

    http://developer.yahoo.net/blog/archives/2009/08/design_patterns.html

    It is also on the Axure page:
    http://www.axure.com/widgetLibraries.aspx#Widget_Libraries

    Keep up the great work.

    Cheers Thomas

  • http://acleandesign.com Loren

    Thomas: You are absolutely right. I have a bit of updating to do :)

  • chris

    I’m just trying out Axure and I came across your library of interaction widgets. I am really impressed, this library alone pretty much makes the sale for moving to Axure.

    However, I just wanted to clarify the licence you have attached, as it still seems to be non-avaliable for commercial work.

    Are you intending to change it so that it can be used as part of commercial UX design work? As mentioned above, the library is incredible, but the current licence limits it pretty much to Not-for-profit work.

    Otherwise, great work!

  • Workerbee

    This is great. Nice job putting this together. This has saved me lots of time.

  • http://consulting.ascentium.com/blog/ux-seo/Post222.aspx wickkevin

    Great stuff, thanks for making and sharing! I especially appreciate learning from your approaches to creating widgets and masters.

    I look forward to hearing you at AxureWorld this weekend.

    Yesterday, I posted a widget library where all the widgets look like they were pencil drawn. This sketchy look was based on the Visio stencil by Niklas Wolkert. Here’s the blog post with info, demo, and download: http://consulting.ascentium.com/blog/ux-seo/Post222.aspx

    Cheers!

  • Pingback: Heeftstijl.nl - Nederlands webdesign magazine » Review wireframe pakketten (deel 1)

  • DeepBlue

    Great library, thank you!

  • http://acleandesign.com Loren

    I updated the licenses on my libraries a few months ago, but never mentioned it – they are all now the basic CC Attribution license. Thanks for the feedback everyone.

  • Pingback: Pimp my Axure Prototype - Cyanto

  • http://www.kingpimp.co.uk KingPimp

    Excellent Library… i love the Carousel widget.. many thanks

  • http:www.dagenhamheadway.co.uk/headshop HEADWAY

    thank you for this loren these widgets are great perfect for the design work i do…. thank you very much

  • http://www.webberoo.com.au TobiasC

    Loren these widgets are freakin awesome. Your so generous for sharing. You have helped me go from Axure newbie to Pro in a matter of days!

    TobiasC

  • Joost

    Thanks a lot for your libraries, they’re great and very useful!

  • Pingback: Axure | Beginner’s Tut « Dsignpassion's Blog

  • http://www.gtp-icommerce.com Perth Web Designer

    Thanks for producing this. I have been looking for some pre made widgets to save time. You Rock!!!

  • proto typer

    Hi folks, Loren. This is quite a collection of cool things. I am a programmer and XD and new to Axure, so bear with me:

    How is one intended to plop these masters into their own document from the .rp file? Just select an instance on the canvas, copy and paste into the new doc? I thought perhaps I could just drag the master from this collection into the master panel of my own doc, but that doesn’t work. There also doesn’t appear to be a way to copy a master to the clipboard unless you have an instance of it placed on the canvas and you select it via mouse.

    Is there an easier way to get these things into my own doc, besides the method I just mentioned or the import-from-an-RP utility (which is pretty tedious to import a complex master)?

    Also, maybe I’m missing something but this isn’t a “widget library” in the conventional sense, right? There’s not an .rplib file somewhere that I’m missing, is there?

    Thanks!

  • http://acleandesign.com Loren

    @prototyper Glad you like the collection! This library came out before Axure even supported custom widget libraries (.rplib files). So yes, it’s a bit cludgy in the sense that reusing the masters in your own prototypes has to be done via either copy and paste, or File > Import from RP File.

    I have considered moving this whole thing into an .rplib file, and even begun such an effort. However I have run into difficulties. Basically, it’s nearly impossible to make these things scalable enough to be conveniently dropped into anyone’s prototype and have it work in whatever way they may want it to.

    So, long story short, I now see this library as more of a learning tool, something to pick apart and see the different techniques to how things are made. People can take those learnings and create their own amazing widgets. And if one widget just perfectly matches someone’s need in a situation, there’s always Copy + Paste :)

  • proto typer

    Cool, thanks for the follow up! I was just wondering if I was somehow not getting the whole picture. I further explored the methods for creating custom widget libraries and think I have a basic handle on it now…

  • http://kult.la Aaron Fooshee

    Just what I was looking for. New to Axure and didn’t want to have to reinvent the wheel. You’ve got some great stuff here. Thank you.

  • Pingback: Auto-Suggest

  • http://www.creditcardflyers.com/ Alex Randy

    your library is great! thanks for creating it and sharing! you rock

  • http://www.amirkhella.com Amir

    Awesome libary! Thanks for creating this, Loren.

    I was inspired by your work to create my own widget library for Twitter bootstrap and made it available for free at http://axutopia.com/twitter-bootstrap/

  • Stonefcs

    Great library

  • Terrydelahunt

    Hi,

    Thanks for creating this, but I cant get my head round it at all.
    When I load the library, I then must drag Advanced Widgets onto a wireframe, rather than each individual widget.I only want the tab widget.
    When I got the tab widget and began to edit it, it seems impossible to get the original version again. Even if I reload the library, delete it and download it again, it always returns in the condition following my changes.
    This is maddening and I cant work out what I am doing wrong!
    Please help!I want to use the original one to build a tab control from. I need tabs on various pages, and when I edit one its picked up on the other screen which I do not want!Can you offer a solution please?
    Thank you!