A common list of pages drawn with Axure

What are the basic steps to draw a list page?

① first draw the page frame

② draw on the navigation

③ the last painting list


Painting list items commonly used method?

Next, let’s talk about how different items should be drawn.

First draw a list of items as needed.

Then select all the items and copy.

Then paste it to the bottom and close the first list item.

And so on, repeat multiple times.

Exactly the same list of items how to quickly draw it?


The exact same list of items means the same except for the field values.

Such a list item, use the repeater is very easy.

How to draw a list of multiple items?


Use a rectangular box + text element, make a combination, copy and paste. Finally, modify the copy.

It is recommended that the commonly used list items and other components are produced again, generate their own component library, and then one by one call and modify the name can be. Interested friends can try my summary of the method “advanced PM teach you custom APP common component library”


Of course, if you only draw the wireframe, do not consider the interaction. Then use the repeater is the most easy way, and add, delete, modify are very convenient.

If the list items have some differences how to draw?


In general, the difference is that the input area to the right of the list item can be drawn as a list item with a common part, and the difference can be drawn separately. This is efficient.

Such as the name of this line, it should be a rectangular + text box.

Such as sex line, it should be a rectangular + radio button.

ID type, same sex.

IDnumber, same name.

In addition, there will not be many styles of the list box in the same APP, so it is suggested to be added to the component library.


Why do not list items master prints?

Although the master can also be used to make list items. However, this page is a one-time, not suitable for use master. The original intention of the master design is to use multiple pages instead of the same page.

You can abstract the same part as the master. Only the master is not suitable for this same page scene.

By the way, my method is not just for Axure. Ink knife, xiaopiao, mockplus the same trial.

Common list items generally need to use a few components?


Someone said: two, rectangular, text box.

Someone said: three kinds, rectangular, text label, text box.

In fact, both, in general, with two components is enough, easy to save. The trick to using less than one is to write in a rectangle the list item title.

Draw prototypes will be easy to modify. To make such a list of items, draw 3 is not tired, but the business often need to do 3-5, this time will be a waste of time. Furthermore, if you need to modify, the time spent double.

When to list items need to use three components?

Two can not meet when using three, such as the following these scenes.

For example, the rectangle and the title, have different logic.

For example, the rectangle and the title, there are different interactions.

For example, the title of the list item is icon + text.

There is also a case, such as inkjet support prototype visual label will be displayed, it is recommended three.

No Comments

Leave a Reply