A tutorial on how to create a fullscreen pageflip layout using BookBlock. The idea is to flip the content like book pages and access the pages via a sidebar menu that will slide out from the left.
The practice of implementing responsive images is still in its infancy. We’ve seen a lot of ideas and suggestions for how it should be done and we’re bound to see a lot more. Today Design Shack going to look at a fascinating little framework that allows you to not only automatically resize your images when the viewport changes, but also crop the images with a specific important focal point in mind. Amazingly enough, it does all this with pure CSS.
This experimental jQuery plugin allows the automatic grouping of thumbnails using a pile effect. The thumbnails will group according to their shared data-pile attribute and once clicked, the pile will disperse and its thumbnails fly to their positions. The thumbnails can be slightly rotated or positioned with a delay. The grid itself is adaptive, meaning that if there is not enough horizontal space considering the width and the gutter of the items, the column count will decrease and the grid will re-order.
Batch is a lovingly designed and crafted suite of 300 icons for web and user interface design. Each icon is a single Photoshop shape layer, meaning they can be scaled up—and down—without loss of quality. Adding layer styles and blend modes is also a breeze.
Smashing Magazine have a beautiful icon freebie for you. BanzaiTokyo designed this art related icon set. Their collection of 34 icons are an homage to the creative professions. The icons are available as PNG files and released under a Creative Commons Attribution License.
Edge Inspect is an application for web developers and designers who are working on mobile web projects. Edge Inspect enables you to work more efficiently by providing synchronous browsing, remote inspection and the ability to take screenshots of your mobile web content from connected devices.
The date range picker relies on jQuery, Datejs for parsing strings into dates and defining custom ranges, and the Twitter Bootstrap CSS. For basic use cases like collecting event or reservation dates, you can attach it to a text input to pop up two clickable calendars to choose dates from. For more advanced use cases, you can attach a date range picker to any element, pre-define your own date ranges for the user to choose from, and set a custom callback function to receive the chosen dates.
PFold is a very experimental jQuery plugin that makes it possible to open elements in a paper-like unfolding effect. An element can be unfolded in 3D in order to reveal some other content. The idea is to have several levels of folding, where each step of opening will double the element size, hence imitating a folded paper being opened. A couple of options are available, such as the unfolding direction for each step and the number of folding steps. For browsers that don’t support CSS 3D transforms or transitions, there will be a simple fallback, i.e. the larger content appears.
Deployd is a platform that makes building complex backends simple. Build APIs for web and mobile apps in minutes instead of days. Unlike working with a traditional backend, there’s no boilerplate, or configuration. Deployd works right out of the box. The best part is that you can run it however and wherever you want – it’s free and open source.
Deployd is designed to replace traditional backends for web and mobile apps. Perform advanced queries over HTTP. Push data to clients over WebSockets in real time. Transform and validate your data as it changes.