Collective #286
Inspirational Website of the Week: north2
Fresh colors, smart interactions and super cool animations made us pick north2 this week.
Get inspiredHeatmaps, Visitor Recordings, and more. All free.
Get free and unlimited visual feedback from your visitors. Hotjar allows you to see how your visitors are really using your site.
Check it outHow to Create Direction-Aware CSS-Only Hover Effects
Gabrielle Wee shows some great techniques for direction-aware CSS-only hover effects.
Read itLottie
Lottie is an iOS, Android, and React Native library that renders After Effects animations in real time, allowing apps to use animations as easily as they use static images.
Check it outTypefaces
NPM packages for Open Source typefaces — making it easier to self-host webfonts.
Check it outWe don't need Google
Jaco du Plessis shows some alternatives to Google products.
Read itHow Flexbox works — explained with big, colorful, animated gifs
Scott Domes gives us an animated look at how Flexbox works.
Check it outLuxbar
A compact CSS-only and responsive navigation bar by Balazs Saros.
Check it outMore Readable CSS with CSS Custom Properties
Some tips on how to make CSS more readable with CSS Custom Properties.
Read itMaintaining Accessibility in a Responsive World
Some great insight into how to keep accessibility in responsive design.
Read itData Humanism, the Revolution will be Visualized
A fascinating piece by Giorgia Lupi on the future of data visualization
Read itWhat should you think about when using Facebook?
A very interesting and eye-opening article by Vicki Boykis on how Facebook collects data.
Read itFree Font: Cheque
A beautiful, free display font by Fontfabric, designed by Mirela Belova.
Get itFlowchart kit for Sketch
Fully customizable and scalable vector elements with 3 pre-defined color themes for creating sitemaps and wireframes in Sketch.
Get itUsing HTTP/2 Responsibly: Adapting for Users
An informative two-part series exploring the new HTTP/2 protocol. By Jeremy Wagner.
Check it outMy Mac app icon design workflow
The very insightful process of creating awesome looking Mac app icons.
Read itpreload-webpack-plugin
A Webpack plugin for automatically wiring up asynchronous (and other types) of JavaScript chunks using <link rel='preload'>
.
Free Font: Shkoder 1989
A 90ies inspired font with two weights. Desigend by Julian Hoxhaj and Ana Hoxha.
Check it out"I didn’t know Sketch could do that!"
Some very useful tricks for enhancing your Sketch workflow by Jon Moore.
Read itAlpaca Peck
An adorable Matter.js powered demo of two alpacas are in love.
Check it out