So far, a typical web development project normally entails a Web Designer to sketch the layout and then specific elements of the website on visual graphic tools, such as Photoshop, Figma, Invision, Sketch, etc.; after that a web developer is responsible for converting the mockup into HTML webpages and handling the data logic behind. Does that sound familiar for you?
Well… the process as we know it (or, as we USED to know it) is no longer prevailing. Artificial Intelligence (AI) has massively invaded the space of web development, imposing serious threat to put web designers and developers out of their jobs. Let’s explore the capabilities AI has obtained that could put multiple manual processes, which were once believed to be very “human”, to be at the verge of being completely automated.
AI to replace web developers
Sometimes a web developer also creates the UI for the website, but normally web developers are mostly responsible for two categories of work, depending on the role classification:
- Front-end developers: manages everything that users visually see in their browsers or applications.
- Back-end developers: handles the communication between the server (database) and the browser.
Front-end developers are ironically at the front line of being replaced by machine. The idea of code being automatically generated from a GUI screenshot or wireframe, without the labor from developers, has emerged in recent years. This concept is believed to have rooted from a 2017 Cornell University paper pix2code by Tony Beltramelli. Also in this period, AirBnB went a step further by developing sketch2code, an AI that convert hand-drawing sketches with low fidelity into fully responsive front-end code. The former claimed an accuracy of over 77% while the latter is being widely in use already. Many other platforms have been emerging subsequently.
These AI systems are built on the same philosophy: Machine learning. Basically, a machine’s learning algorithm enables it to identify patterns in a set of observed data, build models that explain the world, and predict things without having explicit pre-programmed rules and models.
In the case of the aforementioned AI systems, the training data would be:
- Visuals representing a rendered website, such as mockups/wireframes in the case of pix2code, and hand-drawn sketches for sketch2code
- The code built by human corresponding to those visuals
With millions of websites that have already been built across the internet, the learning data is abundant. Machine learning enables these AI systems to predict patterns in which images feed is translated into code, and apply these patterns for future cases not yet included in the learning data. After these build, train, and deploy steps, coding the front-end of websites is now confined within 3 steps:
- Provide the design visuals to the trained neural network, whether it be hand sketches, wireframes, or mockups, depending on what the network used as the learning data
- The neural network automatically converts the visual into code
- Output is rendered
(Readmore: Will AI Become The End Of Code?)
AI to replace web designers
Converting designs into a batch of HTML and CSS code is only the latter half of the web development cycle. Now AI is also taking over the former half. Or the entire web development.
Website building tools requiring no more than the website content have already come into practice. For years, a person who does not have the capability to write a single line of code could set up their own website, in their own preferences, error-free. However, the underlying problem with these tools is that, the website templates are limited to some extent, resulting in many websites sharing relatively similar appearance.
This is where AI comes into play. Based on the user’s style and preference inputs, the systems usually predict matching patterns in terms of color palette, web layout, element styles, etc., and mix up to create limitless permutations. One-stop-shop web building platforms such as Wix or Bookmark have rendered both web developers and designers nonessential, thanks to the ability to set up websites in few minutes with various customization options. This kind of technology is regularly referred to as “Artificial design intelligence”.
All that is left to you cracks down into providing the website content and uploading the visuals. (but who knows, AI is already able of composing music, creating paintings, and responding to human beyond recognition – maybe someday AI will handle these).
It is no doubt that AI is benefiting web development in multiple ways:
- It saves developers the tedious job of converting designs into code
- It can build up websites in much shorter timespans than traditional development
- It is a highly economical option for those who need a website. The costs for mentioned platforms such as Wix is $11 - $35, compared to a traditional development project involving multiple parties that range somewhere between a few hundreds to thousands.
- It minimizes human errors, such as front-end bugs or responsive bugs which have been inevitable in most development projects
- It can be mass applied
However, whether to delegate everything to AI is still a controversial matter, as Stephen Hawking has anticipated: “It could be the best thing to happen to our society or the worst. We just don’t know! It could be the worst event in the history of our civilization”.
Interested in more technology readings? Click here to explore!
- Turning Design Mockups Into Code With Deep Learning [Link]
- pix2code: Generating Code from a Graphical User Interface Screenshot [Link]
- Application of Deep Learning in Front-end Web Development (HTML + CSS) [Link]
- What Is Deep Learning? 3 things you need to know [Link]
- Machine Learning for Humans [Link]
- The Role Of Artificial Intelligence In Web Development [Link]
- AI is Taking Peoples’ Jobs - Are Developers Next? [Link]