Initializr – HTML5 templates generator

Initializr has been created by Jonathan Verrecchia to help the spread of HTML5 on the web.

Jonathan Verrechia is a french Web Developer, Author and Blogger working at SFEIR on HTML5 and CSS3. He is the author of the french book HTML5 – De la page web à l’application web, together with Jean-Pierre Vincent.

Initiallizr is a HTML5 templates generator whicht is built on HTML5 Boilerplate, a powerful HTML5 template created by Paul Irish and Divya Manian.

Google Swiffy and Adobe Wallaby

In July 2011, Google announced a new online tool called Swiffy to convert .swf files to HTML5. The converted html5 content can be viewed in any modern browser without needing a flash plugin to play.

Swiffy currently supports a subset of SWF 8 and ActionScript 2.0. Swiffy uses a compact JSON representation of the animation, which is rendered using SVG and a bit of HTML5 and CSS3.

Adobe Flash .fla files can be converted into HTML with Wallaby, an installable tool provided by Adobe as an experimental technology.

I tried to convert several .swf files, without success. The following errors occured :

  • The ActionScript function clearInterval is not supported
  • The ActionScript function setInterval is not supported
  • The #initclip pragma is not supported
  • Shape tweens are not supported
  • The ActionScript method MovieClip.getBytesLoaded() is not supported
  • The ActionScript method MovieClip.swapDepths() is not supported
  • The ActionScript method MovieClip.getBytesTotal() is not supported
  • The ActionScript method MovieClip.loadMovie() is not supported
  • An unsupported ActionScript instruction was encountered

 

Google Plus

On june 28, 2011, Google rolled out a new social networking service called Google+. Right now, Google+ is in limited field trial to test with a small number of people, but it won’t be long before the Google+ project is ready for everyone.

Basically, Google+ is an amalgamation of the following services :

  • Circles groups your friends together
  • Sparks helps you find interesting content based on interest
  • Hangouts lets you video chat with all your buddies
  • Huddles is a new group messaging app
  • Instant Upload shares your mobile photos

Further informations are available at the following links :

Create videos on Youtube

YouTube recommends the following applications to animate your own story or to create a video slideshow.

  • GoAnimate is a fun app that lets you make animated videos, for free, in just 10 minutes, without having to draw. You can even create your own cast of characters.
  • Xtranormal lets you to turn anything you type into a fully-animated CG movie. Set up your scene, type in your script, and animate it instantly.
  • Stupeflix Video Maker lets you tell a story with your digital content. Mix pictures, videos, maps, text, music and watch Stupeflix produce a stunning video in a few seconds.
  • One True Media by SpotMixer is a simply powerful video creation tool. Robust, fast and easy video editing. Combine and clip video and photos.

Google Doodles – how do they do ?

Last update : May 1, 2013

Neli S Gautham Raj [Linuxtree ] and M. Jeyaganesh [Cybergyaan ] created the website devlup, a community of young web developers, programmers and social media enthusiasts.

They published a series of tutorials about the programming of the interactive Google Doodles :

Other great contributions on the websites of the authors are :

Another developer interested in Google Doodles is Alvaro Montoro who created the jquery plugin imageCloud, based on the Christmas 2010 Google Doodle.

Youtube Custom Player discontinued

In june 2011, YouTube removed support for the creation of new Custom Players, a specialized way of embedding playlists for playback on third party sites in a customizable interface. Existing players will continue to function. An example of a YouTube custom player is embedded in Cedrix Crespel’s music video webpage at Leslie’s Artgallery.

Similar functionality is available through creating embedded playlists, which can be accessed by visiting http://youtube.com/my_playlists, clicking Share, and then using the embed code given there.

Square and non square video pixels

Last update : August 27, 2013

Whereas in the graphic and computer world we have square video pixels, in the old video world (PAL and NTSC) we have non square video pixels (Recommendation ITU-R BT.601-4). Video pixels in the HD world are, fortunately, square.

The term which describes this squareness or non-squareness is the pixel aspect ratio, expressed as a fraction of horizontal (x) pixel size divided by vertical (y) pixel size.

The PAL (576i) pixel aspect ratio (PAR) is 59/54 (1,094), the NTSC (480i) pixel aspect ratio is 10/11.

The pixel aspect ratio must not be confused with the display aspect ratio (DAR) or where the common values are 4:3 and 16:9 (anamorphic format).

When doing a conversion of a video file from one size or format in another size or format, the resulting video geometry will be stretched or squished if the pixel aspect ratio is not accomodated. Usually the errors are small and there is no great damage in the result if the correct conversion factor is ignored. The difference can become critical if filters are applied or other synthetic effects are added.

More detailed informations are available in the lurker’s guide to video from Chris Pirazzi.

Another problem is that the commonly used digital video resolutions don’t exactly represent the actual 4:3 or 16:9 picture aspect ratios. All commonly used modern digital video standards  are based on their counterparts in analog video standards to avoid too many compatibility issues. The most used sampling rate in PAL and NTSC video systems is 13,5 Mhz.

PAL has a line length of 64 µs, of which 52 µs contains actual image information, the rest is reserved for horizontal blanking. 52 µs × 13.5 MHz = 702 samples per scanline. In the vertical direction, there are 574 complete lines and 2 half lines, giving a total of 576 scanlines. Thus, the active image area for a 4:3 or 16:9 frame at 13.5 MHz sampling is 702×576 pixels.

For NTSC, the same calculation gives an image area of 711×486 pixels.

Instead of using 702 or 711 samples per line, the digital video standard defines 720 samples (= pixels) per line to allow for little deviations from the ideal timing values and to use a common sampling rate of 13,5 Mhz.

When converting videos from one size to another, cropping or adding black side edges to the video is necessary to keep the correct image aspect ratio. Fortunately some video conversion softwares care for these conditions.

More details about square and non square video pixels and a conversion table are available in the Quick Guide to Digital Video Resolution and Aspect Ratio Conversions maintained by Jukka Aho. Another useful tutorial about Pixel Aspect Ratio is available at the doom9.net website.

Ken Burns video effect

The Ken Burns video effect is a popular name for a  panning and zooming effect used in video production from still imagery. The name refers to Kenneth Lauren “Ken” Burns,  an American director and producer of documentary films known for his style of using archival footage and photographs.

The technique is principally used in historical documentaries where film or video material is not available. The effect is included in several movie edition softwares, for instance on the Windows platform in AVS Video Editor.

Will McGugan published a tutorial about the Ken Burns effect in javascript and canvas on his blog.

CAPTCHA

CAPTCHA examples

CAPTCHA is standing for “Completely Automated Public Turing test to tell Computers and Humans Apart”. It is a type of challenge-response test used in computing as an attempt to ensure that the response is generated by a person. Because other computers are supposedly unable to solve the CAPTCHA, it is sometimes described as a reverse Turing test, because it is administered by a machine and targeted to a human.

A common type of CAPTCHA requires the user to type letters or digits from a distorted image that appears on the screen.

The term “CAPTCHA” was launched in 2000 by Luis von Ahn, Manuel Blum, Nicholas J. Hopper, and John Langford (all of Carnegie Mellon University).

A very interesting contribution about CAPTCHA (in french) has been published by Nicolas Kerschenbaum, a security consultant of the french company Xmco Partners.

Piwik : open source Web Analytics

Piwik Dashboard


Piwik, an open source alternative to Google Analytics, is a downloadable, open source (GPL licensed) real time web analytics software program. It provides you with detailed reports on your website visitors: the search engines and keywords they used, the language they speak, your popular pages, …

Piwik is a PHP MySQL program that is installed your own webserver. At the end of a five minute installation process, a JavaScript code is generated that you embed in the webpages you want to track.