01Font: type & font size
In the text design of the prototype page, it is recommended to use Apple Square (macOS) or Microsoft Yahei (Windows) for the font selection, in order to achieve a better display.
I personally use 12, 13, 14, 15, 17, and occasionally 9, 10, 20.
02Color: Color & Interface
In the prototype page, it is best to maintain a consistent color design, whether it is text or other graphics, pictures, do not use too many non-black, grey and white color values.
If the product prototype manuscript for demonstration needs to be equipped with icons, you need to maintain the consistency of the picture, size and style. In practice, however, try not to use icons except for those that are more directional, such as search, settings, sharing, and so on.
The materials that make up the prototype interface should also be avoided as much as possible, such as taking screenshots from mature products and applying them to your own prototype.
AdjustColor color adjustment has been added to Axure 9, which allows you to adjust the color value of the image.
03 Typography: Alignment & Spacing & White space
In the structural design of the prototype page, to be flexible in the use of reference lines, alignment, distribution and other functions, so that the content of the page has a good readability.
Personally, I would set both spacing and white space in multiples of 5 pixels. White space is usually adjusted in the Style panel by adjusting the Padding value, which in many cases also assists me in aligning components. The line spacing between text is occasionally adjusted, but will be the default.
04Examples
The following are some examples of prototype pages:
05Conclusion
For newcomers who want to work as product managers or interaction designers, it is recommended that you familiarize yourself with the use of the tools and consciously cultivate your own design specifications. When drawing wireframes, or copying other mature products to create high-fidelity prototypes (which are not necessary in practice, but require special attention), we must pay attention to the following two points:
Wireframes: It is not recommended to follow Apple's or Android's design specifications for page design.
High assurance: pixel-level copying is not recommended.