Maze of Minds » Freebies

Plugins, Templates & Frameworks For Responsive Web Design

Tomas — Sat, 07 Jan 2012 16:26:15 +0000

In this post you will find useful frameworks and plugins which will help you to build responsive websites faster.

jQuery Plugins

Blueberry

Blueberry is an experimental opensource jQuery image slider plugin which has been written specifically to work with fluid/responsive web layouts.

Response JS is a lightweight jQuery plugin that gives web designers tools for building performance-optimized, mobile-first responsive websites. It provides semantic ways to dynamically swap code blocks based on breakpoints and serve images (or other media) progressively via HTML5 data attributes. Its object methods give developers hooks for triggering responsive actions and booleans for testing responsive properties.

Fittext.js

FitText makes font-sizes flexible. Use this plugin on your fluid or responsive layout to achieve scalable headlines that fill the width of a parent element.

FitVids.js

A lightweight, easy-to-use jQuery plugin for fluid width video embeds.

Templates & Frameworks

320 and Up

‘320 and Up’ starts with a tiny screen stylesheet that contains only reset, colour and typography styles. Media Queries then load assets and layout styles progressively and only as they’re needed. Think of this as responsible responsive design. ‘320 and Up’ is a device agnostic, one web boilerplate.

Amazium

Responsive framework based on 960 grid system.

Foundation

An easy to use, powerful, and flexible framework for building prototypes and production code on any kind of device.

Inuit.css

Inuit.css framework is built to work on smaller screens (such as tablets) and tiny screens (such as phones) straight out of the box with minimal effort.

The Constellation WordPress Theme

The Constellation theme is the perfect starting point for any WordPress project. It gives you the flexibility to provide bespoke styles for different devices, totally up-to-date HTML5 code which is fantastic for SEO, a flexible grid system on top of all the other goodness bundled in to the HTML5 boiler plate.

Reverie

Reverie Framework is an extremely versatile HTML5 WordPress framework based on ZURB’s Foundation, a powerful tool for building prototypes on any kind of devices.

Skeleton

Skeleton is a small collection of CSS & JS files that can help you rapidly develop sites that look beautiful at any size, be it a 17″ laptop screen or an iPhone.

Gridless

Gridless is an optionated HTML5 and CSS3 boilerplate for making mobile first responsive, cross-browser websites with beautiful typography.

Simple Grid

SG is prepared for 4 distinct ranges of screen size: screens 720px, screens 720px, screens than 985px, and screens than 1235px. This means that people visiting your site will receive a layout that’s tuned to the size of their browser window.

The 1140 grid

The 1140 grid fits perfectly into a 1280 monitor. On smaller monitors it becomes fluid and adapts to the width of the browser.
Beyond a certain point it uses media queries to serve up a mobile version, which essentially stacks all the columns on top of each other so the flow of information still makes sense.

The Goldilocks Approach

CSS and HTML boilerplate Goldilocks Approach uses a combination of Ems, Max-Width, Media Queries and Pattern Translations to consider just three states that allow your designs to be resolution independent.

Gridpak – The Responsive Grid Generator

Gridpak is the starting point for your responsive projects, improving your workflow and saving time. Create your responsive grid system once using the simple interface and let Gridpak do the heavy lifting by generating PNGs, CSS and JavaScript.

BluCSS

BluCSS is a CSS framework designed with ease of use and simplicity in mind. It is specifically made so that when you’re working on your next project, you don’t have to worry about the essentials. With BluCSS, you can be up and running in less than a minute. One feature that stands out in this framework is responsive image functionality. Just apply any “blu_” class to an image, same as any other element, and the image will automatically be resized according to the browser width.

Free Fonts #3

Tomas — Tue, 23 Aug 2011 07:35:17 +0000

For this week I have only few fonts to share with you. Nevertheless, these are still good and usable typefaces. I’m sure you’d agree that it’s quality not quantity that matters.

1. Novocento – Download

Novocento is an uppercase-only font family inspired by european typographic tendencies of the first half of 20th century. You can use this font face for headlines, visual identities or short sentences. Created by graphic designer Jan Tonellato.

2. Quattrocento – Download

Quattrocento Roman is a Classic typeface with wide and open letterforms, and great x-height. Also it has good legibility for body text at small sizes and tiny details that only shows up at bigger sizes make it also great for display use. It’s available for web use in Google font library.
Quattrocento is created by amazing self-taught type designer Pablo Impallari who has also designed the famous Lobster font. Check his website for more high quality fonts.

3. UNIK2 – Download

Unik2 is the updated version of Unik made in 2009 by DavidisCreative from Fonts of Chaos. If you are unfamiliar with Fonts of Chaos, it is an open type foundry founded in 2011. They produce alternative free typefaces for experimental graphic artwork. Although Font of Chaos still are young and fresh they have already created seven interesting and unique typefaces. So if you are looking for more fonts like Unik2 for your artwork you should definitely check their website.

Free Google Plus Icon

Tomas — Thu, 11 Aug 2011 12:10:25 +0000

A few days ago I created this simple icon for people who have Google+ account. Three different sizes (48px, 32px, 24px) of icons in PNG format are included in the zip file, as well as Illustrator file for customization. I hope this icon will be useful for you. Feel free to download and use this item for both personal and commercial projects.

Download File »

6 Free High Resolution Old Wall Textures

Tomas — Sat, 06 Aug 2011 14:07:55 +0000

As I walk the streets in my free time I usually have my camera with me in case I spot something interesting and useful. In the last few weeks I was taking pictures of old walls in the old town of Vilnius and have a set of six free high resolution old wall textures for you. This set is free for use in both personal and commercial projects. Enjoy!

Download set »

Simple Progress Bar PSD

Tomas — Thu, 04 Aug 2011 17:13:38 +0000

Simple blue progress bar from upcoming User Interface set, that I hope to finish very soon. Feel free to download and use this item for both personal and commercial projects. Just don’t forget to link back to this website ;).

Download File »

Free Fonts #2

Tomas — Fri, 29 Jul 2011 09:48:07 +0000

This week’s selection of free fonts. Most of them have only one weight but it’s still useful to have them in your collection.

Important! Be sure to read the license of each font before using them for commercial projects.

1. Zil Slab – Download

Nice semi-slab-serif font. Kind of looks like famous Museo. Created by Igor Fonseca.

2. AleksandraC Vintage – Download

Beautiful font created by Aleksander Shevchuk.

3. Egypt 22 – Download

Egypt 22 is an experimental and geometric font from Practice Foundry. The reason the font is named “Egypt 22″ is because it explores the concept of symbols in languages. Created by Designer Ivan Kostynyk.

4. RBN2 – Download

RBNo2 is a new gothic sans-serif font designed by Rene Bieder for Fontfabric. Light and Light Alternative versions are for free, however if you want to have whole family you have to pay. Full family will include Light, Regular, Bold, Black and Alternative.

5. Vinegar – Download

Beautiful serif font from type designer Tjarda Koster aka Jelloween from Netherlands. She has been making fonts since late 2005. And I’m really impressed by the quality of her work. You can download most of Tjarda fonts for free, so check her portfolio for more.

6. Jokal – Download

Jokal is a hand-crafted serif font by Bold Perspective.

7. Moksha – Download MAC Download PC

Grunge font created by Eduardo Recife from Misprinted Type.

Free Fonts #1

Tomas — Mon, 18 Jul 2011 17:46:08 +0000

To help you save some time and money I decided to start a series of posts about free fonts. Every week I will share a list of fonts that are worth looking at. So, have a look at this week list.

Note! I provided the links to download the fonts from Maze of Minds blog, but don’t forget to visit authors’ pages for more stuff and give them credits that they deserve.

1. Weston Regular & Light All Caps – Download

WESTON is a new rounded slab-serif font designed by Pavel Pavlov for FontFabric type foundary. Free version comes in regular & light all caps.

2. Sheep Sans Regular & Bold - Download

Sheep Sans is a sans-serif font created by Álvaro Oveelha from Brazil. Font has regular and bold weights.

3. Piron V.2 Regular & Stencil - Download

Beautiful font from “typedepot“, a small type design studio from Bulgaria. Piron V2 comes with improved letter forms and widths. Letter spacing and kerning were significantly improved too. Also you will find more characters in this version.

4. Banda Regular – Download

Banda is a semi-serif typeface characterized by a tall x-height and rounded semi-serifs. Although it was first designed as a display typeface Banda quickly evolved into more complex type consisting of 7 weights plus italic. This font is also created by typedepot. Free version has only one weight, regular.

4. SD Georgia Light - Download

SD Georgia Light was designed by Justin Rotkowitz from Florida, United States. This font is specially tweaked for high-density offset printing, also can be used for web.

6. Sansus-Webissimo-Regular – Download

Sansus Webissimo web font is ideal for website designers and bloggers. Designed by Sergiy Tkachenko from Kremenchuk, Ukraine. If you like it, check out his portfolio on behance for more free fonts.

7. Designosaur Italic - Download

Second font from Sergiy Tkachenko portfolio that caught my eye.

8. DUNN Regular & Bold - Download

A modular geometric typeface from Typodisiac independent modern type foundry from Istanbul, Turkey. The letters are created by modifications of only rounded rectangles. Free version has light, regular and bold weights.

9. BUGG - Download

Strong, experimental typeface created by Emilio Correa from Mexico. Free version has one weight.

Coming Soon – Free PSD

Tomas — Tue, 12 Jul 2011 09:28:41 +0000

Before lunching our WordPress site we needed a simple and nice looking “placeholder” theme to inform early visitors about our upcoming site. So we have created MofM Coming Soon WordPress theme.

It comes with a jQuery countdown timer to inform your visitors of the launch date, social network buttons to increase your online presence and an email subscription form to allow visitors to sign up for updates. The theme includes easy to use options panel and offers two alternative color schemes – dark and light.

Today we give you free PSD file.

Download File » View Demo » Buy Theme »