10 suggestions on how to improve the efficiency of axure design and improve the efficiency of axure Design

How to Use axure more efficiently is a skill that beginners need to master. The ten suggestions I have summarized from my practical experience are worth learning. I will share them with you:

Axure is a fast and powerful tool for creating software prototypes. It is easy to get started, but there is a risk. This software is so intuitive that many users can use it without any formal training. What they may not know is that they may not use axure in an appropriate way.

As an experienced user experience designer, I rarely design a page correctly for the first time. Most of the time, I have to go through 5 to 10 iterations ). When your user experience design is used as a blueprint for agile projects, you may need to keep up with the entire project within the project cycle. Sometimes, these changes will affect dozens of pages or more design pages. In this case, some of axure's less obvious features can save designers a lot of time.

I generally work in a team to create a line chart and a prototype. To this end, I will use the share project feature in axure (called a team project in axure 7 」). Real-time collaborative design of a project is my favorite place for axure, but it does require a concise and structured way of working. Without a doubt, you will find that someone else is working on a design draft you have designed, or you are working on a design draft of someone else. I have kept these axure guidelines in mind, because they are the tools I work for now, and I believe these suggestions apply to other software tools as well.

In the long run, I think the 10 suggestions I have put forward are an important way to save time (crucial techniques ). This approach does not always reflect its advantages in the short term, but it can be more flexible than normal (but it does allow for optimal flexibility further down the line .).

1. Do not use two Widgets

The most time-consuming behavior I have seen is that axure's beginner and advanced users are using unnecessary controls. I found myself still making this mistake, so I must keep reminding myself that this is the first rule. Every control you add to a project will take more time to change in the future. All these tasks will gradually increase after ten iterations. For example, how can two objects visually identical be created in different ways?

The preceding two examples illustrate a situation where some people use a text tag and a button to add a separate control. When this person wants to add an onclick event to the entire object, they have two options. The first method is to add a hot zone on the entire component. This method makes all three controls need to be maintained. The second method is to add an onclick interaction event for each element. This makes the two interaction actions need to be maintained.

When the part needs to be modified, both methods will take unnecessary time. An easier way is to create an object by adding text to a rectangle.

You can use the alignment and fill toolbar to adjust the position of your text. You only have one control to maintain and only need one interaction event.

2. Do not copy objects, but convert objects into masters.

When I found myself at a later stage of design and we needed to change the main navigation of every page, I experienced great joy. Not because I like a lot of repetitive work (a big pile of), but because all I have to do is edit a single master, and then the entire project is updated quickly (presto.

It seems that using a master for the main navigation is not surprising, but it is worthwhile to create a master, when you use any operation more than once. Whenever you find that you have been copying and pasting a group of controls, always remember that creating a master may be a better choice.

After a master is created, for example, if you decide to change the text on the button to "buy now", you only need to edit it once, then we found that every instance in the template has changed.

Remember, do not convert a large composite object into a master. The larger the composite object, the more likely it is to be modified in many places of the master. It is generally better to combine some masters with other masters. This method becomes very convenient when you only need to make some changes in a master. That is to say, some elements are always included, while others are always changing, for example:

This basic dashboard does not contain price information, but it can be combined with another master to create a new master for all product display diagrams.

3. Set the style (place styles) before creating a master)

The master is good for creating elements that need to be reused, but they cannot be changed. Each master instance is identical. The style comes at this time. Suppose you have a button to be copied to multiple pages, but the label on the button needs to be modified, and the style can be easily completed. You can set the attributes of each button through the style. All you need to do is modify the text tag.

Buttons are usually used to add events such as mouse hover. In axure, these events are often created by using dynamic panels. Different statuses are placed in different dynamic panels and scripts. However, in this way, you will enter the status of each dynamic panel to modify this button.

A quicker way to process button events is to use the interactive Style dialog box. To use this function, you only need to set different styles (with this feature, simply set different styles for each behavior State) for different event states, and then copy the button and set the size once.

Tip: You can use the auto-adaptive width function described in axure 7 on the button. If you use the left and right padding function in the style, you only need to modify the text of the button, and the button size will automatically adapt.

4. Keep the project organization and naming clear

Axure provides many options to keep the project organized. Each element you place on a page has a unique name. The page can be named and organized into a tree structure. For example, a master can be named and sorted in folders. But why is it necessary to give each object a clear name?

1) Keep things organized

When you have a well-developed webpage and want to create an interaction through the dynamic panel, you will have to find the one you want through a long list of elements. You can use the search box-but this is only when you have been considerate and named your project.

2) allow team members to intervene

Maybe, like me, when you are in the team, your project will always happen unexpectedly. You or your colleagues may be ill or accidentally have to work in another project. It is vital that the project is clearly established so that others can intervene smoothly and take over the transaction. Interactive events added by others can be very complex.

3) shared with a third party

In most projects I participate in, I need to share the wiremap with at least 10 colleagues. Some people will sit at my desk and I can instruct them. Other people, we will never meet, and I don't know what they understand about the lineframe. Ideally, a prototype should be clear and easy to understand (viewable autonomously ).

I will do the following to complete the task.

1) create a logon page

You can set your prototype homepage as a start page to explain what people see and how to use it. In addition, you can provide your contact information or a link in the flowchart.

2) give the page a unique and self-explanatory name

If the Page name is clear and the content of each page is described, this prototype is easier to understand. These names will also be used in future communication. For example, if a graphic designer makes a sample (COMP) based on your design, they may use the same name for the page as you do. If the name of a page is not unique, there will be two different names for a page.

3) create the most common Flowchart

Most people do not make design pages into tree structures. They prefer to design them based on activity flowcharts. You can create a flowchart in axure to reflect important user processes and link them to related pages. Then you will provide additional ways to browse the prototype. (The name on the flowchart is based on the names of those site maps. Therefore, whether you name it clearly becomes very important .)

5. develop the habit of using global guides and grids

Axure allows you to create two guides: one is a local guides that only exist on one page, and the other is a global guides that exist on all pages. You can set the guides in the create guides dialog box. For example, if you set a 960px grid and then locate elements on different pages, it will become much easier. At the same time, your team members will see these global guides in a shared project.

Grid helps you keep the design clean and structured. I often set my mesh to 10x10 PX, and then create my object in multiples of 10. For example, a 60x20 pixel button is not 55x18 pixels. When you place these objects on a grid, everything becomes more aligned and can satisfy any of your obsessive-compulsive disorder. Of course, special objects of different sizes are allowed to deviate from the grid.

Tip: In axure 7, you can create different global guides for mobile terminals and web pages. The following is an example of a mobile mesh application that I like to use:

6. Do not forget the import function

In most projects, the elements created by people are also useful to other projects. Instead of re-inventing the wheel, you need to repeat the elements used in past work. Many basic things must be consistent throughout the project, such as styles, guides, and masters. Although it is possible to copy and paste a project from this. RP file to another. RP file, not all information is stored. When you paste a button with a unique style, the style will not be pasted together.

The best way to reuse elements is to use the powerful import function. This allows you to import pages and masters, as well as styles and guides.

Tip: create a "parent". RP file to import new projects, where you can maintain a standard master.

7. retain the old version of the webpage

I often find that I need to return to an old version of a project. In the past, I often needed to create a line chart in Visio. It was difficult to manage projects with many pages, so I would eventually lose the page.

In axure, tracing the old version is easy. Create a folder named "bin" (or create a page in axure 6.5 or earlier ).

Put the old version of the page there, so that you can easily find it when you need to return it in time. To export data, you only need to select a part. You do not need to select all pages. In this way, you can share a concise version with your customers, and the old version can still be accessed directly.

8. Do not design unnecessary interactions

Axure's initial users often have an impression that axure can easily add Interactive Actions to the prototype. At the beginning, I couldn't help adding interaction actions to every page I created. However, in many cases, I can clearly communicate the design without any interaction-Just static images. Now, I only add interaction actions when I answer "yes" to the following questions.

1. Do I have to interact with each other to clearly express my design ?」

If you only provide static images without interaction elements, will your design be misunderstood? This may be a situation where an animation is needed to be understood.

2. "In the long run, does this interactive design save time ?」

Is it faster to create an element to interact than to display different States on different pages? For example, creating and maintaining tags for an interactive webpage is easier than creating multiple tags for each page.

3. "Do I need to convince some people of the concept of interaction elements ?」

I have come up with the best solution that I think is the problem, but I know that this solution is hard to be promoted, so I need someone to support my ideas. I found that the interaction prototype can help me spread my thoughts.

However, if the answer to all these questions is no, I would rather create multiple versions that show only one interaction element in different States.

9. Use the font icon instead of the image

Another simple but often overlooked way to keep axure projects manageable is to minimize the number of images. To change the color of an image in a prototype, you have to go through several steps. You need to open an image editor, modify the image, export a new bitmap, and finally import your axure project.

Another option is to use a font icon. 1. You can change the color and Icon ratio in axure. A great basic font icon Resource Station is http://copypastecharacter.com/, and its Icons can be used right away on many platforms.

For font icons, you can add a chart on a button, but you still need to follow the first suggestion.

10. preview the prototype on a browser or device

Designers will be frustrated if they learn that their prototype is different from what they see in their browsers in axure. In particular, the text spacing and position are different. Worse, they are displayed differently in different browsers. To avoid errors, You need to constantly preview your prototype in the browser, and preview your prototype on the device if it is a mobile prototype.

Even if you can never eliminate all the differences between axure and browsers, there are some ways to reduce the differences below.

Text surround

The following describes how to wrap the text:

The following shows how to wrap the browser text:

To prevent the text box from being circled to the next line, make sure that your text box has enough redundant space. The safest way is to provide enough space for the text box. Therefore, if you need to edit the text in the future, you do not need to change the size of the text box, it will use the Text wrap method.

Vertical spacing

Vertical spacing shows the difference between the browser and axure. You can fine-tune the padding in axure until you find that the text looks good in the browser, but this is a great effort and you get an uncertain result. The only way to determine the text location is to either break up the copy into chunks or convert the text into a graph. Unfortunately, the first option breaks the first suggestion, but sometimes it is inevitable.

Summary

In the short term, these suggestions rarely show results, but in the long term, they have many advantages. Perhaps more importantly, shortening your work time can make your work happier.

I hope these suggestions will help you as well as me. I believe that some people will think that other rules will be more important and we are happy to hear them, so please post your thoughts in the comment box below.

If you do not have axure, try axure 7. Some changes really help maintain the organization of your work.

Last point:These rules are used to be broken like any other rules. Don't let them affect your work. SMART designers, we need to know when to break the rules.

10 suggestions on how to improve the efficiency of axure design and improve the efficiency of axure Design