Meta Refresh 2014

On the construction of user interface on the web

Prashant Singh


Vector graphics with SnapSvg

Submitted Jan 7, 2014

This talk aims at getting you introduced to SnapSvg. The talk would cover the following aspects of Snap:
• Basic shape creation, styling and manipulation.

• Making geometric calculations.

• Transformations and Animation.

• Demos of non-trivial graphics and applications created using Snap

• A comparison with some other SVG frameworks including a detailed comparison with Raphael

• Browser support


SVG has been one of the most underused and underutilized technologies when it comes to web development. SVG provides resolution independent, high resolution dots per inch (HiDPI) graphics on the web, in print, and on mobile devices in a compact format. Snap.svg is a JavaScript library that Web developers can build into their pages to enable these powerful SVG features in their code. Snap provides an intuitive and powerful API to manipulate SVG elements much like jQuery does for the DOM. It is unique in its ability to parse SVG content generated from other tools like Inkscape. It also supports animation, which combined with some clever coding can help fill some of the holes created by Flash.
This session will be a deep dive on Snap. It will compare Snap with some other competent frameworks in this space.


An understanding of Svg would help. Basic knowledge of Javascript required.

Speaker bio

Prashant is a Software Developer working for Adobe on Web platform tooling. He was working earlier as a Flash Platform Evangelist. He is passionate about developing for the Web and speaks regularly at Industry and developer focused conferences having recently spoken at IDPF Conf and GIDS(Great Indian Developer Summit). He also contributes to premium education by conducting workshops and hands on sessions to make the student population aware about the richer internet.


{{ gettext('Login to leave a comment') }}

{{ gettext('Post a comment…') }}
{{ gettext('New comment') }}
{{ formTitle }}

{{ errorMsg }}

{{ gettext('No comments posted yet') }}

Hosted by

Meta Refresh is an umbrella forum for conversations about different aspects of design and product including: UX and interaction design CMS, content management, publishing and content marketing Information architecture more