Rich User Experiences

Overview

The deviantART logo

The deviantART logo

Web applications, which can be thought of lightweight, ubiquitous alternatives of their traditional desktop counterparts, are on the rise on the modern World Wide Web. In the last couple of years, one could witness web applications approach the functionality and sophistication of their traditional desktop counterparts, in some cases even surpassing them. By taking advantage of state-of-the-art web technologies, such as HTML5, CSS3, DOM, Ajax and JavaScript, web applications (often abbreviated as webapps) offer a more engaging, rich user experience and increased productivity. Google has played a large part in popularising the concept of rich web applications with the introduction of Gmail in 2004 and Google Maps in 2005. Both applications make extensive use of client side scripting (JavaScript) and have a rich user experience “feel” to them—in fact, both behave and look like just like ordinary desktop software, with the important distinction that they can be used on any computer with an internet connection via a regular browser, no additional software installation is required whatsoever. Naturally, the tremendous success of these two applications have inspired legions of web developers to launch their own rich web based software. One such application is deviantART, an international online community targeted at visual artists. In its earliest days, deviantART was basically a static image gallery consisting of digital artworks. As it grew in size and popularity, the service has been enhanced with more and more dynamic and rich user experience type of features.

Comparisons

deviantART proudly touts itself as the “the largest online social network for artists and art enthusiasts with over 19 million registered members, attracting 45 million unique visitors per month.” It is quite similar in concept to flickr, with the peer review and community aspects being much more pronounced. It offers its members a relatively unrestricted environment where artists can share and discuss their works and collaborate in a friendly atmosphere. Artworks are organised in a hierarchical category structure, including photography, traditional art, digital art, applications skins and videos. Beside offering standard social network functionalities, such as following members and sending private messages, the site has a print service, a subscription program, private journals and user definable polls among many others.

On August 7, 2010 deviantART celebrated its 10th birthday by launching a browser-based drawing tool called Muro. Muro is the perfect example of putting cutting-edge HTML5 technology to good use: it uses the HTML Canvas element (originally introduced by Apple in 2004, now officially part of the HTML5 standard) for all its drawing operations. The novel drawing tool can, without any exaggeration, be considered a huge success—according to its author, a new completed artwork is submitted using Muro to deviantART’s servers in about every 5 seconds. If all unfinished drawings are taken into account as well, the number would be much higher. Being based on HTML5 technology, users are not limited to just drawing on a desktop computer with a mouse; Muro works flawlessly on an iPad or any other touchscreen device that supports HTML5.

Below is the final result the author of this article was able to come up with after a short 5 minute introduction to Muro:

My first Muro artwork

My first Muro artwork

And here is a screencast of Muro in action in somewhat more skilled hands:

Implications & Future Directions

While in its current form Muro is by no means a serious contender to industry heavy-weights like Adobe Photoshop, it is quite easy to see that rich web applications are here to stay for a long time to come. There is a very important paradigm shift going on currently as we’re transitioning from the classical desktop computing model to the rich web application approach, where both application and data are stored in the cloud, and the user’s computer (or hand-held device, for the matter) will only play the role of a clever “terminal”. While web applications have not reached the sophistication of desktop apps in every aspect yet, that day is coming nearer and and nearer and the interesting question is what will the computing landscape look like after that point? While we can’t say it now for sure, every sign shows that we won’t have too wait long for the answer.

References

Wikipedia – Rich Internet application
Wikipedia – Web application
Wikipedia – deviantArt
Wikipedia – Canvas element
deviantART – about deviantART
deviantART – A Web Site Review
Case Study: HTML5 in deviantArt muro
DeviantART Muro is an HTML5 Drawing App that Works on Your iPad

Advertisements

12 thoughts on “Rich User Experiences

  1. great read… I would like to point out the limitation of HTML5 that this technology is not supported by all browsers.therefore, this is would limit the users usability, to me browser compatibility is important and I dont want to install a browser just to use webapp, AM I right?

    your post has great insight information about Muro ( thanks for introducing the app to us ) it is so handy.

    • As far as I know, Muro works correctly in Internet Exporer too. The article titled ‘Case Study: HTML5 in deviantArt muro’ in the references list describes in detail the extra work the authors needed to do in order to make Muro usable in IE.

      • I just tried it in IE9 – works fine 🙂

        Really cool tool. I’ve been a user of deviantart since ’04 but haven’t been back there in a while (except to get desktop backgrounds). Good to see they’re still kicking goals.

  2. Desktop driven application should be afraid 🙂 And I think it is about time that desktop applications starts to lower their prices. Microsoft Office is still quite expensive compared to Google Docs that is actually free (and web based!). With the improvements of web technology such as HTML5 we would see better and better user interfaces on the web that will be just as good as Microsoft Office in the future.

  3. deviantArt and Muro are very good examples of rich user applications – they are very connected with other applications and the user can certainly edit images etc in a web browser.
    I guess if Muro is not supported in all web browsers it is only a matter of time – with that many users, a little more programming will be worth the effort!
    I would recommend reading Joshuas’s blog (http://www.joshuaflinn.com) as he talks about what Adobe has done to compete will all these new Web 2.0 apps that you and I have spoken about this week, that are free in comparison to Photoshop.

    • Actually, Muro works in all browsers, including Internet Explorer… at least according to its creator, but I haven’t personally tested this myself. I didn’t know that Adobe had a rich web app competing with all these new products, thanks for pointing that out. I will check out the blog entry you mentioned sometime.

  4. I would agree with you Jaroodi, but has anyone thought about what is going to happen if Microsoft starts developing its own web apps in the place of their office apps?

    By the way Vivien your post did give me alot of insight about Deviart and if i may also add, a fair arguement in terms of its user interface. Now am curious what i can do with it too!

    Cheers 😉

  5. Great Post on deviantART

    Wow didn’t know about their web based Muro drawing app, it awesome that a artist/user can use a wacom tablet or an iPad to draw art within the browser with Muro HTML 5 Web app. The deviantART community is so awesome, so much talent and excellent artwork and desktop wallpapers on their site. It so is the social network designed for visual artists and art enthusiasts.

    Cheers

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s