Web Design Pick 'n' Mix 02

So here's another post filled with stuff I found useful, interesting or inspiring recently. Let me know in the comments what you think (or if you have anything you think I'd like!) , or tweet me @nervewax. The top image this time is some of the sweets I got while I was in Tokyo!

Design

Evil Icons is an awesome icon set made by Alexander Madyankin and Roman Shamin. Their package so far includes SVG versions of all the icons and even has a grunt plugin for use in web projects.

I used this tutorial the other day to get InDesign to output page numbers and titles. With a little more effort you can exclude the front page of your document from numbering too.

Front end

Here is a really easy tutorial I used to learn how to get the twitter API to grab the latest tweets from a feed and then output them using php. The tutorial even comes with a TwitterOAuth.php set up file and SSL certificate. TwitterOAuth can also be found here for more infomation.

I found the following code while looking for a simple way to globally implement scrollTo js functionality. It works surprisingly well,  all you have to do is drop this into a site, then all links pointing to internal elements will smoothly scroll there. 

Source: css-tricks

$('a[href*=#]:not([href=#])').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') 
        || location.hostname == this.hostname) {

        var target = $(this.hash);
        target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
           if (target.length) {
             $('html,body').animate({
                 scrollTop: target.offset().top
            }, 1000);
            return false;
        }
    }
});

This codepen shows off an incredible smoke effect, created with JavaScript and WebGL renderer.

Whether we like it or not, some clients demand tables of information. I recently had to move a lot of table data from a to b and I couldn't have done it without TABLEIZER!

Other

National Corndog Day

50 Shades of Dre (a grayscale colour picker)

fartscroll.js 

what more can I say...

Lastly, an inspirational video for creative people by Saar:
https://www.youtube.com/watch?v=E1oZhEIrer4


Share via twitter