HTML5: Transforming Digital Art

-Originally posted on TINC Magazine-

Emily Morris

While paint, canvas and brushes have largely stayed the same over the past few centuries, the Internet offers dynamic, cutting-edge tools to create digital art. HTML5 is one such evolution of new media.

HTML5 is part of a sub-genre of new media art called Internet art, which offers an art experience viewable through a web browser.  Basic web pages (which use a programming language called HTML) have been the same over a decade. HTML5 is a totally new system that's working behind the scenes of the web page you're viewing now.

This means artists can now make Internet art with incredible new capabilities. Better yet, they don’t need expert programming knowledge to translate their images onto the web. Using HMTL5, artists can use the new “canvas element” and the  “video element” to create works in a simpler, smoother way than ever before.

Making it on the ‘Net

Nick Briz is one Chicago artist using HTML5 to create a fresh take on digital art. He used the new video tag to document his thesis, called “Copy This Drive.” Briz put his entire hard drive up for grabs in a gallery, letting anyone who passed by with a USB stick to look at or even make copies of an extensive collection of his professional and personal information.  It included unfinished works of art, emails, photos, personal notes, etc. On top of this, he made a video using HTML5 to document the experiment. The video is only one piece in a range of art Briz uses the new programming language to create.

“I’ve also recently started making games with HTML5. As an artist, but also as an educator and an activist, I think video games are an incredibly important contemporary medium. Creating games with HTML5, primarily using canvas, makes the work tremendously more accessible, than for example a Flash game or a Nintendo game.”

Canvas

The canvas element is much what it sounds like: a digital canvas located inside the web script. Before there was canvas, artists largely had to use third-party platforms such as Flash. Viewers used to need a Flash plug-in to see the work, and surfers using their mobile device often had problems viewing the art. Briz explains that by using canvas, artists can create their projects within the webpage itself, rather than relying on another software.

“It’s an improvement because it’s cross-platform compatible, meaning it can run on anything with a browser, smart phones, tablets, computers, etc. and therefore can reach a wider audience for the artist,” Briz says.

Canvas is also “open,” meaning that artists do not need to purchase and have a license to use it as they would Flash. If a viewer sees something they like on a website, they can usually view the source and copy HTML code. This makes HTML5 easily accessible to designers.

With canvas artists can:

• Draw basic and complex shapes within the script
• Make info graphs and games
• Create animation and graphics using JavaScript and CSS, which allow for more stylistic designs within an HTML layout
• Create interactive art, such as video games

Don’t be intimidated by web art if you haven’t created it before. It may sound complicated, but there are plenty of resources to help artists start out. The site Creative Fan showcases examples of artists who used the canvas tag to create elaborate pieces. Other great resources include HTML5 Rocks and the Mozilla Developer Network. These sites offer tutorials and sharable code that can get artists on their way to creating pieces using HTML5.

Video

For artists working with film, perhaps no web development is more valuable than the HTML5 video tag. This element provides filmmakers (or even surfers who want to share a video with friends) a way to do it without using an intermediary such as Youtube, Vimeo or Flash. The tag allows users to place a video within the web page itself.

All the web creator has to do is write the file name of the video within the video tag code. The tag can be used make the video interact with the rest of the webpage. This allows artists to make videos pop up at certain moments in the web script, creating a multi-layered project. Like the canvas element, there are plenty of tutorials on how to use the video tag online, such as this page from HTML Atoms.

One great example of the HTML5 video tag is The Wilderness Downtown, an Arcade Fire music video created by Google and a film/tech production team. The result is nothing like anything ever seen on the web before, complete with interactive movie segments that pop up on the screen following demands in an HTML script. In this case, the director has used the code to allow viewers to play a part in creating the movie, resulting in a different experience every time they watch.

HTML5 is one of the latest developments in web language, and it’s one that artists can really take advantage of. A few tutorials are all you need to get started on creating a new digital masterpiece.