The project manager said: "Today we are going to implement a news management function, and the users are editors." lt;–News management is a big goal. Then it says: "Users can publish, edit, delete, copy, and transfer." lt;-Publish, edit, delete, copy, transfer these are small goals. .........So what is everyone paying attention to? How to do it? What is the product? Who is the communication partner? 1. Web interaction designers focus on: data, operations, business processes, product vision, target market, expectations, usability, ease of use, etc. Ideas: available-gt; easy-to-use-gt; like to use-gt; brand data: data analysis, organization, and refinement into information architecture. Concise, readable, semantic, consistent in expression, less is more. Operation: Set user goals and refine operational function points. Process: streamlined, smooth, pleasant, and logically rigorous. Operation process: Formulating user roles (market research), demand analysis (refining data and converting it into information architecture), functional design (functional specification document), task analysis (formulating tasks based on data and functions, and ultimately achieving user goals through the completion of multiple tasks) ), process design (formulate operating procedures), scenario analysis, navigation design (navigation is the road sign of a site, the escape door after getting lost, a good navigation can let users know the purpose of the website, what content it contains, etc. ), structural design (converting data and function points into operable interfaces), product prototype design (wireframe prototypes and HTML CSS static text prototypes), storyboard design (simulating interface interactions, imagining yourself as a virtual user character) Complete the entire interaction scenario and experience whether the entire process is smooth, whether the data is concise, useful to the target users, and whether the data expression is clear), improve user experience, and enhance product quality. Products: sitemap (website map is information architecture), functional specification documents, flow charts, usecases, medium and low-precision wireframes, and storyboards. Main communication targets: visual designers, software development engineers. How to do it? During the meeting: Two necessities: pen and notebook. Purpose: taking notes. A good memory is worse than a bad pen. How to remember? Remember the user's expectations, goals, and related operations and data involved in achieving a certain goal. (Of course, remember key words) After the meeting: analysis, organization and discussion. 2. Web visual designers focus on: product type? user? Product type and users are directly related to the color (color), type (shape), spirit (soul), meaning (intention), etc. of product design. 01 Color Color is the first element of emotional communication and sensibility. Everyone’s perception of color is different. It is difficult to reconcile the opinions of the masses, so we can only cater to the tastes of the masses and abandon the niche. Theme expressed: Coldness? Passion? Quiet? ...so I learned to choose cool, warm or neutral colors. Tip: Find a picture of a natural scene, mosaic it, and refine the colors. The colors of nature are always the most harmonious. Brand: Carbonated drinks, when we think of red, we think of Coca-Cola. When we think of blue, we think of Pepsi. 02 Shape points: size of points, distance between points, comparison between points. Line: straight line (solemn and upright), horizontal line (comfortable and calm), curved line (elegant and dynamic). Noodles: rectangular (hard), oval (gentle), round (tender) point-gt; line-gt; noodle brand: fast food, when we think of the white-haired grandpa, we think of KFC. When we think of red-haired clowns, we think of McDonald's. 03 Soul Every design has its own soul. 04 Intention: What does this design want to express to users? Shopping? news? Make friends... Operation process: user details-gt; theme definition-gt; color definition-gt; shape definition-gt; image selection-gt; image acquisition-gt; Icon design-gt; optimization details-gt; Styleguide writing. Products: visual draft PSD source files, Styleguide documents. Main communication objects: interaction designers, front-end development engineers. 3. Web front-end development engineers focus on: structure layer (HTML), presentation layer (CSS), and behavior layer (JS or AS).

In the traditional sense, visual designers and development engineers cannot have a more professional and unique understanding of interface interaction and implementation. Structural layer: Focus on the architecture of HTML, pursuing code semantics, reusability, modularization, and standardization. Semantic and standardized naming. Presentation layer: Focus on CSS rendering and pursue visual consistency (compatible with multiple mainstream browsers and cross-platforms, testing the usability and accessibility of DEMO). Behavioral layer: Focus on JS or AS to interact with users. Pursue behavioral consistency, optimize code to speed up downloads, reduce the number of requests to speed up the server's response cycle, standardize SEO at the entire code level to improve search engine inclusion, etc. The entire product experience should be pleasant and hassle-free. Operation process: analyze the design draft-gt; formulate naming rules-gt; define public styles and private styles-gt; define file distribution-gt; cut pictures (optimize picture size and ensure picture quality)-gt; merge related pictures (reduce Number of requests, reduce server load) -gt; write HTLM and CSS and conduct multi-browser testing -gt; write CSS hack if necessary -gt; write JS products: HTML CSS JS/AS, slicing Main communication objects: visual designers , software development engineer. The Internet is a platform, user research and interaction design are theoretical methods, and visual design and front-end technology development are means. Service providers use the Internet as a large platform to use analytical data, theoretical methods, visual design and front-end technology development provided by user research and interaction design as means to achieve user goals and meet user expectations. This is my understanding of the user experience process.