How to Design A Good Prototype?
It is undoubtable that the speed of launch and updating a product is really fast, however, it is doubtable that many of the products are not well-designed. In fact, the design level of a product has already been decided when the prototype has been designed. Recently, I have talked to some designers, and learned a lot about how to prototype. And I have wrote them down, as some kind of suggestions that might be helpful to you.
1. Project type
It's an old saying in China: Nothing can be accomplished without norms or standards, this also works for prototyping. Choosing the type of your project should be the first thing you do for your design, and it's really important. No one can save you if you don't even have an idea about what you are doing right now. There are just a few kinds of types now: Mobile, Web, and Desktop. Some of the prototyping tools offer these types, like Mockplus and Justinmind. This is the first step of building a prototype. Basically, it means a lot for the layout and the way of using the components of this design if you have made up your mind on the type of this project. When you know what you want, you will find the way to get it. And of course, these two prototyping tools also have custom project for the need of other users.
2. Project tree
Project tree is also known as project outline. In the whole process of product design, project tree is the basic structure, it's like the line of a story, guiding every step in designing. Project tree is more of a outline, all the pages shall follow the rule of it. So, don't start your design right away after you choose a type, calm down, and think about how to arrange this tree. And, it would be helpful if you can start this step with a mind map. It is said that Mockplus will support starting a project with editing mind map, and turn it into project tree directly.
3. Guidelines
Guideline is the most common tool in design, but it is the easiest one to ignore too. If you make a research, you would find out that almost all the design tools have the function: guidelines. It doesn't matter which kind of tool you are using, prototyping tools like Mockplus, image editing tools like PS and AI. In these tools, guidelines are not just the lines lying there, it has more features. In Mockplus, when a component is at the same X/Y coordinate as the other components,or share the same center line, there will be a guidelines automatically, it would be helpful for locating a component.
4. Alignment distribution and proportional coordination
The clean and well-organized layout of the page, will bring great convenience to the design work. Here to recommend a more effective way, that is to use Euler spiral. Many designers convinced that euler spiral can only be applied to the specific image editing. But, in fact, euler spiral has the amazing function at arranging the layout, and there are a lot of examples. The most famous example would be the radius of iPhone. Another benifit of using euler spiral is that you can adjust the size of components more properly.
These are the theories of making a good prototype, it should be the part I. In part II, I will introduce the specific numbers of iOS and Web prototypes.
1. Project type
It's an old saying in China: Nothing can be accomplished without norms or standards, this also works for prototyping. Choosing the type of your project should be the first thing you do for your design, and it's really important. No one can save you if you don't even have an idea about what you are doing right now. There are just a few kinds of types now: Mobile, Web, and Desktop. Some of the prototyping tools offer these types, like Mockplus and Justinmind. This is the first step of building a prototype. Basically, it means a lot for the layout and the way of using the components of this design if you have made up your mind on the type of this project. When you know what you want, you will find the way to get it. And of course, these two prototyping tools also have custom project for the need of other users.
2. Project tree
Project tree is also known as project outline. In the whole process of product design, project tree is the basic structure, it's like the line of a story, guiding every step in designing. Project tree is more of a outline, all the pages shall follow the rule of it. So, don't start your design right away after you choose a type, calm down, and think about how to arrange this tree. And, it would be helpful if you can start this step with a mind map. It is said that Mockplus will support starting a project with editing mind map, and turn it into project tree directly.
3. Guidelines
Guideline is the most common tool in design, but it is the easiest one to ignore too. If you make a research, you would find out that almost all the design tools have the function: guidelines. It doesn't matter which kind of tool you are using, prototyping tools like Mockplus, image editing tools like PS and AI. In these tools, guidelines are not just the lines lying there, it has more features. In Mockplus, when a component is at the same X/Y coordinate as the other components,or share the same center line, there will be a guidelines automatically, it would be helpful for locating a component.
4. Alignment distribution and proportional coordination
The clean and well-organized layout of the page, will bring great convenience to the design work. Here to recommend a more effective way, that is to use Euler spiral. Many designers convinced that euler spiral can only be applied to the specific image editing. But, in fact, euler spiral has the amazing function at arranging the layout, and there are a lot of examples. The most famous example would be the radius of iPhone. Another benifit of using euler spiral is that you can adjust the size of components more properly.
These are the theories of making a good prototype, it should be the part I. In part II, I will introduce the specific numbers of iOS and Web prototypes.
Comments
Post a Comment