Fresh Resources for Designers and Developers – May 2014
It’s time for us again to share several great resources with our fellow designers and developers. Let’s cut to the chase.
In this round, we have got a free book to learn basic CSS, a collection of LESS and Sass functions for unit conversion, animated SVGs for displaying loading bars, and a bunch more. If you are new to our fresh resoures, do check out the full series in the link below.
Mapstylr is a nice free web app that allows you to customize Google Maps. You can create your own map styles easily with a very nice UI. With an account you can save your customized map styles as a private collection or a public one. Also you might like to check out our previous tutorial on how to style Google Maps.
Are you sick of GIF animation to display your loading progress bar (which does not present well in Hi-DPI screen)?. Well, you can try using this Loading collection. Loading is a collection of progress bars made with SVG. They will look sharp and crisp in any screen resolution. At the time for the writing it has 8 loading bar styles.
Remixins is a collection of LESS mixins to convert
rem, yet it keeps the
px as a fallback for browsers that do not support
rem is a measuring unit relative to the body or the document font-size, similar to
em except, rem does not inherit the coumpounding bug, where the measuring is also calculated up against the parent element’s font-size.
Check out our previous article, CSS Units: Pixels, EM, and Percentage for more in-depth explanation on this.
If you are working with Sass, Unitize can be a great alternative of Remixins. Unitize is a collection of Sass functions to easily apply
rem unit. It comprises of three functions
em() which can be used with any property that requires a measuring unit.
ShareDrop is a free web app that allows you to directly share files between devices. ShareDrop is powered by WebRTC, an open project that enables web browsers to communicate with one another. It works (and looks) similar to Mac’s AirDrop. You can share files by simple drag and drop and it works across multiple mobile or desktopdevices, within the same network IP (though this may not work in iOS due to some restrictions that Apple made).
Magic of CSS is a free online book for web designers to learn CSS fundamentals. The book currently contains 6 chapters: The Box, Layout, Tables, Color, Typography, and Transition. The book will be updated with more chapters over time.
Let’s face it, debugging website layout is a rite of passage, no matter how proficient we are with CSS. It can get really frustrating. Pesticide is the tool that could reduce this common frustration for web developers. Pesticide will draw outline sof all the elements in the website so that you can figure out which element has gone wrong and requires fixing.
Brick.im is an open project that brings font to the Web. Unlike Google Web Font, Brick.im brings the fonts without any modification or sub-setting. So, the font is displayed originally as it is. Though the font collection in it is currently limited, it is still a good alternative to Google Web Font.