Archives

Google Grid Gallery

View demo Download source This Blueprint is a responsive grid gallery based on the gallery by Google for the Chromebook Getting Started guide. In this Blueprint we use Masonry for the grid and 3D transforms for navigating the items. For smaller screens we have some example media queries that adjust the grid layout and also the gallery view. In the gallery view, the arrow keys can be used to naviga... »

Product Comparison Layout & Effect

View demo Download source This Blueprint is a responsive product grid layout with comparison functionality. A maximum of three items can be selected for the product comparison. The comparison view shows flexbox-powered columns or rows (depending on the viewport size) that appear with a slide-in effect. There are a couple of example media queries for smaller viewports. Browser Support: ChromeSuppor... »

Filterable Product Grid

View demo Download source This Blueprint is a responsive Isotope-powered product grid layout where each grid item is a Flickity image slider. A small cart icon animation indicates that a product was added to the shopping cart. The product filter utilizes the Isotope filter functionality. Some example media queries are used to show how to make the layout adaptive. Browser Support: ChromeSupported F... »

20 Awesome Data Visualization Tools

Generating charts, maps, analysis, and various infographics can take up a lot of your time. These amazing data visualization tools will help you ease your workflow by offering all the necessary elements that you need to rapidly and effortlessly create stunning visualizations in just a few steps. You don’t need any special technical abilities to generate various data visualizations, just inse... »

Zoom Slider

View demo Download source Today’s Blueprint is a simple content slider with depth-like zoom functionality. Each slide has a predefined zoom area that will be used to calculate the appropriate scale value for a fullscreen fill. Once the icon for zooming is clicked, the zoom area as well as the page get scaled, creating the illusion that the viewer is approaching the item. Once the whole page ... »

Page Stack Navigation

View demo Download source This Blueprint is page navigation effect based on the Dribbble shot Stacked navigation by Ilya Kostin. The idea is to show a navigation when clicking on the menu button and transform all pages in 3D and move them to the bottom of the viewport. The next two pages are shown in the back of the current page as a stack. When clicking on a menu item, the respective page comes u... »

Multi-Level Menu

View demo Download source Today’s Blueprint is a simple menu with multiple levels. The idea is to animate each menu item once a level is changed. The animation starts with the item clicked and the delays are propagated through the neighbors. The animation delays follow the same logic for the incoming items of the new level of the multi-level menu. As optional elements we have a breadcrumb na... »

10 Top Platforms and Tools for Building Cool Websites

Looking for a good website builder or website building aide? Focusing on ease of use, or trying to cut corners on cost might be good places to start. Yet those qualities alone won’t quite get you there. Here are several things to consider. Plus, a listing of tools and platforms guaranteed to get you well on your way to web design success. You should be able to control your designs to the pixel lev... »

20 Top-Selling Interior & Furniture Website Templates

Coming up with a smartly-designed and professionally looking website is not a problem any longer. The number of ready-made solutions grows at a fast rate all the time. Theme providers expand their inventories with new impressive solutions, making it so much quicker and easier to launch your project on the web. In this particular publication, we would like to draw your attention to a selection of t... »

20 Best WordPress Facebook Plugins and Widgets

Facebook is the most popular social network today and connecting it to your website and business can make a huge difference. Facebook pages and social shares can have a huge impact on your sales. Also, within your website, you can add various widgets or shortcodes, buttons, etc. that link back to your Facebook page. Also, you can check comments or insert them into your website, all to make things ... »

Skip to toolbar