1、 Pretreatment process

要让网站能在同类产品中脱颖而出，就一定要设计独特，且能够传递出全新的服务和远景。这就需要设计师针对用户和市场进行研究和探索，利用色彩和形状等元素作为设计的突破口，通过寻求不同的组合方式，完成整个设计。

To make the website stand out in similar products, it must be unique in design and be able to deliver a new service and vision. This requires designers to research and explore for users and the market, using color, shape and other elements as a breakthrough in the design, by seeking different combinations to complete the whole design.

二、草稿和线框图

2、 Drafts and wireframes

在设计初期，设计师可以构建几个简单的布局，每种布局都有着不同的侧重点和优势。然后，将不同的构思和不同的部分构建成独立的页面，通过分析和研究用户的注意力主要集中的哪些信息。由于整体结构不用包含很多元素，所以只需要绘制大概的线框图就可以。通过手绘的方法呈现脑中的构思，可以帮助设计师更好地琢磨和研究整个网页设计。

In the early stage of design, designers can build several simple layouts, each with different emphasis and advantages. Then, different ideas and different parts are built into independent pages, through the analysis and research of which information the user's attention focuses on. Because the overall structure does not contain many elements, it only needs to draw a general wireframe. Through the hand-painted method to present ideas in the mind, designers can better ponder and study the whole web design.

三、UI设计

3、 UI design

接下来就是网页设计中关键的过程——UI设计。UI设计部分我们会着重看看首屏设计，因为首页是与用户互动密切的页面。

Next is the key process of web design UI design. In the UI design part, we will focus on the first screen design, because the home page is closely interactive with users.

首屏设计需要包含公司名称、Slogan和引动用户向下滚动浏览的箭头，另外我们还可以为搭配色彩明亮、引人瞩目的背景(这主要是根据网站的定位和方向而定)。其次，我们可以采用几何图形、渐变色彩、动效设计等，营造出丰富的层次感，使画面变得更加生动有趣。

The first screen design needs to include the company name, slogan and the arrow that moves the user to scroll down. In addition, we can also match the bright and eye-catching background (mainly depending on the positioning and direction of the website). Secondly, we can use geometric graphics, gradient color, dynamic effect design to create a rich sense of hierarchy, so that the picture becomes more vivid and interesting.

四、色彩的选取

4、 Color selection

色彩的选取是整个设计中有趣的部分，设计师可以根据和需求确定几种不同的配色方案，在其中挑选出对比度和协调度较高的组合。然后在具体的顺序和搭配上玩出多种花样，制作出能一下子就吸引用户眼球的色彩搭配，但这需要持续地尝试和探索，才能成功。

Color selection is an interesting part of the whole design. Designers can determine several different color schemes according to the brand and demand, and select the combination with higher contrast and coordination. Then in the specific order and collocation to play a variety of patterns, to make a color match that can attract the user's attention at once, but it needs to continue to try and explore, in order to succeed.

五、添加动画效果

5、 Add animation

网站添加动画效果，能让各种元素之间的互动和联系变得更加自然。一个优秀的动效设计，能让产品变得更加友好，更容易抓住用户的眼球，而且还不会让用户分心。

Adding animation to the website can make the interaction and connection between various elements more natural. An excellent dynamic design can make the product more friendly, easier to catch the eyes of users, and will not distract users.

在网页设计中，每个网页设计师都希望能够设计出能一下子抓取用户眼球的网页，奈何当网站出来的时候，总觉得差那么一点点。要想设计出好的网页，不妨从以上几种方法入手，或许你会有意想不到的收获。

In web design, every web designer hopes to design a web page that can catch the eyes of users all at once, but when the website comes out, it always feels a little worse. If you want to design a good web page, you might as well start with the above methods. Maybe you will get unexpected results.