From handicraft design to graphic design to web design, although the design principles remain the same, my experience tells me that the change of design media brings many special features of the media itself. Here are some key points of website visual design, based on other people's experience and my own experience: 1— Logo: basic logo features, in line with the basics of logo design (common to graphic design) Display effect: clarity, minimum size (due to display resolution, equivalent to the printing effect of offline graphic design) 2— Text: The content level determines the font, size, and thickness; the status determines the color (default or unified according to the website) 3— Advertisements and content images: positioning of size and style, harmony on the same page, image optimization, position rhythm, and size comparison. 4— Icon: brand, accurate and reasonable expression, design technique (based on brand), consistency, function: attractive, eye-catching, easy to identify, understand, operate and remember. 5— Clickable (button): difference (not clickable), based on people’s life experience: thickness, clickable, texture (physical association), color (brand, unity, contrast); uniform style size (based on the uniform inner margin of the text) 6— Background image: atmosphere creation, consistency with the product, optimization (quality, size, color information, implementation plan), 7— Graphic and text layout: main image and secondary text, graphic and text rhythm, gaps, and modularization. 8— Current status: enlarge (shape), change color (invert, contrast, brightness and purity), specify content prompts after linking in and out. 9— Interactive controls: reasonable and accurate style (people’s default perception of the system and their daily routine), state (optimization of visual expression style and action process), and creativity. 10— loading: content relevance (content relevance before and after loading), the fun of boring waiting, volume and area optimization, creativity. 11— User feedback_success, error, prompt, no result: copywriting (clear, reasonable, humanized, creative), graphics (clear, eye-catching, psychological cognitive accuracy of color). 12— Animation effect: reasonable process (rationalization of simulating real environment), continuity, sense of rhythm, performance of user's daily actions, coordination of sound effects, and creativity. 13— Beginning and end design: Beginning (brand promotion, own characteristics, clear content, atmosphere expression, creativity. End: echo, rhythm (with the beginning), creativity. 14— Adaptive screen design (full screen design): Consideration of the largest and smallest screens (position of text and pictures, line break effects) 15— Fixed-size grid design: reasonable cells (considering the golden ratio), cell area rhythm, and uniform margins 16— Demo design draft: the most and least consideration of content. 17 —Page: Brand, consistency of keynote elements, reusability, sense of rhythm and area, visual attraction, guiding browsing, relationship between points, lines and surfaces, sketching principles (using the basic rules of sketching to create pages). 18 —Reading: The comfort of the background for reading (vision), the contrast comfort between the content and the background. In fact, there are many other design points, such as interaction design and code design. We can show these to users. To sum up, they constitute a large process of user experience design. Many times when we are doing it, we cannot estimate every point, so we summarize them to help review at any time! |
<<: Detailed explanation of MySQL database tens of millions of data query and storage
>>: How to set the text in the select drop-down menu to scroll left and right
Adding indexes can improve query efficiency. Addi...
yum or rpm? The yum installation method is very c...
Table of contents TypeScript environment construc...
Table of contents Pull a centos image Generate ng...
Table of contents 1. Introduction to autofs servi...
The implementation of expanding and collapsing li...
Recently I want to use native JS to implement som...
Table of contents Preface: 1. Introduction to rol...
Purpose Encapsulate the carousel component and us...
GNU Parallel is a shell tool for executing comput...
This article uses examples to explain the princip...
Sometimes the input box is small, and you want to...
Let’s take a look at the panoramic view effect: D...
1. WebDesignerWall 2. Veerle's Blog 3. Tutori...
Preface MySQL 8.0.13 began to support index skip ...