We have mentioned Vector Based Gesture Icons for Touch Screen Interfaces earlier. Now we have got GestureWorks that ships with a library of over 200 built-in gestures.
Open Source Gesture Library is built upon an open source gesture framework, allowing developers to customize and extend the “gesture object” to create support for new gestures. You can download all free gesture and multitouch illustrations and icons. A variety of formats including scaleable formats are available.
Requirements: –
Demo: http://gestureworks.com/features/open-source-gestures/
License: BSD License
The Signature Pad jQuery plugin will transform an HTML form into a signature pad. The Signature Pad has two modes: TypeIt and DrawIt. In TypeIt mode the user’s signature is automatically generated as HTML text, styled with @font-face, from the input field where they type their name. In DrawIt mode the user is able to draw their signature on the canvas element.
The drawn signature is written out to a hidden input field as a JSON array using JSON.strinify(). Since the signature is saved as JSON it can be submitted as part of the form and kept on file. Using the JSON array, the signature can then be regenerated into the canvas element for display. Signature Pad works with both mouse and touch devices.
Requirements: Javascript and Canvas
Demo: http://thomasjbradley.ca/lab/signature-pad
License: New BSD License
Embedded Help System is “providing help where help is needed” concept that can be easily integrated into web interface. The point is to offer help to user in their working interface and actual situation.
jQuery E-Help is plugin for procedural (“How to …”) web user interface help and it’s easy to integrate into any web interface that supports Jquery. Useful for all web applications, CMS and E-commerce systems.
Requirements: jQuery Framework
Demo: http://embedded-help.net/
License: GPL, MIT License
You have probably seen face detection at work in programs like iPhoto and Picasa, but what if you could do that performantly in JavaScript? Chinese developer Liu Liu has done the honors, and implemented Face Detection in JavaScript via HTML5 Canvas.
The algorithm is implemented on top of a JS port of a C-based computer vision library by the same author. It works off a grayscale version of the image, and seems to be quite reliable in detecting faces in photographs. The demo then draws a red box around each face in the picture, but the library could be used to do much more interesting things with this data.
Requirements: Javascript, HTML5 Canvas
Demo: http://badassjs.com/post/1461943420/face-detection…
License: License Free
VideoJS is an HTML5 Video Player with 3 core parts: An embed code (Video for Everybody), a Javascript library (video.js), and a pure HTML/CSS skin (video-js.css). Using Video for Everybody as the embed code means you know it’s compatible with many devices (including ones without javascript).
The javascript library fixes browser & device bugs, and makes sure your video is even more compatible across different browser versions. The pure HTML5/CSS skin ensures a consistent look between HTML5 browsers, and easy custom skinning if you want to give it a specific look, or brand it with your own colors.
Requirements: HTML5
Demo: http://videojs.com/
License: LGPL License
Iconic is a minimal set of icons consisting of 136 marks. To give the greatest flexibility, the icon set packages all icons in PNG, SVG, SWC, OFT/TTF/EOT and Omnigraffle stencil formats. Iconic tries to work with various tools/workflows to make your life a bit easier.
All raster-format icons come in a wide variety of colors in order for greater convenience. The colors hit all the major hues in the spectrum as well as many colors used in the scheme on this site.This set is currently licensed under the Creative Commons Attribution-Share Alike 3.0 license.
Requirements: –
Demo: http://somerandomdude.com/projects/iconic/
License: Creative Commons License
Animated Gif Generator lets you easily create an animated gif by uploading a series of still images (gif, jpg, or png). Simply use the form to upload each image as desired. Once you’ve uploaded your images, you can also change the order of the images by dragging on each frame, or delete a frame by clicking the “x” icon. It is really a handy tool if you would like to create gif images online.
Requirements: –
Demo: http://tools.dynamicdrive.com/animatedgif/
License: License Free
Spritebox is a WYSIWYG tool to help web designers quickly and easily create CSS classes and IDs from a single sprite image. It is based on the principle of using the background-postion property to align areas of a sprite image into block elements of a web page. It was made using a combination of jQuery, CSS3 and HTML5, and it totally free to use.
Requirements: jQuery, CSS3, HTML5
Demo: http://www.spritebox.net/
License: License Free
Google SketchUp is the finest (and most innovative) tool available for anyone designing anything from coffee pots to skyscrapers. You can create 3D modelling easily with it.
Redecorate your living room. Design a new piece of furniture. Model your city for Google Earth. There’s no limit to what you can create with SketchUp. There are also dozens of video tutorials, an extensive Help Center and a worldwide user community mean that anyone who wants to make 3D models with Google SketchUp, can.
Requirements: –
Demo: http://sketchup.google.com/
License: License Free
NETEYE Activity Indicator is a jQuery plugin that renders a translucent activity indicator (spinner) using SVG or VML. It is a resolution independent indicator that works in any browsers. The plugin requires jQuery v1.4.2 (or higher). Besides that, no other files are required, especially no style-sheets or images.
Requirements: Firefox 2+, Safari 3.2.1+, IE 6+, Opera 10.6+
Demo: http://neteye.github.com/activity-indicator.html
License: MIT License
