The other month, Justinmind Prototyper went ahead and split their pricing plans into two, with a paid pro and a free version. As a refresher, this is an advanced prototyping tool allowing for such things as rich interactions, data simulation, variable based and conditional rules (for both Mac OSX & Windows). They have also shared a few of their prototype examples online.

The Free edition is slightly lighter but still should be able to satisfy many designers’ needs. It comes with access to a wide library of iPhone, iPad, Android and web based widgets. Some useful widgets include: buttons, phone icons, date and time pickers, switches, status bars and keyboards. If those are not enough, users can also create their own libraries. Prototyper also allows the running of an interactive simulation after screens have been linked up. Other beneficial features might include grid controls, snap to grid and resolution guides. Finally, the Free edition also works with the subscription based Usernote online platform (for a monthly fee) which has now also officially left beta. The Justinmind Usernote service lets users publish, share, run tests and obtain feedback on their work in a collaborative way.

As for the latest and the greatest in the 4.5 Pro version, there have been some usability improvements as well as a few new features. For one, Prototyper now allows designers to organize work in layers (Photoshop hide and show style). Furthermore, the latest version also now allows multiple users to work on the same file together. In other words, these guys have built in support for performing file splits and merges. Pretty cool.

That’s the latest and greatest from this company. Download Justinmind Prototyper and give it a spin.

Foundation looks like an interesting open framework for building HTML, CSS and Javascript prototypes. It offers a quicker way to build prototypes as it comes loaded with code for grids, buttons, alerts, forms and error states, sliders (Orbit), and modals (Reveal). The project also feels like it has some github momentum. The makers of Foundation have also shown a few examples of their prototypes.

Have a look and see if it’s for yourself.

Credits: ZURB

Proto.io V2 is here. Since the last review, within a few short months these guys managed to release the next version pretty quickly. The new release has a newer UI with some improvements (ex: bigger and clearer buttons for the 3 core sections: Screens, Templates & Containers). The supported mobile devices have also been expanded to accommodate for the Android platform, and now include the following:

• iPhone 3/3GS/4/4S (320×480)
• iPhone 4/4S (640×960)
• iPad 1 and 2 (768×1024)
• Android Smartphone (480×800)
• Android Tablet (800×1280)

More importantly, version 2 now also allows HTML exporting. So considering some developers use PhoneGap which takes in HTML as input, it’s now easier then ever to create standalone and deployable prototype apps. Cool stuff!

Decided to embed their awesome promo Vimeo video for a quick high level overview. :)

Visit proto.io to give it a try.

Jeff recently has been experimenting with a remote sketching technique in a distributed team scenario. In the article, he describes the setup, technique and learnings in great detail. Interesting things that were mentioned included:

1. use of multiple Skype accounts, cameras and dual monitors (to see both the sketches and the team in parallel)
2. initial priming of participants
3. use of an excel spreadsheet for rapid idea generation
4. use of 1 and 6 screen per page templates
5. facilitation of a 8 person team

Awesome work and thanks for sharing!

Credits: Jeff Gothelf

ProtoShare has recently gone live with the next version of their online prototyping app. The latest version of the tool takes design conversation to the next level by introducing topics. For one, topics are conversation placeholders which can be pinned to a page. More importantly however, topics can also be subscribed / unsubscribed from by various team members. This now allows collaborators some degree of filtering in terms of what might be relevant to them. Finally, another important characteristic of discussions is the way they elevate two types of conversation properties: decisions and resolutions. A comment inside a topic can now be marked as a decision, which makes it stand out visually as a task item to be acted on. Finally, a topic can come to a state of completion by being tagged as “resolved”. Taken together, this wave of improvements now allows for more structured design discussions.

ProtoShare 6 also brings a few extra improvements. These guys have now enabled drag and drop file uploading for a more seamless web-desktop experience. The layout has also been moved forward by increasing the size of the workspace and turning palettes into floating and movable ones. In other words, some minor usability improvements.

The last thing which really caught my attention was the ability to create and switch between multiple concepts (“Designs”) for a single page. In other words, the tool allows users to duplicate a page, try a different layout or idea, and then with time decide which one should be the proper one by means of “Activating” one. Strongly believing in multi-concept generation and the exploration of alternatives, I think this is a solid move from a design process standpoint.

>> Have a look yourself.

myBalsamiq has just launched last month and took the web based version of Balsamiq Mockups and extended it with a bunch of collaboration features. The sketchy wireframes can now be uploaded online and organized into projects which can then also be given one of the following four access settings: private, website, blog and wiki. The default setting, “private”, is the most restricted and makes projects only visible to the specified members you share your work with. Whereas “wiki” on the other end of the spectrum is the most open and allows anonymous users to comment on, and edit the work. This degree of collaboration offers quite the flexibility for a variety of projects.

More so, myBalsamiq also comes with the ability to version your work by means of a revision history, as well as allows for email based discussion groups for each project. The web version of balsamiq resembles the desktop version so closely that it’s hard to tell the difference. Overall, I think this move marks a natural direction for the already awesome and popular tool.

Have a look.

Here comes InVision, a simple click-through prototype building app. The tool itself is pretty light (in a good way) in that you do not design the actual pages in InVision. Instead, the idea is to design your screens in your other weapons of choice (Fireworks, Illustrator, Balsamiq, Photoshop etc.) and then upload them into InVision. Once you upload your GIFs, PNGs, or JPGs, the tool then allows you to create hotspots and link pages together. When creating these hotspots, you also are provided with a very useful ability to save them into templates for easier reusability.

InVision also comes with a few standard collaboration features. You can easily share a full prototype or individual pages through easily accessible links, which then can be commented on by the viewers. You can also invite additional designers if you need multiple people to work on the prototype.

One thing which becomes immediately apparent when using this is that a good amount of effort has also been put into designing the sleek interface. All the little tiny details in terms of interactions and visual design have been fine tuned. As an example, the upload process is quite smooth as files are drag and dropped from your desktop to the web app. Overall, a simple yet clearly focused little application!

Give it a try.

JustProto has made some improvements over the last little while as they moved on to version 2.0 of their web based prototyping app. This time around they included a bunch of collaboration features. This means that the tool now allows multiple designers to work on one prototype simultaneously in real time. More so, designers can also create a quick preview links of the prototype that can be shared with the team. What’s interesting and unique though is that the shared prototype also updates instantaneously as users continue to work on it – potentially handy for quick feedback. Furthermore, real time chat as well as comments in the form of tags, sticky notes and pins have also been included.

Additionally, the latest version also now includes a prepackaged range of useful famfam icons as well as an extended set of elements. Another improvement is that now users can create their own custom reusable components – a pretty standard and useful feature.

Along with their new site redesign, the team has also exposed a number of public prototypes examples to give people a better sense of what is possible with their software.

The Giveaway. Yup, you heard it. These guys are giving away 3 One Year Plus Licenses. What do you need to do? Sign up for an account and leave a comment here on this blog of what you think is useful or would do to improve the tool. The JustProto team is eager to hear out some feedback. Myself along with the JustProto team will try to select the three commentators within 7 days.

Update Congrats to Ben, Michael, and Antonio! They have been selected for the giveaway. :)

Proto.io is a new UI prototyping tool specifically tailored for mobile and tablet applications. The web based environment allows you to start off by creating a project for either the iPad or the iPhone. After creating a few screens, you typically would expect to be able to link a few pages together with interactivity – and proto.io does just that. It comes prepackaged with actions that are custom to hand held devices. So for example, you can simulate such interactivty as: clicks, taps, tap and holds, as well as swipes. Additionally, transitions such as slides, pops, fades and flips are also supported to make the prototype resemble the real experience more closely. Pretty cool.

Proto.io also comes with other more standard prototyping features. Users can create reusable templates and components into which a bunch of prepackaged and editable elements can be dragged onto. Just to give you a taste, have a look at the Picker Component demo which is fully customizable. Another interesting draggable component includes the HTML Code box that allows users to write custom HTML. The tool also has a useful snappy grid as well as some align to features for those who wish to work at a pixel perfect level. Once the prototype is ready you can of course publish and preview your prototype which works inside a browser as well as real devices.

The team is apparently also working on supporting Android devices in the near future. Rock on. :)

Try it out.

Credits: Alexis Piperides

Sketchify is an open source toolkit for simulating simple drawings with a wide range of inputs in real time. As an example, it allows you to quickly create a functional prototype of a moving car along with the mouse acting as a controller for its direction. Other inputs which Sketchify may apparently hook up to include: motion sensing (with a webcam), speech recognition, face recognition, Wii Remote, web services, Phidgets, and Arduino. All of these of cource can then be tied back to move, hide, and affect various interface elements. Here are a couple additional youtube videos which demonstrate more examples of what is possible with this tool.

From the Sketchify website, in Željko’s own words:

Sketchify (also known as AMICO Sketchpad) is a toolset for sketching of novel classes of user interfaces, originally developed by Željko Obrenović at the Concept Lab of the Eindhoven Technical University. Sketchify extends the concept of paper and pencil sketching to a more generic concept of rapid manipulation of interaction material. Interactive material is any piece of software/hardware that represents or simulates a part of user interactive experiences, such as inputs from sensors, output of audio tools, interaction with Web services, or simple drawings. Through manipulation of interactive materials, designers create “interactive sketches”, which in rough terms illustrate interaction scenario or interaction techniques. Our tool gives a designer freedom to combine elements of traditional freehand sketching and with numerous extensions, such as end-user programming (spreadsheets and scripts), and links to existing software functionality.

Credits: Željko Obrenović