BCP Social Sciences & Humanities ERSS 2022 Volume 20 (2022) 535 Application Analysis and Research of Artificial Intelligence Technology in the Creative Stage of Web Design Wei Huanga, Pengrui Yangb School of Hubei, Hubei University, Wuhan 430000, China a838777301@qq.com, b107677804@qq.com Abstract. The creative stage is an important part of the overall planning of web design. To study the application of artificial intelligence technology in the creative stage of web design, and analyze the development prospect of web design under the influence of AI technology. Review the history of web design and understand the traditional web design patterns. This paper DISCUSSES the significance THAT ARTIFICIAL INTELLIGENCE technology BRINGS TO the creative stage of WEB design, and researches the application in different directions based on the significance. The application of artificial intelligence technology has changed the design and thinking mode of web design in the creative stage. We should correctly understand the changes and effects brought by AI technology, master scientific methods and innovate design thinking. In the future, web design based on artificial intelligence technology will have more remarkable development. Keywords: Artificial Intelligence Technology; Creative Stage of Web Design; The Application. 1. Introduction With the continuous development of virtual reality concepts such as the Internet, big data, the Internet of Things, and the currently popular metaverse, artificial intelligence technology is causing chain reaction scientific breakthroughs. It is regarded as the core force of the new round of industrial revolution and the key engine to promote social development. "The power of computers is growing, algorithms and artificial intelligence models are becoming increasingly complex, and the world is generating a once unimaginable amount of energy, with billions of gigabit networked devices every day, from networked sensors to turbine sensors," the McKinsey AI research report said. The State also attaches great importance to the development of AI technology. In July 2017, The State Council issued and implemented the "Development Plan for the New Generation of Artificial Intelligence" [1], which aims to occupy the strategic position of artificial intelligence, build theoretical and practical advantages, and accelerate the goal of building a scientific and technological power. The country has given strong support to artificial intelligence, and our country will step into the "artificial intelligence era" gradually. Figure 1. Web Design basic development process BCP Social Sciences & Humanities ERSS 2022 Volume 20 (2022) 536 In the field of web design, artificial intelligence is reconstructed to design many link, in collaborative design, user experience, large data interface and visual system part, AI for obvious impact on web design (figure 1), this influence both the production efficiency and play a positive role in the commercial value, This force makes the whole web design market completely new, which will give rise to many new intelligent requirements, and also give rise to many new theories, new models, new products, new methods and new business forms. In the future, traditional web design patterns will shift to new ones that are more efficient and intelligent. 2. Development of Web Design based on HTML Language Before we talk about web design today, let's go back to 1989, when the World Wide Web was created by Al Groe. Tim Berners-Lee created the WWW using the NeXTSTEP operating system. When Tim Berners-Lee founded the world's first Hypertext Markup Language (HTML) website at CERN in 1991 (Figure 2), the design rules did not change. Computer technology was new, and the design logic of the World Wide Web was relatively simple. When creating a website, because it was purely for the researchers of the day, design considerations were often secondary, with sans serif fonts, plain white backgrounds, and blue links to highlight clickable text. In fact, these design elements are still used today. When we want to visit different websites, we can use browser tools like Google Chrome and Internet Explorer. But the first web browser, Netscape, was created by Jim Clark and Marc Andreessen in 1994. In the mid-1990s, with the development of technology and the creation of more and more Web sites based on hypertext markup language, HTML began to fail. Since then, cascading style Sheets (CSS), a new programming language developed by Hakon Wium Lie, appeared on the stage of history. By the late 1990s, a large number of companies began to create their own websites, and with the spread of computer technology, the demand for unique web design increased. Macromedia Flash -- we now call it Adobe Flash (Figure 3) was born. What started as very basic tools and timelines grew into a powerful tool for developing a full Web site. Flash provides a lot more web presentation than HTML. This is an important moment for web designers, meaning that website owners can add high quality graphics, interactive actions, and audio to their sites. At the turn of the millennium, the development of CSS technology revolutionized web design, where page elements were manipulated from stylesheets rather than the HTML code of the page. By 2004, as the Web became more popular, the first social networking sites appeared: Myspace and Facebook, created by Harvard students. This means that web designers need to excel in a more innovative way and help users jump from site to site. In 2007, Steve Jobs announced that Flash would no longer be supported in new products, indicating that from this point on, the era of Flash-based domination is over. Today, with the development of portable smart products, mobile devices account for 60% of the world's web page views, which means that web design needs to consider the interface layout of mobile device users and create responsive designs. Determining which elements are critical to the performance of a particular site is now critical for web design, since those elements will eventually be displayed on mobile devices. In today's era of rapid technological development, hardly a month goes by without the introduction of new technologies and concepts that influence the visual layout and interaction ideas of web design. The mature application of intelligent science makes the design process have a deconstructive change from the auxiliary design mode to the deep integration mode of intelligent technology and design. New concept tools for web design such as Sketch2Code, Watson Assistant, etc. No one knows how the next cutting-edge technology will affect web design. In the future, we may see augmented virtual reality, more intelligent or more personalized design in web design. But it all started with a simple HTML site. BCP Social Sciences & Humanities ERSS 2022 Volume 20 (2022) 537 Figure 2. The world's first HTML website Figure 3. Early Flash pages 3. The Significance of Using Artificial Intelligence Technology in the Creative Stage of Web Design 3.1 Operational Advantages At present, the artificial intelligence technology in the creative stage of web design still belongs to the stage of mental retardation. It cannot possess the subjective ability of human beings: inspiration, feeling and feeling, as well as the ability of cross-domain reasoning and abstract analogy. It can only rely on data and experience to create or solve problems. But AI has four advantages over humans: A. It can perform extremely complex calculations in a very short time; b. can do the same thing for a long time without getting tired; c. good memory, accumulated experience can be called at any time; d. No emotion and other subjective factors, fairer and objective than human treatment of each program. These four advantages enable the computer to continuously explore new solutions, accumulate experience, optimize solutions, and find out the best solution through exhaustive analysis and comparison when solving super-complex pure intelligence problems. As the experience of artificial intelligence in different fields increases, its insight into the relationship between things will gradually improve, and it will constantly feedback and improve its ability to solve problems. When the computational power, analytical ability and insight of artificial intelligence exceed that of human beings, artificial intelligence will provide better solutions than human beings in many fields. 3.2 More Perfect User Experience Design Artificial intelligence opens up new possibilities for personalization, and the way to design a friendlier, more human-like product is to mimic human expression. Communication between people is divided into two-way communication and one-way communication. Two-way communication includes questions and answers, and one-way communication includes instructions, statements and receiving information. Asking is not quite the same as instructing. Ask because you don't know and expect the other person to provide a complete answer. Instruction refers to the instruction from the superior to the subordinate. He knows what the other party can do and hopes that the other party can help him finish the task. The feedback from the other party may be very simple. Presentation means that I give you information and you don't have to give me feedback, such as speech, lecture, presentation, etc. Receiving information includes hearing, sight, touch, and even smell and taste. In web design, designers can add artificial intelligence programs to web pages to achieve good user experience. 4. Application of Artificial Intelligence Technology in the Creative Stage of Web Design 4.1 Application of Intelligent Transformation of Web Prototype Graph The characteristics of deep learning, open intelligence and man-machine collaboration of artificial intelligence have brought many changes to the design process, method and object [2]. In the field of BCP Social Sciences & Humanities ERSS 2022 Volume 20 (2022) 538 web design, deep collaboration between human and machine intelligence will be the main mode of artificial intelligence participating in the design process. Thegrid is one of the earliest examples of collaboration between artificial intelligence technology and web design. Is a website building tool, the use of artificial intelligence technology, can automatically create a new website according to the content provided by users, and with little time and cost to build a beautiful website. Then some design explorers took AI and Web design to a whole new level. Companies such as Adobe, Firedrop, Bookmark, Squarespace, Wix, and Tailor Brands are among the leading technology companies using AI in web design. Artificial intelligence can be used to transform a hand-written user interface from a simple picture to a valid HTML markup code that can maintain itself. Ai technology routinely controls the overall content of Web design, from visual elements and typography to animation and other graphical information. For example, Sketch2Code[3] uses artificial intelligence to convert handwritten drawings into working HTML prototypes (Figure 4). Designers share ideas in the manuscript and then translate them into the browser through Sketch2Code. Sketch2Code views computer vision as the internal discipline of artificial intelligence technology, which enables an application to see and understand what it sees. It uses Microsoft Cognition Services to train custom computer vision with millions of images and enable object detection for various types of objects. The model is trained to recognize hand-drawn web design elements, such as text boxes or buttons. Text recognition functions existing in computer vision services are used to extract handwritten text present in the design, and HTML fragments of different elements in the design are generated by combining design elements and extracted content. Finally, the layout of the design is inferred from the locations of the identified elements and the final HTML code is generated (Figure 5). Artificial intelligence technology is reshaping the way websites are developed today, with many web designers using integrated AI technology to build intelligent web applications that improve the scalability, interactivity, physicality, and overall feel of their websites. Figure 4. Sketch to prototype Figure 5. Sketch2Code working framework BCP Social Sciences & Humanities ERSS 2022 Volume 20 (2022) 539 4.2 Expanded Application of Interactive Thinking Computer vision and machine language interaction are relatively mature branch technologies in the field of AI. For example, face recognition has been fully applied in mobile payment, information security and other fields. Intelligent voice interaction also plays an important role in people's lives. Apple's intelligent voice assistant (Siri) can help users find information, make calls, send messages, get directions, play music, find Apple devices and so on through their mobile phones. In addition, human emotion capture technology tries to make design products not only capture people's emotions, but also analyze users' needs and goals, so that people can experience the interaction actions of the real world in the virtual world and form a more harmonious human-machine environment [4]. In Yanmin Xue and Yu's Dai research on PAD emotional experience of web design elements (PAD is emotional state space model, where P is element joy, A is activation, and D is dominance), bright colors and pictures, color contrast, and clarity and contrast between web elements can improve the values of A and P. However, excessive color contrast will make users give up browsing, which loses its original function [5]. Typesetting and design in line with the law of visual perception have A great influence on D. The color saturation of fonts is relatively gray, and the spacing between paragraphs and fonts and lines is too large, which will increase the values of P and D. Reasonably laid out picture elements will have a positive influence on A, and pictures with certain meaning and text information will increase D. Using scientific experimental methods, we can know that the color contrast in a web page, the layout design between text and pictures will affect the perception of web users, so as to influence the thinking judgment of visitors (close or continue browsing). Visual presentation is a key element that affects user experience. On the interaction level, artificial intelligence has effectively changed the face of modern web design and rapidly established new functions of human-computer interaction [6]. The most obvious is the improvement of artificial intelligence virtual assistants, which are used by most websites or mobile apps. With advanced AI algorithms and sophisticated machine learning programs, artificial intelligence is effectively bridging the gap between human cognition and machine automation. This will change the structure and organization of traditional web design and have a huge impact on the way visitors interact with the site. Based on artificial intelligence technology, it redefines the meaning of communication, which is similar to the effect of communication between people, thus replacing the previous needs of fixed and set dialogue procedures in advance. Today's intelligent virtual assistants are based on advanced natural language processing (NLP) systems, which generate personally-meaningful conversations that are better at engaging users. For example, the intelligent chatbot Assistant of IBM's Watson Assistant[7] (FIG. 6), which is a conversational AI platform based on deep learning, machine learning and NLP model construction, can understand questions, find or search for the best answer, and complete the user's expected actions. Watson also uses intent classification and entity recognition to better context-wise understand customers and problems and hand them off to human service when needed. Figure 6. Watson Assistant website page and application practices 4.3 Intelligent Application of Interface Design Web interface design should belong to a part of visual communication design, therefore, pictures, text, color is the core part of web interface design. In traditional Web interface design, these elements BCP Social Sciences & Humanities ERSS 2022 Volume 20 (2022) 540 need to be artistically processed and typographically designed, and the design intention is presented to users in a visual way. In addition to these explicit interface elements, interface structure layout, visual flow and other contents are also indispensable parts of visual communication design, which are hidden interface information [8]. Through the artificial intelligence technology of autonomous intelligence and deep learning, the web interface is optimized and improved, and the AI can make decisions on the design objects by itself. It starts with a human training program to understand the principles of visual design and allows you to find examples of ready-made websites to work with. By combining these two parts, an AI trained in debugging can mimic a designer's ideas and produce a functional web design that looks like a basic visual aesthetic. For example, Wix[9] and other pioneering web design companies use artificial intelligence development platform to manage visual page design. The working principle of Wix artificial intelligence algorithm is to screen out tens of millions of combinations to design and build a unique design interface with complete user selection. And because artificial intelligence has been trained on this part, it will design deep learning and custom websites according to user requirements, business scope and interaction. (Figure 7) Wix and a series of web design tools based on artificial intelligence technology have lowered the operational threshold in this field of design. Duchamp's concept that "everyone is a designer" may not be an empty talk in the future field of web design. The lowering of the skill threshold will force web designers to return to visual design itself, that is, thinking about pictures, colors and text, exploring design theory, and searching for the intersection of technology and art. Wix website page and some functional pages (a) Figure 7. Wix Intelligent Web page reference interface (b) 4.4 Application of Diagnostic Tools for Web Design The rational use of artificial intelligence technology can enhance visual design and user experience in web design, and it can also become a diagnostic system in web design. With the development of modern web design, changing styles, and more stringent search engine standards, the quality of web design has become the ultimate determinant of traffic success. But in addition to high quality design results, you must also ensure that you maintain the maintainability of your design by running tests regularly. In traditional web design, as these tests are repeated, the source code is modified, which further burdens the process. Not only are these tests time consuming, they often take a significant toll on website performance. In this case, in order to achieve stable web quality, the web designer's innovative design power in the creative stage is sacrificed. Analysis tools based on AI technology can assess design quality, observe their performance in real time, and get intelligent recommendations on how to improve them. With AI-based diagnostic tools, BCP Social Sciences & Humanities ERSS 2022 Volume 20 (2022) 541 the need for A/B testing can be effectively eliminated and better site design results can be obtained. As designing software becomes more and more complex, the final product often faces many challenges. Systems of tools and programs based on AI technology can be used to develop and test different types of information, verify its authenticity and examine its potential range without any human input. If AI is trained in human learning, it can eliminate a lot of the procedures that must be involved in creating, diagnosing, or editing a design. For example, Applitools[10] can be used to test the visual code of a website, track web page behavior and enhance web page aesthetics. 5. Development Prospect of Web Design based on Artificial Intelligence Technology The designers of the British Arts and Crafts movement have always been hostile to industrialization. They opposed industrialization and hoped to restore the tradition of handicraft, but eventually succumbed to reality under the rolling wheels of the machine. Reflecting on contemporary times, the development of artificial intelligence is like a flood. Yang Xuyong, MeiTao [11], such as the artificial intelligence technology is used in the design of the graphic layout, to format the layout, color theme and visual weight, word semantics, design principles, such as cognitive understanding of design knowledge and experience, in unity within the framework of intelligence operations, and build on the basis of design theme template library, in after the user to enter data and text statements subject, Automatic design of text and text content (Figure 8). Alibaba Group's Luban Intelligent Design system was able to generate nearly 100 million web ads with comparable design aesthetics at a rate of 8,000 images per second (Figure 9). With just a few simple questions to answer, Wix ADI will instantly build us a personalized website, complete with custom text and images. You can define your own style, change the layout, and add any functionality you need in your business. When it is ready, it can go online. According to the current development trend and technical achievements, artificial intelligence technology is becoming more and more important in web design. Advanced computer technology, the ever-increasing demand for automation, and a vast amount of theoretical knowledge have allowed us to achieve an exponential increase in the number of technologies for artificial intelligence. While the technology may be in its infancy, AI's infinite potential to understand the rules of the game and use them independently in numerous design products will soon eclipse traditional Web design approaches. In the future, AI will soon offer websites that use adaptive intelligence to provide a personalized user experience, rather than a cookie-cutter template. As web designers who are "people" rather than machines, we need not be afraid of this power. Although artificial intelligence technology has brought great changes to the production mode of design and improved the development of productivity, it still has some drawbacks. AI still lacks rationality and logic. This critical ability enables humans to understand the audience to which they are catering, and to define and distinguish each of them. But A.I. still lacks that instinct. A.I. doesn't evolve with experience. Designers grow and expand their experience and wisdom with each task they complete. Artificial intelligence currently lacks such intelligence and needs human brains to keep up to date. And while AI is still one-dimensional, a reverse-engineering tool for data, "people," as designers, are more complex creatures. They understand emotions and emotions, phenomena that the world's most advanced psychologists still cannot define, and they possess spatial and visual intelligence as well as linguistic and linguistic knowledge. Regardless of the rapid advances in deep learning capabilities, whether artificial intelligence can experience emotions is a controversial topic. Instead of fighting AI, let's think: "How can AI help human designers do things they couldn't do before and open up new areas of design?" BCP Social Sciences & Humanities ERSS 2022 Volume 20 (2022) 542 Figure 8. Application of artificial intelligence technology in graphic layout Figure 9. Luban Intelligent Design System 6. Summary Artificial intelligence technology has a profound impact on the design methods, processes and objects of web pages. In the field of web design, it has the characteristics of deep learning, intelligent opening and man-machine collaboration. Traditional web design methods will gradually withdraw from the market. Explore and use the advantages of new technology, correctly understand the changes and effects brought by AI technology, master scientific methods, innovative design thinking, in the future, web design based on artificial intelligence technology will have a more remarkable development. References [1] The State Council: Development Plan for the New Generation of Artificial Intelligence [DB/OL], 2017- 08-24. [2] Hu Jie; Innovative Design Thinking in the Era of Artificial Intelligence [J] Decoration, Vol. 319, 2019.11. [3] https://sketch2code.azurewebsites.net/. [4] Xue Chengqi, Wang Linlin; A Review of Human-computer Fusion Interaction in Intelligent human- computer Systems [J], Packaging Engineering, Vol. 42, No. 20, October 2021. [5] Xue Yan, Dai Yu; Research on the Influence of Web Design Elements on Emotional Experience of PAD [J], Decoration, 298, 2018 02. BCP Social Sciences & Humanities ERSS 2022 Volume 20 (2022) 543 [6] Visual Experience of Network Interaction Design and Design Evaluation of Visual Elements [J]. Shanxi Youth, No. 06, 2022. [7] https://www.ibm.com/products/watson-assistant. [8] Wang Yan. Research on Interactive Information Design [D], Changsha: Central South University, 2012. [9] https://zh.wix.com/. [10] https://applitools.com/. [11] YANG Xu-yong. Automatic Generation of Visual-textual Presentation Layout[J]. ACM Transactions on Multimedia Computing, 2016, 12(2): 33.