Talk to the Wireframe - Stay extra time for wireframes

Note: heidi wrote this series of professional articles, does not say how much heidi doing well, on the contrary, whenever I found myself doing well or when I encountered problems, like to reflect on and summarize, but as previously developed Of the bad habits, leading to what I eventually write things like professional tutorials, which also led to some children mistakenly believe that I am a professional, in fact, is not true, I write is not necessarily a professional article (sometimes only shows so ), I just think this topic worth exploring, it is worth sharing, it is worth to continue their efforts only. So, please do not reprint everywhere.
---------------------- Low-key dividing line ------------------

Wireframes are an essential output for interactive designers and play such an important role in the work of interactive designers that interactive designers are often thought of as a wireframe, but neither the designer nor himself Project team members, the significance of the existence of the wireframe does not necessarily have enough knowledge.

Why does the project require a wireframe? Why not shorten the cycle, direct jump to the visual design?

For designers, the same question exists:

Wireframe bring us what value? When we want to wireframe training, the question is: is not a sketch? Still need to learn?

If you understand wireframes as "sketches," then sketched output is necessarily faster than slow, but slower than normal, but in many projects, the time spent on wireframes is more expensive many?

This often leads to puzzling because, in the eyes of most people, the wireframe is a simple, crude and rude draft without any visual processing. In addition, I have repeatedly claimed that the tool for the wireframe can be set up in 10 minutes Wireframe ultra-idiot tool, and the wireframe itself completely without carving deliberate processing, then, why stay in the online block diagram stage so long? What are other people doing? Where are the time spent?

When I reviewed my past projects or looked at my projects, I also found out why the past stages of wireframes were relatively long. As for the projects currently under way, resources are arranged on their own and the resources pre-arranged by themselves, for example only three days, are found to be too tense in implementation and are not enough?
A closer look and found that maybe three days, I spent a day and a half to build a basic needs to meet the basic wireframe (in terms of business needs, this is the main page we can expect), but in a day After halfway, I started to explore and create multiple scenarios, and then found more branch flow and exception handling pages. After that, I did not leave enough time to discuss and confirm the wireframe!

However, if the wireframe is not made for everyone to argue and confirm, but only to make it for everyone to look over the transfer, and basically, the wireframe has lost its original value.

Time spent to where?

Not all projects require a wireframe, but if you need a wireframe, you need to allow more time for the wireframe and do not simply assess how much resources are needed from the "look" of the final wireframe output.

Using the number of pages to assess the workload may be suitable for visual designers - based on the premise of determining the visual style of the product.
(The visual designer's resources also need to be divided into two sections, one for exploring and determining the product's style, such as theme color, texture, graphic scale and drawing style, etc. This stage also has a relatively large scope of review and confirmation, so But time will be longer than the visual design of the specific page), front-end engineers can also use the page number and complexity to predict how many days, but for interactive designers, this is a problem. Only interactive designers to discuss the needs clearly, the page flow diagram is good, all kinds of branches to consider the situation clearly, my mind will gradually form the concept of how many pages need to be formed, which pages need a higher single-page interactive design concepts , And when he finished this step, most of the interaction has been done, the rest simply to design each page, occupy the wireframe phase of very little time. More time is spent on what?

Discussion - Review - Discussion - Review - Confirmation

Yes, one of the roles of wireframes is to support the quarrel. The interaction designer needs to confirm the wireframe for many reviews (depending on the project) until everyone has reached a consensus on the wireframe and then The company also needs to test the usability of the wireframe itself to find out more.

80% and 20%

Interaction designers may actually spend 20% of the effort on the production of the wireframe itself, and he thinks it may not be technically technical. The remaining 80% of the energy, used in:

- Understanding and discussion of requirements, "I think this tag appears on the search results page and may not be a reasonable scenario ..." "Why is this feature open only to XXX member types?" After the initial business requirements have been confirmed, The division and product manager are the two roles most closely aligned with each other. They need to refine the business requirements step by step through the implementation of specific pages and functions. The more clearly the demand, the more efficient the later stages will be. At this stage, interaction designers also need to help themselves and the project team understand the product requirements with the help of site maps, page flow, or storyboards.

Sometimes, the workload does not want to look so small, product managers need to do what and why to describe clearly, "what do they do" will also talk about "how to do", but many product managers are not or are not required to go deep Too many solution details, but the interaction designer is different, you must macroscopically to the details, the product of interactive logic to think carefully carefully think carefully, if you do not care about the details, to the project process, but also will certainly be Development engineers chase to supplement the various processes in the page.

- Creative solutions to explore and try, "What happens if I change the way I interact?" "Is there any better way to do that?" "What will happen if you shorten one step?" "It seems like there was once A website uses a more efficient way, I think about it? "All designers have better" traits, "or" problems ", we need to do this self-inspired brainstorming.
From the design point of view, the design itself means that the program screening and validation: Maybe the last designer at the confirmation meeting only gives one or two options, but most designers in their own computer or in the brain tried a lot Program.

Design itself is an exploration of expectations and limitations, and the exploration of the results of the implementation. Interaction designers need to continually focus on needs and expectations, explore and narrow the scope of design with incremental constraints. He did what he should do, he should not pass too many question marks to visual designers, visual designers themselves need to explore and limit, but we also look forward to their talent applied to the brand sense of quality, professional Feeling, emotional design of the exploration, rather than distracted to product logic to think.

- design review and validation, as shown above, designers need to devote a lot of energy in the design review and confirmation. He first freed himself from his brainstorm, screened one or two from several programs, and then called for the needs of stakeholders, stakeholders, other designers, the program needs. Sometimes such confirmation will be held at least three rounds:

The first round of wireframe first review, the basic integrity of the wireframe, with the demand side and technical representatives to discuss on the wireframe, which is not what the business side that the demand side wants, the wireframe to meet business expectations, confirm the overall structure , The definition of the content block on the page, the participation of the technology side can advise on the feasibility, and the preliminary development resource assessment can be conducted according to the wireframe. The second round of wireframe design professional review, so that more designers to participate in the discussion, from the interactive design to give more views. This review complements the first round of review by discussing the design itself in terms of established business needs and selecting the best option. The third round, the wireframe final review, the designer in the first two rounds of comments to assess the wireframe to make some adjustments to launch the third round of confirmation meeting, the commercial side and designer representatives, technical side representatives, and related stakeholders (Such as customer service, sales rep.) Before preaching the design plan again to tell you that this is the final trial, final confirmation, will enter the visual design phase, the time will no longer be easy to adjust the structure and content block definition, so that everyone Pay enough attention and agree on the wireframe.

In these three rounds of reviews, there is a need to intersperse with a number of small-scale discussions, such as feasibility assessment, resource assessment, and product manager to repeatedly discuss the needs and needs behind the significance. It can be said that one of the role of wireframe is to discuss, confirm, quarrel, and then in a number of iterations and confirm, the final dust settles to promote the project to the next step.

The Challenge of Interactive Designers The challenge is not simply how the wireframe itself is specialized, or how fast the wireframe can be made, but rather the need to grasp, mine, and quickly present the full assimilation and management of ideas, Can we let people quickly understand the reasons for understanding the design and background, and agreement on the program.

Do not let controversy, the problem into real implementation, such as visual design, such as development.
Because from the perspective of input-output ratio, the frame quarrel to the wireframe stage, the most efficient and most appropriate.

Not equal to the discussion of business needs, there are many creative people, but not fantasy, facing the business needs of the document, can not make creative brain cells active, we can only nod to the product manager's business plan is , But at the wire-frame stage, specific product prototypes inspire more ideas, so this phase is best suited for a second brainstorming in product development.

Not equal to visual design and development links, wireframe modification is very easy and efficient. And it's purposely so rude that it's trying to present the core needs to everyone, not the product that looks like this.

Because, "look", "feeling" inevitably bring a lot of subjective factors. The same is red, some people think too bright dazzling Some people feel passionate, but precisely in the early stages of product planning, we do not want to pay attention to these details too early, we need to solve the core problem. Visual manuscripts are easy to get caught up in all directions from the outset. Someone is still thinking about whether the product needs to add a new feature or when someone argues whether a feature has enough value or not, has anyone begun to talk about "yellow" or " Red "debatable.

In addition, we have to admit that in the visual design stage, the cost of modification is very high. The visual designer is a masterpiece of every pixel, the change of product positioning may be "drowned" for them, which may mean With a lot of pages to start the design, when the visual design has reached a certain point, the visual designer slowly become a little bit of resistance to "change", who do not like their own children? If a visual designer does not like his child, he may not be a qualified visual designer. But interactivity designers are happy to explore any possibilities on the wireframe, and he will be more tolerant of any thoughts that flow into this phase because he understands that this is an intermediary and does not look like "perfect" Own children

To sum up a few words:
1. Wireframes can help us to specific needs, to introduce more ideas, improve the product;
2. Wireframe can help us sort out ideas, how to do, how to do have a more systematic understanding;
3. Wireframes are easy to create and therefore help us to evaluate and screen in a variety of scenarios;
4 wireframe is used to quarrel, interactive designers need to welcome the quarrel to accommodate a variety of ideas, more importantly, quarrel management.
5.80% of the time is not in the wire-frame diagram, but rather in understanding and discussing needs, brainstorming and trying out various design scenarios, and reviewing and validating designs, but with 80% of the time devoted to leaving the rest 20% more efficient.
6. As an interaction designer, there is room for improvement in that 80%, and many times the remaining 20% ​​is a natural result.

There are a lot of questions about wireframe worth discussing, such as: what stage to start wireframe, wireframe making tools and methods, several different wireframes, etc., but not much discussion. The above part is also welcome to continue to explore.

Source: http: //heidixie.blog.sohu.com/151623325.html