Rapid Prototype Blog

Posts Tagged ‘HTML’

Everyone nowadays seem to have an idea of a mashup , wants to create some service that joins two web services, an API, embed widgets or something like that. You can wireframe, test and simulate this using Justinmind Prototyper.

Since version 2.6, it allows you to put a snippet of HTML code into your project, just like it was a normal webpage. For example, the <object> code, to embed YouTube videos. With copy and paste, drag and drop, and you have your video inserted in a page.

A wireframe with embedded objects has a better look and feel, will be just as if it was the finished website,  generating users’ reactions closer to the real ones. You won’t have to explain the mechanics of a paper-based usability test, and will have much more data to base your decisions on.

Remote testing

You can embed analytics code, or recording software snippets, so it may allow you to track an OnDemand prototype, live, hosted on our servers, for online remote testing.

This way, users view your simulation using just their browsers, and you’ll be able to see all data related, just like a real website.

Visit our post about recording software and our post about usability testing to find the software you can embed on our code. (código para o próximo artigo)

Reducing size of wireframe files with server-hosted images

If you need to send your wireframe to other workers, or clients, but don’t want a big file, you can embed the images you have hosted in any server, just like a website or a newsletter, and so your file will be much smaller. This can also be used for images that you use very often, such as your logo. So you won’t have to search in your computer. You can have your mockup images in the cloud.

This could be a great resource for big software or portals projects, and also if you have several versions of the same content.

Enrich your project presentation

You no longer need to put a black box and say it’s a YouTube video. Just embed the video there, and if someone clicks, it’ll run. This works in all simulations, include Justinmind Viewer.

Have your mockups and wireframes finished as if they’re the final products. That’s the best way to test and have data you can really trust on.

If you want more information about embedding widgets on prototypes and hi-fi simulation, visit Justinmind’s blog or drop us a line on twitter.

There is a tendency nowadays of doing HTML prototypes for client presentation or to test projects. This is a more realistic approach to paper, but it’s very much more time consuming. Justinmind is a tool made to join together the functionality of a HTML wireframe with the ease to use of diagram tools such as Visio and Omnigrafle.

There is not a conflict between HTML wireframes x paper. Both have problems: not everyone has HTML knowledge, it’s time consuming and people tend to spend more time checking for HTML mistakes than for thinking about the final product. Paper is not the real thing. Cannot simulate very important situations, and don’t work in several tests.

With Justinmind Prototyper it’s possible to generate this HTML just as if it was a diagramming tool. The final code should be created after approval, but it minimize changes and reduce production costs. This way, you’ll have:

An added value to the client, who’ll see something very much alike the final project, with interactions and maybe a mockup of the final layout. Improved client communication. The client will be able to see his web or program working. He’ll understand the links, the effects, and will make his changes before coding phase. Communication through demonstration means that every specification will be clearer, leading to a smoother coding phase. Dump the poor ideas before. It’s better to lose an hour creating a prototype of that functionality than loose a week coding something that won’t get to the final project. Simplified implementation. When everyone knows what to do, and everything’s well documented, the final phases go easy and smooth.

Easier to convince people of the value of a project

Not a long time ago, when people asked for a layout of anything printed, they received something drawn, painted with ink, glued, copied and pasted with scissors and several other objects. Then came digital desktop, which changed forever graphic design. Now, before buying a great project, you see a mockup of the printed version, with almost final quality of colours, shape, etc.

Why selling a website with a static page?

We know coding can be hard, and much more for applications, but that can be simulated to near-real experience nowadays.

You have to build one car to test, then mass produce it

When a car factory builds a car and have it tested, this prototype can be approved, modified or abandoned. They can also be virtually built and simulated with software nowadays, can’t they?

That can now happen to websites and programs.

An HTML prototype is like a real built car. It’s hard to create, but it shows all functionality to perfection. If it works, they’ll build more. A prototype created with Justinmind Prototyper is like a virtual car: you can test almost everything, and simulate to the bones, having all the advantages, but with much less effort.