Side Prototype
2008
![]() |
| No items matching your keywords were found. |
Side Prototype

Using HTML to prototype wireframes
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.
About the Author
Justinmind Prototyper is the simulation and prototyping tool for designing high fidelity wireframes and mockups. For more information, subscribe to Justinmind’s blog or drop us a line on twitter.
Not sure how to get the right side of my box to complete the box?
include
#include
using namespace std;
#include
// Function prototypes placed here
// External variable declarations placed here
// Global variable declarations placed here
// Global constants declarations placed here
const char space = ' ';
int main()
{
int row, col;
//int size;
cout << "Hello. Welcome to the Box Creator Program!"<
// cin >> size;
for(row = 1; row <= 7; row++)
{
for(col = 1; col <= 7; col++)
{
if (row == 1)
{
cout << "X " << flush;
}
else if (row == 7)
{
cout << "X " << flush;
}
else if (col == 1)
{
cout << "X " << flush;
}
else if(col == 7)
{
cout << " " << flush;
}
}
cout << endl;
}
// This line of code holds the VC++ Console window
cout << "Press any key to end this application" << endl;
_getch();// poor man’s pause
// Returns a value to the calling program
return(0);
}
Here's the problem:
else if(col == 7)
{
cout << " " << flush;
}
What you need is to have the (col==7) condition result in another X, and then have an else clause after that that emits a space. (You'll want it to emit TWO spaces, to keep everything aligned.) Here's one way to do that code:
else if(col == 7)
{
cout << "X " << flush;
}
else
{
cout << " " << flush;
}
There are a number of ways to make this more efficient, but with that change, it does work. (I tested your code in my compiler, there are no other errors.)
Hope that helps!
Prototype - Collectibles - Upper East Side
