Posted on September 5, 2013

Web Design & Development Resource Roundup – September Edition

Here’s the September round-up of resources. Scroll through these creative and techy tools to get inspired, learn some shortcuts and hopefully uncover some treasures you’ll be able to come back to again and again.

HTML, CSS & JavaScript related resources:

For all you context loving developers, restructure HTML in a responsive manner with Intention.js.

1

Parallax.js reacts to the orientation of your smart device or cursor, offsetting layers depending on their depth within a scene.

2

Scroll-overflow menu for mobile by Hugo.

5

Countable is a JavaScript function to add live paragraph, word and character counting to an HTML element.

6

FlowType.JS is responsive web typography at its finest: font-size and line-height based on element width.

9

Javascript loading bars are all the rage. NProgress is a JavaScript library to help you achieve it.

10

Tridiv is a web-based editor for creating 3D shapes in CSS.

12

Emmet LiveStyle introduces live bi-directional CSS edit of new generation.

20

Swipe. Press. Tap. Flick. Precomposed Touch Gestures.

23

Tf3dm: Get Free 3D Elements.

24

Just-add-water CSS Animations: Animate.css.

25

RandomUser is an API that provides you with a randomly generated user. These users can be used as placeholders in web mockups, and will save you time from creating your own placeholder information.

11

Design related resources:

Canva is an “amazingly simple graphic design” tool giving anybody anywhere the opportunity to get creative, collaborate and design.

3

Basilig: Over 300 design elements specifically for prototyping –  a set of freehand icons for mockups.

4

iPhone5 flat design mockups with front, horizontal and 3D views from Pixeden.

flatphone

The iOS 7 Design Cheat Sheet by Ivo Mynttinen.

8

Get inspired by Type Hunting.

13

HTML5 Device mockups – With Pixelsign, you can embed your designs and products in a variety of devices that keep their aspect ratio respectively.

14

Colorgorize is a web design gallery sorted entirely by color. You can browse sites, or search by specific color.

15

Social Media Spec Guide from Visual.ly – the only dimensions you need to know if you are designing content for social media.

16

Productivity and efficiency hacks – Cheat Sheets for PhotoShop and Illustrator Keyboard Shortcuts by who else than LifeHacker.

17

MockuPhone: Great tool for placing images on mobile device screens.

18

TypeWonder is a fun little beta for making picking web fonts fun.

21

SnapMyAd: User created social ads.

22

Pulling this stuff and sharing with ya takes a lot of time. I’m a pretty busy dude, but want to spread inspiration and great digital tidbits with fellow designers, developers and marketers. That being said please share this with someone you think will love it as much as you did, or just shoot me some love on twitter @petesena. Thanks and happy creating!