Cutting edge graphic techniques for the web: SVG and Canvas - FCIP Meetup

SVG (Scalable Vector Graphics) and HTML5 Canvas
Cutting edge graphic techniques for the web


This will be a multi-topic evening with two presenters.

 

1. Derek Williams be be speaking about SVG (Scalable Vector Graphics) including:

A quick demo and some simple code examples for three (of many) approaches to use SVG in a web page:

As an image source As a background image in CSS/LESS Directly in the markup (HTML)

The talk will include a discussion of the positives and negatives of the approaches for different use cases.

What is SVG? Scalable Vector Graphics is an XML-based vector image format for two-dimensional graphics that has support for interactivity and animation. SVG has been around for quite a while (since 1999) but is now enjoying more widespread browser support and has appeal with the trend toward utilizing Responsive Web Design techniques that allow websites to adapt to different screen sizes.


SVG images and their behaviors are defined in XML text files. This means that they can be searched, indexed, and scripted. As XML files, SVG images can be created and edited with any text editor, and you can do some really nifty things with them.


2. Mark Morris will be providing an introduction to Canvas.

The HTML5 element is used to draw graphics and animation on the fly, via scripting. The element is a container for graphics, and then using Scripting (typically Javascript) one can create shapes and animations. Internet Explorer 9+, Firefox, Opera, Chrome, and Safari support the element.


If you've been wondering how to create animations in a post-Flash, smart phone world, don't miss this Meetup.

We'll have great information, discussion, beer and appetizers...

Don't miss it! RSVP today.

Meetup starts at 6pm sharp, appetizers available starting 5:45pm.

Join or login to comment.

  • Brent

    Thought this was worth sharing:

    "KineticJS is an HTML5 Canvas JavaScript framework that enables high performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more." http://kineticjs.com/

    September 13, 2013

  • Brent

    Here is an article that was just posted about "Exporting SVG for the web with Adobe Illustrator CC" http://www.adobe.com/inspire/2013/09/exporting-svg-illustrator.html

    September 5, 2013

  • Daniela

    Hello! Yesterday was very interesting and definitely tickled my interest. Somebody mentioned a job opening at a local company. Would you be so kind and post more details to the group? Thanks!

    September 4, 2013

    • Ron Z.

      Hi Daniela, here is the link about the job opening: http://datasplice.com...­. If you have additional questions feel free to contact DataSplice directly. Good luck!

      September 4, 2013

    • Daniela

      Thanks! :)

      September 5, 2013

  • Brent

    Just a quick reminder Mark Morris will being hosting a small hands-on session tomorrow night at LabWorx. So if you are interesting in learning more about HTML5 canvas or exploring something else and just need the time/space, please RSVP on our meetup page: http://meetup.com/LabWorx/

    September 4, 2013

  • paul f.

    Very informative. One of the better Meetups I've been to :)

    September 3, 2013

    • Lynda C.

      I'm bummed. But you guys would thank me for not going. My hubby is now sick.

      September 4, 2013

  • Marianne M.

    I see there is the Adobe (Flash, Illustrator) camp and the alternative camp(s) (SVG, Canvas). It was nice to get a peak at the SVG, Canvas developing aspects but they are not yet ready for "prime time." It is not clear what the pros and cons are of each camp (other than profits for Adobe vs. Open source?) I'm sure we will see more developments in the making however. Thanks.

    September 4, 2013

  • Flash A.

    Canvas? I think I'm going to keep using Flash and continue my Apple letter writing "Adopt Flash" program ;-) C'mon Mac lovers, don't cave in. Keep those lobbying efforts alive!

    September 4, 2013

  • Mike M.

    Very informative. An excellent group with tons of knowledge

    September 4, 2013

  • Daniel W.

    Capture a signature with this lib: https://github.com/willowsystems/jSignature

    September 3, 2013

  • David

    Meant to introduce myself to the college instructor who mentioned maya, cinema 4D... I think you also mentioned you were looking for presenters for your students... I used to teach as an adjunct and would be interested in such but I did not catch your name... If anyone else can fill in the name please do so. Thanks!

    September 3, 2013

    • Lisa Joy G.

      That would be Daniela Castillo.

      1 · September 3, 2013

  • Lynda C.

    Fighting a bug? Don't want to chance getting you all sick if it is. See you next time.

    September 3, 2013

  • Lynda C.

    Always looking for great tools and great web developers and marketers to work with.

    1 · August 28, 2013

  • andrew s.

    Thanks for bringing the topic to Ft. Collins!

    1 · August 28, 2013

  • Flash A.

    Looking forward to this one.

    1 · August 15, 2013

Our Sponsors

  • DataSplice

    Thank you for supplying appetizers and supporting our members!

Create your own Meetup Group

Get started Learn more
Rafaël

We just grab a coffee and speak French. Some people have been coming every week for months... it creates a kind of warmth to the group.

Rafaël, started French Conversation Group

Sign up

Meetup members, Log in

By clicking "Sign up" or "Sign up using Facebook", you confirm that you accept our Terms of Service & Privacy Policy