Things that made me happy this morning:

• The incredibly useful JSFiddle wants to become even better and asks for your opinion by filling out a questionaire
• Peter-Paul Koch released a handbook for conference organisers
• The Insidious Evils of ‘Like’ Culture is a great article dealing with the dangers of caring too much about feedback
• A pretty cool list of advanced JavaScript Tips and Tricks
• A simple CSS trick for creating sprites with endless whitespace
• Lots of new looks for Github’s Octocat
• A collection of HTML5 validation patterns to apply to your form fields (a few need work)
• ala have build a beautiful scrolling site for themselves with lots of HTML5/CSS/JS trickery
• Physical GIF want to create Zoetropes from your GIF animations
• My Event Calendar finally got released on the Mozilla site

Lately I’ve been playing a lot with canvas and video and see what can be done with it to do things that are tough to do to videos on your own computers. One thing I found really annoying is that it is tough to do screen grabs of videos. In the past it was impossible (before video cards allowed you to capture flash content with screenshots) and even now it is a pain.

If you offer an online video that is HTML5, it is pretty simple to use canvas to allow end users to download images of your video. I’ve written a demo that does exactly that – it takes a snapshot of a video and adds its name and time stamp to the snapshot. Users then can download the snapshot as a PNG.

Here’s a quick tutorial on how it is done (also available on YouTube)

You can see the code in action or fork and grab the source on GitHub.

The only annoyance is that because of security concerns (cross domain origin) you can not grab images from videos not hosted on the same servergrab frames from videos not on the same server but you are not allowed to save them out as images. In Firefox you can save a canvas as an image, but it doesn’t work cross-browser it seems.

I am a developer evangelist. I’ve written a handbook about it and I have fought and lived for the role for a long time. I think it is very important for a company to have a person that understands tech and translates it into understandable content for everyone out there. It is also important to have that person to be the mediator between the tech and non-tech people in the company.

I am also my biggest critic – I record all my talks and listen to myself later on cringing when I find things I can improve. This is the reason why I want to ask you for help to make my (and more and more others) job to be more accountable.

Right now being a developer evangelism means you do a lot of good but it is hard to measure what you did. Of course there are low hanging fruit when it comes to measuring the success of talks for example:

• Collecting Tweets right after a talk – which is tricky as they tend to be very polarised – people either hated or loved it
• Number of new contacts (business cards) – I know a few companies that have this as a metric. Seems a bit eighties to me and not meaning much unless you also get some good conversation out of the contacts
• Number of people in the room – might actually be that the other talk in the other track was boring
• Conference feedback forms/speaker rate (and similar sites) – this suffers from the same issue as tweets, really

Other things can also be measured and should be listed as successes:

• Partnership with companies met at conferences – getting free accounts to their services for yours
• Invitations to other speaking gigs – especially hard to get ones
• Connections with other speakers – getting them as judges for own competitions or to come and speak at your office/events

I’ve been speaking with other people in similar roles and the really interesting thing for us is not the immediate numbers but what impact we had. Sadly enough it is really hard to get information about this. Of course it feels good to have people come up to you directly after a talk or training and thank you for what you did, but what I really want to know is what people did with the info I dished out. Therefore it would be super useful to me if you told me about any of the following things:

• How have your used things you learned?
  • Have you given an internal training?
  • Is your team now using this technology or product?
  • Did it help your career (did you start using it and found a new job)?
• Did you re-use some of the material for training or pitching to a client?
• Have you build and released a product differently after the talk/training? This information would be total killer to get!
• Did you join developing an open source product? – did the talk get you out of your 9-5 mentality and make you do something different?
• [your idea here] – in essence I would love to hear how my work has affected you and what you did about it

If we’d get this information it would validate what we do and give us a reason to keep pushing ourselves. Please, share. Thanks!

The best way to tell me about things is by sending a Tweet to @codepo8. You can also contact me on the email in the footer of this blog, or on Facebook. I also hang out on IRC freenode #HTML5 a lot.

The year is 1993 and a young me spends quite some time in front of a Commodore 1901 colour screen, a C-64 and use Amica Paint V1.8 with my trusty Competition Pro Joystick to set and delete pixels.

One of the things I did a lot was fonts for scrollers and logo effects, like the ones here:

Fast forward to 2000 – a bit less younger me got his first PC and used Star Commander to move some of these fonts over to the PC to bring them on to the web. By now I develop in Perl and I write an online tool that allows you to create logos using the fonts:

A few years later, I re-wrote the generator in PHP. Well, seeing the very cool C64 yourself Canvas demo I thought I should now have a go at creating a pure client side version.

So here we go – check out Canvas Logo-O-Matic and get the source on GitHub

The way it works is described very well in this Canvas image cropping tutorial and I heavily documented the logogen.js file for you.

Basically the trick is to write a JSON map of all the char data – where a char starts and how wide it is and then crop it out of a single sprite sheet top copy one after the other into the Canvas.

Things that made me happy this morning:

• Verbally is an iPad app to communicate for those who can’t speak
• Use the Source is a job board without agencies
• The New York Times has a beautiful interactive form to see how many families are like yours in DHTML
• Lea Verou has a CSS only Tic Tac Toe game
• Receipt racer is a game played with a PS3 controller and a Thermo printer
• Dad Life shows how cool suburban dads are
• Steve Faulkner did some in-depth testing of block level elements inside links and screen readers
• Killing closed technologies one at a time: PDF.js and MadJS (MP3 decoder) – go go go!
• Nyan Cat in CSS uses CSS3 for animations and JS for the audio loop
• Typing “gay” into Google makes a rainbow appear on the search button (Screenshot) – I can never see Yahoo doing that
• Mike Shaver talks about a three dimensional platform
• A searchable Spreadsheet with all the TED talks should keep you busy for a while