77

I hope the answer to the question is never. A prototype is meant to be a test. Built using the most "hacky" approach with the least amount of time to get initial feedback on whether a concept is viable. The alpha is something you give to actual users. This is the version, if successful, you hope to build upon to become the beta and eventually the product ...


52

I'm sure different people will have different views on how much or how little wireframes and prototypes overlap. What follows is how I approach the two: If you are considering an application or a website, and you look at the page level for example, a wireframe and a prototype are superficially the same things, from a physical perspective. They can both be ...


15

Yes. You'll like Balsamiq Markups. You can even make it a little bit interactive.


14

Yes, they do. Low fidelity tends to get people to focus on the higher level aspects of the mockups, like the overall layout and concept. While with high fidelity mockups people tend to focus on the lower level details like "this should be two pixels to the left", or "this needs to be a different shade". That is one of the reasons that I recommend ...


13

Wireframe - Basically Skelton of interface, something we can compare with our BLUE PRINT Prototyping - Workable dummy out put. combination of wireframe, interaction, scenarios, stories


11

It doesn't make any sense to measure a UX designer's progress at making wireframes. Wireframes are just a way to communicate with other people and can take many forms, from sketches to mockups to "interactive" wireframes produced with software like Axure. Their purpose is to represent ideas in a form that can be discussed with stakeholders, team members and ...


11

First, I applaud anyone showing an interest in focusing on the interaction side of design. In corporate UX groups, I find that the one thing that often does fall through the cracks is the interaction design (often due to waterfall development processes). The UI may look stunning, the back end, tight and responsive, but then you put them together and things ...


11

User performance not user opinions The solution is to do a proper usability test. Don’t show users a prototype and ask them what they think of it. That’s asking them to imagine what it would be like to use the product, which yields unreliable data. Instead, have them use the prototype so they (and you by your measures) know what it’s like to use the product....


10

This open source library is pretty good to start with and covers many types of common gestures: http://gestureworks.com/downloads/icons-poster.zip Alternatively, this one is pretty good as well: http://gesturecons.com You could also try a short video or animated GIF images to make the gestures more explicit, VideoHive offers many footages you could use to ...


9

The straight-out answer to that is pretty simple: It's in the nature of a prototype to be beneficial. If it's not beneficial, then you're doing it wrong... If it's not beneficial, then it's not prototyping by definition... When you start prototyping, you need to know why you are prototyping. You need to know what the benefits will be. If you don't ...


8

SketchFlow which is part of Expression Blend Studio by Microsoft is really, really good... There's also Sketchify Justproto App Sketcher PowerMockup JustinMind


8

Paper prototyping lets you forget about the constraints of the tool that you are using, and forget about the fine details so that you can focus on the bigger picture. That said, there are other tools that work well as substitutes. I often use Draft on my iPad as a replacement, and I'm sure there are other similar tools out there. The key is that when you ...


7

When selecting a testing method you should always first ask what the goal of the testing is, for no one method will suit all possible purposes. At the most basic level, different methods are good for discovery, while others are good for validation. Paper-prototyping is a testing method for discovery and understanding, and is ideally used early in the design ...


7

Mostly working self employed / freelancing on website related projects I would say it's the developer/designer's decision if it's a (working) prototype or a (buggy) alpha version. A prototype is never ment to be public while an alpha version robably is. The line between those two is difficult to draw – but for me / with web projects it's the moment when I ...


7

The interface of balsamiq has two main functions: 1 - Stop you from fiddling You won't spend time doing unnecessary things. If there's no option for color or rounded corners, you won't worry which shade or radius to use. 2 - Communicate that it's a sketch. Of these menu mockups, which is more likely to receive comments about the M not being the right ...


6

SVN isn't great because it has a high learning curve and is primarily used by developers. If you don't have a problem with that, go ahead and use it (or git, or hg, or whatever), but I think there's a better way. Handcraft (which I build) was designed with this problem in mind. Instead of using version control, you have distinct prototypes in your account. ...


6

I saw this article a few weeks ago about a UX designer with a similar predicament. He solved the problem with a combination of a traditional Axure prototype and some clever usage of Google Docs. He details the amount of time he spent vs. the benefits at the end of the article. If you're a bit tech savvy and can't justify getting developers involved this ...


6

Start with the smallest form factor first (in your case the phone) since the lack of space will give you the opportunity to require you to define the primary focus of the app and what is the primary content that must be provided to allow the user to do his task and not allow you to add too much extraneous stuff. While moving up to higher form factors, ...


6

If I'm creating a layout for a publication and it's in its initial stage, I'll use Lorem Ipsum. But when I'm creating prototypes for interfaces, I always use real data. You learn more from putting real content on there than you would with a block of random text. I also find that when I'm getting feedback from other people, it's useful for them to see the ...


6

Although I wouldn't change a prototype based purely on the feedback from the first tester, I would definitely and fearlessly make such a change if I got a majority of the first 4-5 testers revealed a problem. ...and I would stop wasting testers on the old design until that change was complete. Here is why... In UX, Ignorance is precious. Every user only ...


6

You don't need every core competency Our professional practice includes many core competencies. Nobody excels at them all. Your strengths can be in two or three of these: Information architecture — how things are organised, based on research, taxonomy, user needs, and so on. Interaction design — based on patterns and standards, cognitive psychology, user ...


5

A wire frame is used to capture requirements, share ideas and to begin to outline the specification and structure. They can be limited to single page diagrams, or more commonly now - a full site. They are akin to blueprints. They can be offline diagrams or more often now, created in a dedicated piece of wire-framing software. A wire-frame is part of the ...


5

For starters, Balasamiq does have a very thriving community who do voluntarily design stencils/mockups of various interface elements and there are android elements available at The Mockups to go site (Android Controls) The IOS elements for Balsamiq can also be found here Do check out Axure's good student program. I am not sure if your students qualify for ...


5

I follow a 3 step process: Photograph or scan the paper prototypes and back the images up. Place all the paper prototypes in a sleeve or box. After the box has been idle for about 6 months, I usually throw the contents out. I only work with paper, but if I were working with physical prototypes, I would store the box with them in some cheap storage. In ...


5

I like the elegance of using hover effects (such as described in Konturs answer) however these will confound the study results because it will guide the user to know what areas not to click and over time, it will actually increase their success rates. In fact, I usually try to ensure that no cursor differentiation occurs at all- making it so that the cursor ...


5

For me the advantages are: It's faster. Significantly faster than any other prototyping tool for many situations. It encourages different kinds of feedback. People respond differently to sketches on paper than they do to things on a computer - even rough looking things on a computer. One is very obviously temporary. People seem to be more open to different ...


5

The suspend control is controling the on/off switch - which leads me to this design. Mockup 1 shows on-state, mockup 2 shows off-state and mockup 3 shows suspended state: Both on and off are not in use, represented as disabled without anyone of them selected. download bmml source – Wireframes created with Balsamiq Mockups


4

Wireframing and prototyping are exceptionally useful and underused tools in the tech world. Website and app wireframes are useful to determine the layout and overall look and feel of each screen or page. Prototyping is an effective tool for validation and as a way to test your development company. Wireframing Wireframing is probably the most well ...


4

After testing many programs and websites i found that Fireworks is a very good options in case you have it, and if you need to export the sketch to html or pdf. But the best in my point of view and what I do most of the the time is using a pencil and papers without using the computer.


4

It sounds like you're doing HTML prototyping with Javascript for the functionality iterations (Backbone.js wheee!) so let me approach it from that point of view. First off, doing things in HTML allows you to focus on the right details of the user experience, whereas with a tool like Axure or paper prototyping you're really zooming out too much to a ...


Only top voted, non community-wiki answers of a minimum length are eligible