Huge Update for Bootstrap 4 Axure Widget Library

gumroad-banner---2017-update.jpg

Live Preview      Download

The guys over at Bootstrap made some rather large changes in their last few alpha updates of Bootstrap 4.  So I went ahead and implemented a lot of those changes in my Axure library.

Changes included:

  • New typeface Segoe UI takes the place of Arial
  • New component styling for many of the widgets; new accordions, tables and cards.
  • Added widget styles for the more common elements
  • Simplified the builds of some of the widgets, taking advantage of Axure 8’s increased functionality (rounded corners, selective border treatment, etc)
  • Simplified form inputs.  Placeholders are now Axure native, rather than separate elements.
  • Added in more disabled states.  All of which can be toggled on and off directly in Axure.  (Right click element, select “disabled”.)

The library feels really strong at this point.  Probably will be very close to the final Bootstrap 4 release, if I had to guess.

Advertisements

Review of Validator for Axure

axure-for-validator-header-image

Overview

Recently a company by the name of Usability Matters released a great new tool for Axure called “Validator.”  The tool promises to help you save time by automating form error messages in your Axure prototypes.  Something every Axure user has likely spent a lot of time doing.

I downloaded Validator and spent a couple of hours with it and I’m going to share with you my thoughts on whether or not it meets the challenge of streamlining the process of creating and automating forms.

You can download Validator here.

How does it work?

I’m not going to spend much time talking about how Validator works.  As the download page linked above does a great job of walking users through the process.  But to give you a birds eye view, simply add an asterisk to your text fields, and Validator will do the rest.  Pretty great, no?

You can also validate emails, passwords, as well as specify where to place error messages, among many other settings controls.  Validator comes with a detailed settings panel that give users quite a bit of control on how they’d like Validator to both look and function.

Will I save time?

The big question most users will have is “Will I actually save time using this tool?” As an advanced user, I think I probably spent as much time customizing the settings panel as I would have to simply create the error messages and validation myself.  But I say this as someone who has gone through the process of creating validated forms many times in Axure.

For new Axure users, as well as intermediate users, Validator will save you a ton of time and make it very easy for you to quickly add validation to your forms.  For advanced users, it’s tougher to tell if this solution will actually save time.  I think it will come down to the scope of your project. If you have a significant number of forms in your prototype that need validation, Validator is a great solution.  If you have a simple login form and nothing else, it’s probably a wash.

What could be improved?

I definitely ran into some hiccups in placing the error messages.  The settings panel gives you only modest control of where to place it.  You can put them above, below, or to the side.  But often I want to place the message above the input, but to the right side.  And I couldn’t figure out a way to do that with this tool.

Another issue is that this tool will only work with the native Axure text fields.  Which makes sense of course, but I rarely use the native inputs these days. Unfortunately they still lack quite a bit of design flexibility, so I usually find myself creating custom inputs for most of my prototypes. And Validator won’t work on those.

Do you recommend using this tool?

Absolutely!  I think I will get a lot of great use out of Validator. And Usability Matters has been kind enough to offer it for free.  So you’re really not out of anything if you download it and end up not using.  Plus you might end up putting a smile on the face of your boss, a client, or a stakeholder when they see how realistic your forms are.  At the very least this is a good way to win some brownie points.

All in all, this is a wonderful tool that is surprisingly powerful and intuitive to use.  The creator(s) have gone to great lengths to make the tool flexible, as well as to give users guidance on how to quickly get Validator up and running.

Download Validator

 

Axure Salesforce Widget Library

gtnjmfzLive Preview

The Axure Salesforce widget library has arrived! 193 remarkably interactive widgets, meticulously crafted pixel by pixel from the Lightning Design System CSS. For use with Axure RP 8 only.

Download Includes

  • Salesforce Widget Library (.rplib file)
  • Template file used to build the demo (.rp file) For users who prefer to copy and paste.
  • Salesforce Icons (PNG and SVG)
  • Free updates for life – This library will be updated from time to time and you will automatically be notified by email with a download link anytime I make an update.

 

Library Includes

  • Activity Timeline
  • Badges
  • Breadcrumbs
  • Buttons
  • Button Groups
  • Icon Groups
  • Cards
  • Date Tables
  • Datepickers
  • Docked Composer
  • Feeds
  • Form Elements
  • Lookups
  • Media Objects
  • Menus
  • Navigation
  • Notifications
  • Page Headers
  • Panels
  • Pills
  • Popovers
  • Publishers
  • Tabs
  • Typography
  • ***And a special default section so users don’t have to switch between libraries constantly. Default library includes the most common elements used when prototyping like a simple button, dividers, checkbox, etc.

 

Features You Will Love

  • Global styles utilized for hover, active, disabled and selected states. This means you can change styles once, and have every widget update automatically.
  • Well organized and labelled elements.
  • Widgets behave like genuine Salesforce widgets, with every state of interaction meticulously recreated. Even checkbox focus was preserved, in an attempt to perfectly mimic the Lightning Design System specifications.
  • CSS perfect styling. I spent countless hours inspecting element in browser to ensure that each widget exactly matches the Salesforce CSS.
  • Widgets built using simple and intuitive Axure best practices.

 

Attributions

  • Roboto
  • Salesforce
  • Lightning Design System

 

Live Preview

Axure Foundation 6 UI Kit

blog-coverThe best Foundation UI kit ever created for Axure.  Based on the new Foundation 6 release from Zurb, this widget library features 109 meticulously crafted widgets and 6 amazing starter templates ready to go for your next prototype.

Download      Live Preview

Built with Axure users in mind, and utilizing best practices, the Foundation 6 library is one of the easiest to use libraries ever created. Build beautiful and functional prototypes faster than ever.

Download Includes

  • Axure Foundation 6 Library (.rplib file)
  • 6 Starter Templates (.rp file)
  • Quick start guide, so you can hit the ground running.

Features You’ll Love

  • Common widgets section – similar to Axure’s own native library
  • Hover, active, focus and disabled states.
  • Elements built using global styles for ultra fast customization
  • Extremely organized
  • Well labelled elements

Library Includes

  • Buttons
  • Button Groups
  • Headers
  • Badges
  • Labels
  • All Typography
  • Switches
  • Callouts
  • Breadcrumbs
  • Pagination
  • Navbars
  • Dropdowns
  • Tooltips
  • Modals
  • Tabs
  • Thumbnails
  • Tables
  • Progress Bars
  • Forms and Inputs
  • Orbit (Carousel)
  • Accordion
  • Building Blocks (with more on the way.)

Templates Included

  • Real Estate or Travel
  • Ecommerce
  • Agency
  • Blog with Sidebar
  • Blog Single Column
  • Product Page

Screenshots

Download      Live Preview

Axit – Axure Landing Page Template

Axit-Gumroad-Banner
A beautiful landing page template for Axure RP. Featuring clean and modern design, well crafted elements, and delightful interactions.

Live Preview     Download

Template Includes

  • .rp file, ready to go out of the box
  • Full width design
  • Embedded Google fonts (Raleway, Open Sans)
  • Font Awesome iconography
  • Commercial free photography
  • Social media
  • Hover, active and focus states
  • Clearly labeled elements for easy customization
  • Scroll-to interactions
  • 2 Separate functional forms
  • Tabbed section with gentle transitioning

Things You’ll Love

  • Soft ease-in ease-out transitions
  • Attractive and modern design layout
  • Clearly labeled elements for fast customization
  • Support from an Axure guru, just holler at me on Twitter if you need anything.  @AxureThemes

Full Screenshot

Axit-Axure-Theme-Screenshot