This article was published 9 years ago, therefore the contents of this post may be out of date.

As designers, developers or even graphic designers we are constantly looking at for those new resources, tools and application that can help us increase our productivity while working on client or personal work. Down below I’ve included everything from some great JavaScript tools, jQuery plugins, Apps for your Desktop, Web & Mobile devices to some awesome items in HTML5, CSS etc and including some frameworks. And as always, I’ve also got some WordPress themes and plugins including some fonts, UI kits, icons etc

JavaScript & jQuery Plugins

Svidgets.js

svidget

Svidget.js is a JavaScript framework for creating immersive and fully interactive SVG widgets. By componentizing your data visualizations as widgets, you can quickly and easily embed them on any website while keeping a clean separation between SVG and HTML.

Rainydays.js

rainyday

The idea behind Rainyday.js was to create a JavaScript library that makes use of the HTML5 canvas to render an animation of raindrops falling on a glass surface. It’s features extendable API, collision detection and is easy to extend with your own implementations of different animation components. It is a pure JavaScript library which uses HTML5 features so it’s supported by most of the modern browsers.

Dom Animator

Dom-Animator

Dom Animator is a nifty JavaScript library, used to show small ascii animations within comments in your dom. You can say this nifty item is a little easter egg for anyone inspecting your code. Nothing more, nothing less .It is a stand alone library so no jQuery, or the likes, so usage is pretty straight forward.

Cta.js

cta

cta.js or “Call to Animation” is a light-weight performant library to animate any element (“action”) onto any other element (“effect”) on the page.It is written with an aim to promote visual continuity in web apps.

Skit

skit

Skit is a pure JavaScript frontend for building better web clients.  Featuring nearly 100% shared server and client-side code, zero configuration, automatic static resource bundling, and built-in server-side rendering.

Desktop, Mobile & Web Applications

Facebook Messenger *Official – Multiple OS – Free

messenger

With Facebook Messenger you can instantly reach the people in your life all for free. As Messenger is just like texting, but you don’t have to pay for every message as it works with your data pla).  This is not just for Facebook friends but you can message people in your phone book and just enter a phone number to add a new contact. With this app you can even do group chats by creating groups for the people you message most. Name them, set group photos and keep them all in one place.

You can even shoot videos and snap selfies or other photos right from the app and send them with one tap, plus you can do free calls and talk as long as you want, even with people in other countries as calls are free over Wi-Fi. Otherwise, standard data charges apply.)

Napkin Sketch – iOS App – Free

Napkin-Sketch

Napkin is a lightweight user interface design tool made for mocking up quick ideas directly on your iPhone. You can add various layer types to the canvas such as: rectangles, photos from your camera roll, text, and icons. Double tapping any layer reveals its own contextual controls which mirror what you would expect from other popular desktop interface design tools.

For example, on rectangle layers you can edit the color, corner radius, drop shadow, and alpha. Additionally the controls for each layer allow for locking and unlocking, moving it in front or behind other layers, or simply deleting it. Another great feature of Napkin is quickly being able to duplicate any layer by tapping it with two fingers.

All layers snap to a grid which you can define in the sidebar menu, therefore aligning layers is a breeze. When you background the app, your mock is saved and will be waiting there for you the next time you launch the app. You can make a screenshot to share your mockup.

Screenshot Builder – Web App – Free

Screenshot-Builder

Screenshot Builder is a simple screen builder that create gorgeous images for your App Store page in minutes

UberFaces – Photoshop CC & CC 2014 Extension – Free

uberface

UberFaces – an analogue of the plug-in for generating random user ” Random User Generator “, only the latest versions of Photoshop CC and CC-2014.

Ugly Email – Chrome Extension (Firefox Coming Soon)

Ugly-Email

Ugly Email is a Gmail extension that allows you to see if the email is being tracked before opening it. It seamlessly integrates with Gmail. Ugly Email safely sniffs through the emails in your inbox and exposes the emails that are being tracked. Every tracked email is marked with the “evil eye” so you can easily identify them.

CSS, HTML, Frameworks & Other Great Items

Grav CMS

grav

Grav is a fast, simple and flexible file-based web-platform, there is Zero installation required you simply extract the ZIP archive, and you are already up and running. It follows similar principals to other flat-file CMS platforms, but has a different design philosophy than most.

Grav comes with a powerful Package Management System to allow for simple installation and upgrading of plugins and themes, as well as simple updating of Grav itself.  The underlying architecture of Grav has been designed to use well-established and best-in-class technologies, where applicable, to ensure that Grav is simple to use and easy to extend.

Primer

primer

Primer is the CSS toolkit that powers GitHub’s front-end design, it’s purposefully limited to common components to provide the developers with the most flexibility, and to keep GitHub uniquely GitHubby. It’s built with SCSS and is available via Bower, so it’s easy to include all or part of it within your own project.

It’s available for use under the MIT license and built with open source projects like SCSS, Jekyll, Grunt, and more. It includes a small Gruntfile for compiling SCSS, Autoprefixer for vendor prefixes, and Parker for CSS stats.

Pexels Videos

pexels

Pexels is a huge platform for free stock photos. Many designers and bloggers use it every day to find photos for their personal and commerical projects. Now we would like to introduce Pexels Videos. The only difference is that its purpose is to find free videos instead of photos.

RWDGrid

rwdgrid

rwdgrid is just another Grid system based on popular 960grid, which is responsive and ranges from mobile, tablet, laptops and wide screen displays. Naming convention is very similar to 960 grid system, where underscore is replaced by hyphen (increases readabilty). rwdgrid is having different Grid system made for 1200px+, 1024px+, 720px+ and Mobile screens.This can be used as a base grid system that will help you to build responsive webdesign with your existing proficiency over popular grid system It’s works with IE8+, Firefox, Chrome, Safari, Opera, PSD Grid & included and you are free to use and Abuse it.

Web UI Trends Present & Future: Dramatic Typography – eBook

Web-UI-Trends-Present-&-Future--Dramatic-Typography

With this ebook you willlearn how to apply typography best practices from only the best hand-picked examples.

Tentative Podcast

tentative

Tentative is a podcast about digital product design, hosted by thoughtbot designers Reda Lemeden & Kyle Fiedler

Google Prediction API

Prediction-API

You can use the Google’s Prediction API machine learning algorithms to analyse data and predict future outcomes using a familiar RESTful interface. You can easily predict future trends using historical data. Route messages, detect spam and recommend products for users by using Prediction API.

As your data is replicated across multiple data centers using Cloud Storage and as most prediction queries take less than 200ms with greater performance is available. Prediction API can integrate with App Engine, and the RESTful API is available through libraries for many popular languages, such as Python, JavaScript and .NET. Limited usage is free for the first six months. Beyond that, Prediction API’s comprehensible pricing comes with a 99.9% availability service level agreement. Like other Cloud products, you pay for what you use.

Rebar Grid Framework

rebar

Rebar is aimed to make responsive development more efficient and keep CSS organised. The idea is to setup a list of breakpoints and assign container or grid settings for each breakpoint at one time. It uses padding for gutter and works the same way as the Bootstrap 3 grid system does.

So if you’re already familiar with Bootstrap, you will find Rebar is easy to use and far more flexible.Rebar requires Sass 3.4 or Stylus and is incompatible with Libsass 3.1.

Typography Cheatsheet

Typography-Cheatsheet

Typography Cheatsheet is a comprehensive guide to using proper typographic characters, including correct grammatical usage.

Cachet HQ

cachet-hq

Cachet HQ is an open source status page system, for everyone. It shows beautiful & simple service statuses. Cachet has been beautifully built, both by design and code. Using Bootstrap 3, Cachet is completely responsive and works perfectly on mobile, tablet and desktop devices.

WordPress Plugins & Themes

WP Ultimate Post Grid – Free Plugin

WP-Ultimate-Post-Grid

When using the WP Ultimate Post Grid plugin you can  create responsive grids for your posts, pages or any custom post type. Optionally add an isotope filter for any taxonomy associated with those posts.

Sweet Alert Addon for CF7 – Free Plugin

sweet-alert-add-on-for-contact-form-7

Simply this plugin adds the Sweet Alert script into you Contact Form 7 plugin submission process.

Gift Certificate Creator – Free Plugin

Gift-Certificate-Creator

The Gift Certificate Creator WordPress plugin allows you to manage gift certificates on your website. In a convenient front-end UI provided by this plugin, your site visitors can enter the amount and user details. On form submission, the user details will be sent to the administrator. Also, the administrator can view the list of all the certificate requests.

WP Designer – Free Plugin

WP-Designer

WP Designer allows you to add extra functionality to your site in a standard compliant way using customization best-practices. It allows you to keep the site functionality outside the theme so that it is not dependent on the theme. This comes in handy in various scenarios like when you want to create Custom Post Types, Custom Taxonomies etc. This also allows you to have one single place where you keep all your edits.

Royal Quotes – Premium Plugin $17

Royal-Quotes

Royal Quotes is a Testimonials Grid Extension for WordPress Layers Site Builder. Display modern, well-styled testimonials with flexible layouts on your website.

Provides unlimited testimonials in a Grid layout with more than 20 000 display combinations, including style, position and hover animations. Using CSS3 animations, it is compatible with all major browsers and offers responsive display to ensure the best performance on any devices.

Tabsy Customizer – Premium Plugin – $8

Tabsy-Customizer

Tabsy is a free smart responsive wordpress tabs plugin that is designed to fit on every container width beautifully.

Being able to insert wordpress contents, images and shortcodes are one of the best handy features you can utilize by the use of this amazing plugin. You can use tabsy anywhere you want. Add it on the sidebar, widgets or content section. Now you don’t have to worry if the tab navigation will overlap on smaller container size.

Image Accordion & Profile Panel for VC – Premium Plugin $9

Image-Accordion-&-Profile-Panel

Add Image Accordion & Profile Panel in the Visual Composer. Give user the flexibility to display accordion with image or profile header with avatar easily in Visual Composer.

WooCommerce Every Order Coupon – Premium Plugin $15

WooCommerce-Every-Order-Coupon

This plugin is for those who sell on line using WooCommerce.. This plugin will give the customer a coupon who has completed a order the for their next order. This way, after the first order, they will get a discount and be more motivated to come back.

Unused coupons will be visible for the customer on their “My Account” page. The generated coupon needs a role model coupon, which can be configured via Coupons managements in WooCommerce.

Animated SVG Browser Icons – Premium Plugin $6

Animated-SVG-Browser-Icons

These animated SVG icons are the perfect way to tell your customers that your app, theme, or game works perfectly in all (or some) major browsers.

Add icons with just a couple clicks using Visual Composer or the WordPress text edtor. They only animate when they’re visible on your screen. They’re all SVGs (scaleable vector graphics), which means that you can make them any size and show them on any screen (even retina), and they’ll look 100% crisp and clear.

iCraft – Free Theme

icraft

The i-craft responsive WooCommerce ecommerce multipupose theme packed with features like product carousels, unlimited color, boxed/wide layout, product search, optional login menu item and shopping cart in main navigation, multiple blog layout, etc. It comes with custom slider and option to use any 3rd party slider in any page or post through page/post meta option. Perfect for start-up ecommerce web sites.

Advent – Free Theme

advent

Advent is a lightweight, clean, super flexible and bootstrap based responsive theme for business or personal websites. Advent Theme is built on top of Twitter Bootstrap which means that your site can be displayed on every device (pc, laptop, mobile devices, tablets etc) without horizontal scrolling. It has got custom widgets, theme-options etc in order to get it customized as per your needs.

Fara – Free Theme

fara

Fara is a simple masonry theme that displays your posts in an elegant, content focused manner. It includes color options, logo and favicon options and Fara also lets you use any font from Google Fonts.

Sensible WP – Free Theme

sensible

Sensible is a responsive, multi-purpose theme which can be used for any type of website. It is a flexible theme which can be used to help build an online presence with attractive features. We made this theme with everyone in mind. Business? No problem. Are you a Agency?, Knock yourself out. Just trying to get a blog up? This theme is perfect for it. This theme is completely customizable through the WordPress Theme Customiser.

Piero – Premium Theme $58

piero

Peiro is a stunning and professional Corporate/Freelance/Agency/Creative theme, this theme comes with a clean, modern and crisp design perfect showcasing your business/creative work. Perfect for corporate, creatives, freelancers, photographers, fashion and music, we have created some stunning ready to go pages for you to launch your site with ease.

Frame – Premium Theme $58

frame

Frame Magazine Responsive WordPress Theme is a pretty designed wordpress theme especial for news and magazines web sites. But it can be used by any other website. The theme is fully responsive and will work perfect on your PC, laptop, tablet or mobile phone. We spent a lot of time to make the design unique and the result is impressive.

You can change the visual Theme Skins using Theme Options panel. You can paste your custom color and change the color scheme on all the site. You can upload a custom background (color, image, pattern). You can change the fonts (select from 600+ Google Fonts). With Frame Theme you can do everything you want.

Minimalize – Premium Theme $58

minimalize

Minimalize is a Fully responsive, flexible, and minimal one-page portfolio WordPress Theme. Comes with dark and light skins.. Use it to showcase your brand into a single page, to create product promotion page, landing page etc. Mimimalize allowing you to customize, and re-order any section and get creative with all possible layout options with various assets like sliders, header variations, shortcodes, carousel, Galleries, Masonry blog, portfolio sections, Contact Forms, Infinite Scroll and more! Admin Panel with endless possiblities to modify layout, styling, fonts, and colors easily.

Woo-Commerce support to build your shop in minutes, WPML multi language plugin compatiblity, 2 premium touch enabled & responsive 2D, 3D slider show plugins included, Parallax background option with images and video (self-hosted, youtube, vimeo) added with SEO friendly semantic markup etc.,

Builder Construction Architect Renovation – Premium Theme $58

construction-theme

The theme is built for Building Services, Architecture, Engineering, Cleaning Service and other Construction related services and it is suitable for any kind of small business activity – Maid, Maintenance, Painting and Decorating, Refurbishment, Partitions & Ceilings, Plastering & Rendering, Carpentry & Joinery, Built in – Furniture, Flooring, Plumbing and others. It has purpose oriented design and comes with Opening Hours, Free Consultation / Appointment Form, practice areas, case results, Q&A and team members pages.. It is suitable for users with zero programming skills as well as advanced developers.

Design Pieces – Icons, UI’s & Typography

Mayhem – Free Font

mayhem

Gluten – Free Font

gluten

Lawson – Free Font

lawson

Jekyll and Hyde – Free Font

Jekyll-and-Hyde

Hamster Script – Free Font

hamster

Bambino – Fonts from $29

bambino

Nevo – Fonts from $37

nevo

Volte – Fonts from $39

volte

Muller – Fonts from $47

muller

Epic Outlines Icons Font Based

Epic-Outlines-Icon

Major websites Icon Set – For Sketch

Major-websites-Icon-Set-for-sketch

Wireframer icon pack

Wireframer-icon-pack

Free Material Design Ui Kit

Free-Material-Design-Ui-Kit

Yosemite UI Kit

Yosemite-UI-Kit

Share

New HandPicked Goodies for Designers & Developers for April 2015