Menu Search
Jump to the content X X
Smashing Conf New York

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. upcoming SmashingConf Barcelona, dedicated to smart front-end techniques and design patterns.

Posts Tagged ‘Tools’.

We are pleased to present below all posts tagged with ‘Tools’.

Useful WordPress Tools, Themes And Plugins

If you're looking for some great ways to improve your WordPress workflow, read on for a massive collection of free themes, plugins, tools and tutorials. These resources were all linked via the Smashing Magazine Twitter stream, Facebook stream, and other social-media streams around the Web.

Useful WordPress Tools, Themes And Plugins

These awesome resources have now been organized and consolidated for easy reference to help you get the most out of the world's #1 publishing platform. Enjoy!

Read more...

Gridpak: The Responsive Grid Generator

This article is the fifth in our new series that introduces the latest, useful and freely available tools and techniques, developed and released by active members of the Web design community. The first article covered PrefixFree; the second introduced Foundation, a responsive framework; the third presented Sisyphus.js, a library for Gmail-like client-side drafts and the fourth shared with us a free plugin called GuideGuide. Today, we are happy to present Erskine's responsive grid generator: Gridpak.

Gridpak: The Responsive Grid Generator

In the near 18 months since A List Apart published Ethan Marcotte’s article Responsive Web Design much has changed in the way we approach our design process. The new responsive attitude described in the article embraces device agnostic design, flexibility and the undefined canvas. Whilst John Allsopp’s A Dao of Web Design laid the foundations for change, Ethan’s article—alongside a maturation in technologies and a coinciding mass movement towards mobile browsing—really set the scene for a new design ethos.

Read more...

The UX Research Plan That Stakeholders Love

UX practitioners, both consultants and in house, sometimes conduct research. Be it usability testing or user research with a generative goal, research requires planning. To make sure product managers, developers, marketers and executives (let’s call them stakeholders) act on UX research results, planning must be crystal clear, collaborative, fast and digestible. Long plans or no plans don’t work for people..

The UX Research Plan That Stakeholders Love

You must be able to boil a UX research plan down to one page. If you can’t or won’t, then you won’t get buy-in for the research and its results. This article addresses one key aspect of planning UX research: the one-page plan document. Before we get to that, we’ll briefly discuss the benefits of research planning and identify the audience of a research planning document.

Read more...

GuideGuide: Free Plugin For Dealing With Grids In Photoshop

This article is the fourth in our new series that introduces the latest, useful and freely available tools and techniques, developed and released by active members of the Web design community. The first article covered PrefixFree; the second introduced Foundation, a responsive framework; the third presented Sisyphus.js, a library for Gmail-like client-side drafts. Today we are happy to present Cameron McEfee's Photoshop extension GuideGuide which provides a tool to create pixel accurate columns, rows, midpoints and baselines.

GuideGuide: Free Plugin For Dealing With Grids In Photoshop

Take a moment and think about creating a multi-column grid in a Photoshop comp. Have your palms started to sweat? Yes, creating grids in Photoshop is a pain indeed. Some designers just estimate and drag guides arbitrarily onto the stage. Others draw vector shapes, duplicate them to represent columns, then stretch them to fit their design. The hardy few who don’t say things like, “I’m a designer, not a mathematician,” generally use a little math and logic to calculate their grid.

Read more...

The Messy Art Of UX Sketching

I hear a lot of people talking about the importance of sketching when designing or problem solving, yet it seems very few people actually sketch. As a UX professional, I sketch every day. I often take over entire walls in our office and cover them with sketches, mapping out everything from context scenarios to wire frames and presentations.

The Messy Art Of UX Sketching

Although it’s sometimes easier to start prototyping on a computer, it’s not the best way to visually problem solve. When you need to ideate web site layouts, mobile applications or story board work flows and context scenarios, sketching is much more efficient. It prevents you from getting caught up in the technology, and instead allows you to focus on the best possible solution. Giving you the freedom to take risks that you might not otherwise take.

Read more...

Useful Coding Tools and JavaScript Libraries For Web Developers

Everyone who is a regular Smashing Magazine reader will know that we have a traditional habit of regularly researching the latest resources, tools and services out there on the Web, as productivity is a crucial asset of professional Web designers and developers. We could, and should, all integrate workflow optimization into our working practices.

Stripe: Easy Credit-Card Processing For Online Stores

Perhaps we should warn you upfront for the long compilation, but what can we say — there are so many excellent tools out there which deserve attention of the community, yet unfortunately remain obscure way too often. We love all the designers and developers out there for releasing and producing useful, valuable resources for all of us to use! We, for one, surely sincerely appreciate it in the name of the Web design community. Whether you like it or not, here are some of the most useful coding and workflow tools released recently.

Read more...

PrefixFree: Break Free From CSS Prefix Hell

Editor's note: This article is the first piece in our new series introducing new, useful and freely available tools and techniques presented and released by active members of the Web design community. Lea Verou is well-known for her experiments with CSS and JavaScript and in this post she presents her recent tool, prefixfree which will hopefully help you break free from the CSS prefix hell.

prefixfree

The code I write in my live demo slides and presentations doesn’t have any prefixes, even for things like @keyframes or the transition property, which aren’t yet supported anywhere prefix-less. To be able to do this, I wrote a script that detects the prefix of the current browser and adds it where needed. Recently, I thought, why not adapt the script to process all of the CSS code on a page, so that the CSS in my style sheets is as elegant as the code in my demos? Shortly after, prefixfree was born.

Read more...

Free Download Free Download: Cheat Sheet For Designing Web Forms

Forms, forms, forms, often overlooked when it comes to design. In this post we are glad to release a Form Design Cheat Sheet, created by Joe Leech and released for Smashing Magazine and its readers. This crib sheet contains an Omnigraffle template, Photoshop (PSD) and PDF examples for you to download and use how you wish. Print it out, stick it on your wall, send it to your clients, generally help make everybody’s forms a bit better.

Form Design

The designers of the crib sheet have spent years designing and testing forms for their projects and decided to summarize the most common problems and issue that they've seen quite often in their projects. As usual, the goodie is absolutely free to use in private and commercial projects. The crib sheet is released under a Creative Commons license.

Read more...

Sidenote: LiveReload For Better Workflow

Welcome to the first entry in a new series on Smashing Coding called Sidenotes. Sidenotes are shorter than traditional Smashing Magazine articles and are designed to give you a quick introduction to useful tools and services. Over the next few weeks, we’ll be looking at productivity aids, useful apps, essential plugins and code examples that we think will help you in your daily coding work. If there is a tool, product or service that you think would be great to review, please do get in touch and let us know.

LiveReload

First up is LiveReload, a utility that eliminates the need to refresh the browser when you want to see HTML, CSS and JavaScript changes.

Read more...

↑ Back to top