Fun Stuff:
Fun and peculiar, sometimes even useful stuff.


Gesture Icons

  • Posted By: Jason Taetsch
  • ...

The touch screen has opened a whole new world of opportunities and challenges for designers and developers. Along with the new possibilties, comes the challenge of education users on how to interact with this new platform. Use the freebie pack of Gesture Icons by Rena One to provide visual guidance to users on the capabilities of your next app or project. The pack includes icons for swiping, pinching and tapping as well as common multi-finger movements and gestures.  .PSD and .AI versions are also available in case you’d like to customise an icon to match a specific gesture or action not already covered in the icon pack.

gesture_icons_featured

Create CSS Animations on the Fly

  • Posted By: Jason Taetsch
  • ...

CSS animations are lightweight and smooth, and thanks to the death of Internet Explorer 6 they are now widely accessible in most modern browsers. While most designers are likely familiar with the basic transitions and animations, the CCS3 standard includes features for much more advanced animations that can provide visual impact without drastically increasing load times.  The team at Stylie created a useful tool to quickly create CSS animations on the fly and grab the necessary CSS rules to implement the animations in your next project.  As always check with your projects analytics to verify that the majority of users can take advantage of the new animations, if not, you’ll want to include a fallback to make sure every user has a similar experience.

style_featured

Epic Favicon Generator

  • Posted By: Jason Taetsch
  • ...

For the discerning designer in us all, no detail is too small. From the slightest border and box-shadow adjustments to pixel-perfect grid-based systems, the modern web poses a number of design challenges and options for even the most basic of projects. The good folks at BCCO have put in the time to develop the Epic Favicon Generator, to help designers quickly create crisp favicons to accommodate standard desktops, smartphones and retina displays.  The generator creates the icons and the necessary HTML tags to quickly and correctly implement the favicons into your project.

favicon_generator

Scroll-to-Top Elevator.js

  • Posted By: Jason Taetsch
  • ...

Scrolling back to the top of a web page has never been a favorite experience for users. After they’ve read through all your content, there’s no reason to force the user to perform the tedious task of scrolling back up to the top menus and content. Though on-page anchor links have been around for years, the team at elevator.js has come up with an old-school scroll-to-top functionality that mimics the experience of riding in an elevator, complete with light-music and sound effects. Rather than jumping to the top, elevator.js smoothly returns the user to the top of the page with a slightly increasing speed and a soothing soundtrack. Elevator.js is a simple stand alone-library that does not require jQuery to incorporate into your next project.

elevator

Loaders.css

  • Posted By: Jason Taetsch
  • ...

CSS animations are smooth, native to modern browsers and fast-loading. With so many upsides they are a ripe solution to replace clunky GIFs and script based animations that often require additional libraries and struggle to provide a smooth experience across platforms. by Conner Atherton is a set of performance based animations to keep users engaged while the content on your page is served to their browser.  CSS-based animations provide a far better experience than typical jQuery or Javascript without the typical jumps and quirks associated with translating elements across the page.