pilotfish

Pilotfish, a toolkit for improving user experience

npm install pilotfish
44 downloads in the last week
88 downloads in the last month

Build Status

Pilotfish quality rating: 2 fish

About

Software should be intuitive, easy, and fun to use. Pilotfish is a user experience toolkit for web and application developers to build better user experiences.

Instead of re-writing these common user experience widgets for each platform over and over, pilotfish unifies this effort as a community driven project that pulls together the latest best practices in User Experience. Your users get a better experience, and you save time. See plugins for a list of the functionality you gain by using a User Experience Platform.

TL;DR: Pilotfish is bootstrap for User Experience, with a server-side platform too.

FAQ

Can't I just do this on my own?

Sure, most experienced developers have created experiences like the ones you see here, at least once. Do you want to keep doing that over and over again, or use well-tested, high quality interactions?

Isn't this what jQueryUI, MixPanel, KISSMetrics, etc. does?

There are a lot of overlapping tools in the space, but no cohesive platform. Pilotfish aims to help with all aspects of User Experience (ultimately - we aren't there yet!), Starting with product conception, through the application, to analytics. This means server side apis for data, javascript/css widgets for the application, and a console for the owner to manage it all. To get a view of how all these fit together, check out our view of the User Experience Landscape

Do I have to use your server for the plugins that need server-side support?

No. While there is a highly available, scalable platform-as-a-service at api.pilotfish.io. You can also download/install the api code and host yourself. See alternate hosting options.

Does it work with jQuery, Prototype, Backbone, Underscore, jQuery UI, YUI, mooTools, dojo, etc.?

Pilotfish currently requires jQuery. We plan on supporting other frameworks soon. Let us know if you are interested in other frameworks, that will guide our priorities. The best way to do this is to file an issue. Pilotfish will not interfere with any other libraries.

That looks like a lot of functionality. Isn't the file huge?

Pilotfish uses a plugin driven architecture, so you only get the plugins you need. The pilotfish.min.js file is only 1.8K when minified/gzipped.

Why the name pilotfish?

A pilot fish is one of those little fish that hover around sharks and eat the parasites, creating a mutually beneficial relationship with the shark. Similarly, Pilotfish aims to work alongside your application to make it better.

Demo

To see a working sample site, head over to pilotfish.io

Getting started

This code is still young. Want to try it anyway? To use pilotfish, first include the base pilotfish file, then any plugins that you want to use. Depending on the plugin, some extra configuration may be required.

Asynchrounous Implementation

We like fast pages, and you should to. Pilotfish was built to be loaded asynchronously, and to load it's plugins asynchronously. Put this code anywhere in your template

(function(w, d, S) {
    w.Pilotfish || ((Pilotfish = function() {
        Pilotfish.q.push(arguments);
    }).q = []);
    var p = d.createElement(S),
        s = d.getElementsByTagName(S)[0];
    p.async = !0;
    p.src = (location.protocol === "https:" ? "https:" : "http:") + "//cdn.pilotfish.io/client/latest/pilotfish.min.js";
    s.parentNode.insertBefore(p, s);
})(window, document, "script");

// Require any plugins...
Pilotfish('require', 'blower');

To see it in action, see this example fiddle

Rather host it yourself? Want a specific version? Alternate Hosting Options

Plugins

Several core plugins are included with the platform, and there is also a community of developers that create plugins as they are needed.

  • Blower - Automagically finds usability problems (makes your site suck less)
  • Recorder - records events to the analytics backend of your choosing
  • Speaker - speak with your user (notifications, error handling, tool tips and more)
  • Usher - A new user tutorial

For more information on plugins, see plugins

Have an idea for a plugin? We'd love to hear it. Please file an issue describing your idea.

Requirements

Pilotfish currently depends on jQuery, at least version 1.4. If your site doesn't use jQuery please let us know which javascript library we need to support by filing an issue

Browser Compatibility

Pilotfish accepts the burden of browser compatibility testing, and we aim to make reasonable trade offs for compatibility versus complexity/bloat.

We currently to support all browsers that support JSON:

  • Chrome >= 4
  • Firefox >= 3.5
  • Internet Explorer >= 8
  • Safari (including iOS) >= 5

For older browsers that don't support required functionality, we aim to gracefully degrade - silently disabled without causing problems for the user.

If it is important for you to support older browsers, we recommend modernizr, which brings browsers up to snuff.

Alternate Hosting Options

Picking a specific version

While it is recommend you use the latest stable minified release of the javascript, you may also pick a different release state or lock to a specific version number. We use semantic versioning with major.minor.patch. Examples:

Self hosting

You may host the javascript files yourself if you like. Simply download them from any of these sources and put them on your servers.

Note that the server-side api, and web console are open source, you are free to download/install them and run them on your own server instead of using the Pilotfish hosted solution.

Github CDN

http://pilotfish.github.com/client/latest/pilotfish.min.js

Google CDN

TODO

Yahoo CDN

TODO

License

We aim for you to use this inside your application, so we picked the least restrictive license we could find. MIT License - see LICENSE

Who is using Pilotfish?

See USING.

Issues/Requests/Support

We want you to have a good experience, too. :)

Please check out the existing issues, and if you don't see that your problem is already being worked on, please file an issue

Contributing

Would you like to help out? Checkout the TODO page.

See doc/helping to get started. See doc/development for guidelines on how to write code that gets included in the production release.

More information

npm loves you