Design And Implementation Of Web Page Generation System Based On Deep Learning

With the rapid development of the Internet and HTML5 technologies,Web applications have become more and more occupied in the entire Internet and software market.At the same time,Web applications need not only good functionality and performance,but also beautiful interfaces,which is more and more valued by users and developers.The development model of front-end and back-end separation has been widely adopted,and the front-end technology has developed accordingly.Thus,the complexity and maintenance costs of Web applications are also increasing.However,the front-end development process is full of simple but repetitive and tedious work,how to complete the conversion from the front-end page prototype into a corresponding website layout quickly has always been a concern of front-end developers.On the other hand,as an important branch of artificial intelligence,deep learning has gained extensive attention from both academia and industry,and has developed rapidly.Gradually,it has been used in more and more industries,and more and more people can feel the changes brought by AI in their real lifes.Computer code generation is also an active research field.However,how to generate computer code from images using deep learning neural network is still a field that nearly has not been explored,and its application in automation front-end development is also rarely involved.In this paper,we designed and implemented a Web page generation system that based on deep learning.The main work can be divided into two parts.The first part is the research,design and implementation of HTML code generation model based on deep learning.In this part,a neural network is trained by deep learning method.It can automatically generate corresponding HTML code from the input Graphical User Interface(GUI)prototype,with a BLUE score of 0.81.Meanwhile,we constructed the data set used to train the model,which contains 15382 GUI prototype and their corresponding source code.In the second part,we designed and implemented a visualized web page layout system.This system applies the neural network trained in the first work part and provide users with the service of importing the GUI prototype to get the HTML code,and allows the user to modify the Web page layout by dragging and dropping components,etc.,finally generate the complete available HTML code.The Web page generation system implemented in this paper innovatively applies deep learning to the front-end development field.Combining with visual layout function,it effectively shortens the transformation time from GUI prototype to Web pages,and reduces the tedious and repetitive work in front-end development,which enables developers to spend more time on page interaction and function realization work of Web application.