Connect With WRD
feed via e-mail
feed via e-mail

Sencha (previously known as Ext JS) has released Sencha Touch, an HTML5 Mobile App. Framework, which allows you to develop web applications that look and feel native on Apple iOS and Google Android touchscreen devices.

It makes use of HTML5 for delivering audio/video or localStorage and CSS3 for maximum styling like rounded corners, background gradients, and shadows.

Sencha Touch

The code created is resolution independent. It uses a method which allows developers to change the overall scale of their interfaces on the fly with no pixellation.

Sencha Touch has a powerful animation system that makes flexible animations between screens and views possible.

Slide, pop, and fade animations are included with the library, each with a robust set of options to change attributes like direction and masking style.

And, as they are created with CSS, building custom animations is a joy.

Also, it includes a set of common icons for using them in toolbars and tab bars.

HumbleFinance is an HTML5 data visualization tool that looks and functions similar to the Flash chart in Google Finance.

It makes use of the Prototype and Flotr libraries and is not limited to displaying financial data but any two 2d data sets which share an axis.

HumbleFinance Chart

The data needs to be stored in JavaScript variables and requires 3 parameters to be set before running the function to create the chart.

It is possible to manually select a part of the data (with a slider-like interface) and zoom to that part. This is a very useful function when working with large datasets,

Launchlist is a free web application which aims to help web designers and developers to check their work before making it available for everyone.

It simply asks your project details and website URL, and then proceed through a list of provided fields with questions like:

  • Images have appropriate alt tags?
  • HTML has passed validation?
  • Forms send to correct recipient?
  • And more..

You can add new questions to the list as well and, once the form is completed, a generated report can be received as an e-mail message.


jMediaelement is a jQuery HTML audio-video development kit with can fallback to Flash and VLC for incompatible browsers.

It makes creating a media element so easy by just calling a function and also controlling it on every level (play-pause-mute, getting the duration, etc.).


The player is totally CSS stylable from the frame to the images of the controls.

jMediaElement supports all major file formats including; ogg (theora/vorbis), mp4/mov (h.264), WebM (VP8/vorbis), flv, Youtube videos and more.

JpGraph is a feature-rich PHP library for creating good looking charts.

It has support for almost any chart type including bar, line, pie, scatter, radar, field, stock and much more.

Some of the charts have the option to be created in 3D and they are all web-friendly (usually 2-3 kb).


The library is very flexible, any number of plots can be drawn in every chart, objects can be rotated, etc.

JpGraph has built-in images for plot marks including 3D rendered markers like diamonds, squares, bevels, balls and pins.

And, a very original feature, it has a pre-defined function to create flags for 200+ countries.

To sum up, the library is really an impressive one and it is free to be used in non-commercial, open-source or educational projects.

There are various solutions for adding CSS3 support to Internet Explorer and here is another one that works pretty good.

IE-CSS3 is a script (.htc file) which can be mentioned within the CSS file (like behavior: url(;) and enables IE to support:

  • border-radius
  • box-shadow
  • text-shadow

properties (which are the most popular ones).


It simply rebuilds the elements -which IE-CSS3 is applied- with VML (an IE-specific vector drawing language).

In order to prevent the script break the output in other browsers, it is definitely a good idea to use it in IE-specific CSS files.

BrowserLab, a web-based service by Adobe, enables you to test websites on multiple browsers and OSs.

It is possible to create a custom browser set where the screenshots will be created only for those browsers (also helps speeding up the results).

Adobe Browserlab

Screenshots can be previewed in 2-up or onion-skin views which makes comparing multiple versions easier and x/y rulers can be used for sensitive measurements..

The service currently supports different Firefox, Safari and IE versions for Windows and Mac OS X. However, it is still in beta and new browsers are added within time.

BrowserLab is part of the Adobe CS Live and free for 1 year if you sign-up before April 30, 2011.

What Font Is is a free web-based service that helps identifying and/or finding alternatives of a font.

It works by simply uploading (or mentioning the URL of) an image including the text.

The service offers the option to include only free and/or commercial fonts in the results.

And, you can browse a gallery of 70,000+ fonts inside the "All Fonts" menu.

What Font Is

Dragdealer JS is a free JavaScript component for easily creating interfaces that support dragging (like a slider).

It is a standalone script that also works in touch-enabled mobile devices.

Dragdealer JS

The script is pretty flexible with options like:

  • working horizontally or vertically
  • defining the initial positions of the slider (x/y)
  • setting the number of steps for the slider
  • snapping to the steps
  • and much more.

Dragdelaer JS has callbacks on both release and move events which makes any type of interactions possible.

Webalys, a talented freelance interface designer, is sharing a set of 290 free vector icons for wreframe and application design.

The icons are in .AI format and only 2 colors are used for them: black and white.

They are based on a precise 16 pixels grid which makes sure they will look nice even in small sizes.

Wireframe Icons

Uptime Robot