Archiwum kategorii: Web Tools

Animated Gauges With HTML5 Canvas: Gauge.js

Post pobrano z: Animated Gauges With HTML5 Canvas: Gauge.js

Advertise here with BSA

Gauge.js is a slick script for creating animated gauges with JavaScript (Coffeescript) in HTML5 canvas.

The script is standalone (jQuery is supported but not required) and doesn't use any images or CSS.

Gauge.js

It has 2 built-in interfaces (both looks very nice) and responds very well to value changes by animating the gauge.

There are options to set the animation speed, default/min/max values, colors and more.

To sum up, Gauge.js is a very handy script to visualize regularly changing (live) data.

Advertisements:
Infragistics jQuery controls deliver the magic of HTML5, w/o sacrificing resources, time, or money.
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Gantt Charts With PHP – Gantti

Post pobrano z: Gantt Charts With PHP – Gantti

Advertise here with BSA

Gantti is an open source PHP class for generating Gantt charts on-the-fly.

The charts created are pure HTML5-CSS3 with no JavaScript involved. The output looks very nice by default but can be customized with ease (with SASS stylesheet).

It simply works by defining an array of start/end dates and calling a single function. Also, charts are cross browser (IE7+).

PHP Gantt Class

Advertisements:
Infragistics jQuery controls deliver the magic of HTML5, w/o sacrificing resources, time, or money.
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
SSLmatic – Cheap SSL Certificates (from $19.99/year)

A Generator For Creating Pure CSS3 On/Off Flipswitches

Post pobrano z: A Generator For Creating Pure CSS3 On/Off Flipswitches

Advertise here with BSA

Proto.io, a mobile prototyping service, has created a handy generator for quickly creating on/off flipswitches.

The switches are built with pure CSS3 and it is possible to customize the look completely.

CSS3 On/Off Switch

It also comes with pre-defined styles for iOS4, iOS5 and Android as well.

P.S. In order to add functionality to such a control, it would be a good idea to listen to the "state" of the switch and add our custom events accordingly.

Advertisements:
Infragistics jQuery controls deliver the magic of HTML5, w/o sacrificing resources, time, or money.
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Free Landing Page With All The Source Codes (HTML-CSS And PSD)

Post pobrano z: Free Landing Page With All The Source Codes (HTML-CSS And PSD)

Advertise here with BSA

Few weeks ago, RightBanners, a company focused on creating custom banners and landing pages, contacted me asking to review their service.

Besides experiencing the service, I though this was a great chance to provide a handy freebie to WRD readers. I placed an order for a landing page just like any other customer and gone through the whole process. You can find out what working with RightBanners is like and download the landing page they created below.

Free Landing Page

The ordering process was very easy: I wrote the details of the project which was for a non-existing/virtual open source app named Media Presenter (a photo gallery web app).

I simply provided the logo, described the landing page I had in mind with the list of menu items and some of the content. I also shared examples of landing pages I liked so that RightBanners guys can have an idea of my style.

They use a ticketing system which is great. I can contact the RightBanners team and view the correspondence thread any time. The communication process was very smooth. RightBanners team asked for some other details. I added some extra information and they came up with 2 landing page designs the next day.

Free Landing Page

I selected one of them and requested a couple of changes on it. The new screenshot arrived the next day which was pretty fast.

At the end, I was happy with the result, approved the design. RightBanners created the HTML-CSS markup (via their sister service PSD2HTML) and it arrived within 2 days with the PSD source.

Conclusion

I was satisfied with the service, they were always there to reply and things worked pretty fast. I believe that this is their way of working but not because that order was for a review. If you are looking for a landing page or banner design service, you should definitely give them a try.

Download

P.S. The free landing page template can be used in free or commercial websites with no attributions. Only, it can not be distributed without permission.

Advertisements:
Infragistics jQuery controls deliver the magic of HTML5, w/o sacrificing resources, time, or money.
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Syte – Personal Website With Social Integrations

Post pobrano z: Syte – Personal Website With Social Integrations

Advertise here with BSA

Syte is an open source personal website which is integrated with many social network beautifully.

The website is built with Django (Python), HTML5 + CSS3 and has a responsive layout.

It is not a CMS but a hub that displays content from other sources. For content creation, it uses Tumblr. Any post created in the defined Tumblr account is automatically displayed in the Syte-powered website.

Syte

The social networks that the user belongs are featured in a column and, once any of them is clicked, a sidebar "featuring the content from that network" slides nicely.

There are integrations with Tumblr, Twitter, Instagram, Last.fm, GitHub, Dribbble and more are on the way.

Advertisements:
Infragistics jQuery controls deliver the magic of HTML5, w/o sacrificing resources, time, or money.
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Complete Solution For A User-Friendly Support System – Freshdesk

Post pobrano z: Complete Solution For A User-Friendly Support System – Freshdesk

Advertise here with BSA

Info: This is a review of a paid app (which has a free version).

Freshdesk Logo

For anyone or company who receives lots of support requests, just the e-mail is not enough to handle them successfully.

Users want to track their support requests, support team needs an interface to work collaboratively and the management should easily see "how the support is performing".

That's where the Freshdesk comes in. It is a full-featured and hosted help desk application which can automatically convert emails, Twitter mentions and comments on Facebook pages into support tickets.

The application smartly categorizes, prioritizes and assigns each request to the right support agent so that the support team saves a lot of time. Also, it is possible to create scenarios which can automatically perform the defined actions to the tickets that match the scenario.

Freshdesk Interface

There are many other features that empower the support team like canned responses, auto-recommendations from the built-in knowledgebase, splitting/merging tickets, transferring them to other agents and more.

Freshdesk is not all about support tickets, it also allows us to create a customer support portal with a knowledgebase to minimize the support requests. And, if they can't find the answer, they can still open a ticket via the portal and e-mail (or Twitter and Facebook).

Freshdesk Dashboard

We can also include the community to the support cycle by creating forums powered by Freshdesk so that they can ask question and get replies from other users (or the support team).

And, all these public pages can be branded to reflect you product or company, Freshdesk stays invisible in all the process.

A Freshdesk account can be set to support multiple products (depending on the plan), any number of agents can be added and it has a multilingual interface (perfect for distributed support teams).

Freshdesk Stats

The application provides many stats to quickly see the performance of each agent, department and product. Also, you can generate custom reports.

To sum up, Freshdesk is a robust solution to provide support via multiple channels and keep everything under control.

Advertisements:
Infragistics jQuery controls deliver the magic of HTML5, w/o sacrificing resources, time, or money.
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
SSLmatic – Cheap SSL Certificates (from $19.99/year)

A Slick Edit-In-Place Interface – Create.js

Post pobrano z: A Slick Edit-In-Place Interface – Create.js

Advertise here with BSA

Create.js is an open source, JavaScript-powered web editing interface for content management systems.

The interface focuses on simplicity and aims to enable the user edit the content without leaving the page but complete the edits directly on the viewed content.

It has support for the plain contentEditable, Aloha, and Hallo editors (more to be added) and, various configuration options exist to customize the behavior of Create.js.

Create.js

Advertisements:
Infragistics jQuery controls deliver the magic of HTML5, w/o sacrificing resources, time, or money.
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Responsive Slider jQuery Plugin – iView Slider

Post pobrano z: Responsive Slider jQuery Plugin – iView Slider

Advertise here with BSA

iView Slider is a jQuery slider plugin for featuring any type of content (images, HTML, video).

The plugin has support for responsive layouts down to mobile and it works well with touch interfaces.

It has 35 built-in transition effects where it is possible to define different ones on each slide item.

iView Slider

iView Slider offers animated HTML captions with custom effects (fade, move top, move right…) and there are multiple ways to browse the slides:

  • slideshow (optional "pause on hover")
  • keyboard
  • prev-next buttons
  • thumbnails
  • bullets

There are 3 different "loading bars" to inform user about "the loading time of the next slide".

Also, an API enables us to control the functionality of this slider via JavaScript.

Advertisements:
Infragistics jQuery controls deliver the magic of HTML5, w/o sacrificing resources, time, or money.
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
SSLmatic – Cheap SSL Certificates (from $19.99/year)

An Open Source Social Network App – Movim

Post pobrano z: An Open Source Social Network App – Movim

Advertise here with BSA

Movim is an open source social network application which follow the decentralised approach like Diaspora.

The application is built with PHP-MySQL and includes features like a wall, an instant messaging system, a contacts list, photo gallery, news feed etc.

Movim Social Network

It gives users the maximum control over their own data and allows them to import/export all the data from one Movim-powered network to another.

There is a special focus on privacy where all user setting are set to the max-private by default and they can customize them later on.

Movim is multilingual and doesn't require anything complicated to setup an instance.

P.S. You may also want to check out other open source social networking applications.

Advertisements:
Infragistics jQuery controls deliver the magic of HTML5, w/o sacrificing resources, time, or money.
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
SSLmatic – Cheap SSL Certificates (from $19.99/year)

Drag ‘n’ Drops For Lists – HTML5 Sortable

Post pobrano z: Drag ‘n’ Drops For Lists – HTML5 Sortable

Advertise here with BSA

The drag 'n'drop interactions of jQuery UI (draggable, droppable and sortable) are probably the most popular solutions out there.

However, if you don't want to use jQuery UI just for this and would like to go with only a jQuery plugin, here it is: HTML5 Sortable.

HTML5 Sortable

This plugin uses the native HTML5 drag and drop API for creating sortable lists/grids and provides a similar API + behavior when compared to jQuery UI's sortable.

It is lightweight (<1kb when minified/gzipped), supports "connected lists (moving items between different lists)" and works in all major browsers.

Advertisements:
Infragistics jQuery controls deliver the magic of HTML5, w/o sacrificing resources, time, or money.
Professional XHTML Admin Template ($15 Discount With The Code: WRD.)
SSLmatic – Cheap SSL Certificates (from $19.99/year)