Web design experience-from Microsoft.com design director

Visual China, as design director, Peter Stern has led Microsoft.com to redesign the home page and develop five different interaction tools, these tools are used for online functions such as download center, product directory, configuration file center, search and registration. He designed user interfaces for several internal tools and is working on creating the next-generation homepage to be released later this year. In terms of title, you may think that my main concern is the layout design of thousands of web pages on the Microsoft.com website. Indeed, these are my concerns. Visual attraction is important, but it is only a small part of work. The ultimate goal is to ensure the normal operation of the entire site. I mean, when people access Microsoft.com, they do not regard it as a work of art. In order to obtain information about the product, consult some technical questions, or read the journals related to the developer. Therefore, the website design should be as clear and organized as possible so that they can easily find the required information. Design site In web design-in the design process-the form should be functional. This method is applied to the whole design process of our site. Of course, we have the latest web tools and can upload various visual accessories to the web page. However, we believe that this will not be conducive to providing effective services for visitors. In fact, I often find that some sites do not focus on functions. Common Errors include inconsistent user interface elements. For example, a single control has different functions on different pages, or a single function corresponds to several user interface controls. The navigation bar location is inconsistent. Determine which pages and functions of the site must be accessible on any page of the site. This is the "Global navigation bar" that should be consistent ". Do not pay much attention to or do not pay attention to basic graphic design principles, such as typographical style, color, and layout design. Groups related elements and functions at will. Pay attention to the position and purpose of placing elements on the webpage. This helps visitors infer a link from other adjacent selections and locations. Make the webpage too large so that visitors need to download it over the Internet at a typical modem speed for a long time. This does not mean that images should not be used, but you need to carefully select them and then optimize them with appropriate compression and color indexes. There are still many problems with the current web site, which is not surprising. After all, the art of web design is a new thing. Four or five years ago, web pages were even common. At that time, people seem to think that their web sites will attract visitors only because they exist -- and, in some cases, this method is indeed valid. However, these sites are generally ugly and, more importantly, they are really hard to use. Next, we enter the "let's see what we can do" stage. A large number of animations, sound files, and other attachments are added to the webpage, causing visitors to download the file for a long time, but it does not get much real content. Today's web designers have learned from their predecessors. Good websites tend to be simplified and fast, while improving functions. This is Microsoft's goal, and we acknowledge the mistakes we made first (refer to "A Brief Introduction to Microsoft Web" to see previous homepage designs ). Design errors are not always obvious. Sometimes there is little or no impact on the movement or change of a small element in design. However, in other cases, it may indeed affect the page function. In addition, if we have learned something from the past few years, a small change will make the web page run in a very different way. Clear Process To avoid similar problems, we have designed a clear process for creating new services (such as "Search") or key web pages (such as the home page. Each project starts on a certain basis, that is, we have a product or service that benefits from pages, parts, or user interface elements on our site. In the early stages of product planning (phase 1), I was asked to design some preliminary models: rough sketch of pages, parts, or functions. Then, the product project team checks the product plans and suggestions to see if this service can really bring some benefits to visitors of Microsoft.com. If the answer is "yes", the project will be approved and we will begin to write the project manual (Phase 1 ). We created and proposed a more complete plan based on the sketch and concept of Phase 1. At this point, we generally start usability testing (usually with written models) to learn how potential users will respond to the design in the plan. In the final development phase (phase 1), we created a web prototype for the running plan service and conducted a comprehensive availability test and internal review. Then complete the site code, modify the program error, and finally release the site to the customer through the actually running web site. As you can see, availability plays an important role throughout the process (see "Carefully plan to create an effective web interface "). We can run a task timing for the user, so that we can compare the same test in a later version of the product. We can use this method for measurement to determine whether a feature redesign brings real value to customers. Also, we will take a closer look to see if the availability object can calculate how to use the new feature correctly-what we call "discoverability. Sometimes this provides us with some challenges. For example, if you type a phrase or word in a search engine on our site, a column of results will be generated. Then we ask the user to choose to search in these results for more detailed search and to direct to a certain page or resource. However, even if "search within the range of results" is clearly marked as a dark tag, few people are familiar with it. Some users think they are starting a new search and may have no results. We are working to solve this problem to ensure that customers can use all the rich features on Microsoft.com to improve their understanding of this site. The option "search within the result range" looks intuitive, but is not very easy to find. This problem has always been one of the problems that plague our design. Final Stage In general, site design is the art of balancing conflicting needs. On the one hand, I want to design the site as easy as possible. On the other hand, I want to ensure that all the powerful tools on the site can be used by experienced users. At the same time, I want to serve internal customers-Microsoft product project team-who have special requirements for services. Therefore, every day I have to solve some very difficult problems, which are often in a very pressing situation. I found this kind of work encouraging and interesting. This profession requires more skilled professionals. I got this position after a series of very unusual processes-studying graphics art at the university, designing CD-ROM at a multimedia company, and finally joining Microsoft and developing applications. It is strange that when I applied for (and obtained) this job, I had never designed web pages before. However, my extensive design experience has proved to be very useful, and I think I have proved the motto "A successful design is a successful design" (no matter what media ). Many design problems are unique to the Web, and the solutions to these problems are the same for any media. My advice to prospective web designers is that they should also expand the design background as much as possible. Make sure that some Web jobs are part of the interactive design training today-most good design schools have added them to the course. However, solid technologies in terms of layout, color theory, layout design, and production will be particularly valuable. In the future, web designers will continue to be asked to add richer multimedia content to the page, thus adding a new level of complexity and Technical Requirements for web site visibility and operability. As a CD-ROM/Multimedia Designer, I must have knowledge and creative skills in graphic design, video, audio production, animation and other aspects. My prediction is that web designers will also develop into these fields. It should be a very interesting future for us that belong to Microsoft.com and elsewhere on the Internet. Learn about your audience. Find out who are visiting your site and why they are visiting it. Web users who are new to or occasionally access the Internet have different interests and site needs than software developers. Make your site helpful to visitors. Provide the required information to your audience. Make sure that the navigation elements are consistent and that the areas with the highest hit rate are clearly marked as easy to locate. Use clear messages Make sure that you understand the context of the page and know what you need. If you want the user to enter a name during the registration process, simply put. Don't let visitors calculate what they want, they will feel frustrated, so they go to other simpler sites (such as your competitor's site !). Maintain consistency Although it is not difficult to change the appearance of different web pages, it does not mean that you should do so. Place the main functions, such as returning a link to the "Homepage" or executing a search, in the same location on each page. On Microsoft.com, the black Global Navigation toolbar is located on the more than 0.4 million page. Make site available Remember to design and test site availability. Make sure that you can easily execute tasks to obtain the required information. Estimate the task time and task completion rate, and then strive to improve. If the new design is not improved in these aspects, do not implement it. Start from the sketch (or initial plan) and try other methods. Keep concise It is easy to say. Ask for feedback. Sometimes newcomers can easily find a solution. Try something new Don't be afraid to break the Regular Expression and try something completely different. If you do not try it, you will never find the real answer. -- Microsoft Peter