This article is a case study about the evolution of the BEM, a methodology that enables team members to collaborate and communicate ideas using a unified language that consists of simple yet powerful terms: blocks, elements, modifiers.

Learn about the challenges that a big company faces when gradually building an entire ecosystem of services with an ever-growing team of developers.
Read more...
There is so much to learn about WordPress theme development. The Internet is home to hundreds of articles about building WordPress themes, to countless theme frameworks that will help you get started, and to endless WordPress themes, some of which are beautiful and professional but not a few of which are (to be honest) a bit crappy.

Rather than write another article on building a WordPress theme (which would be silly, really, since any theme I build would fall into the “crappy” category), I’ve asked some of the top theme designers and developers to share some tips and techniques to help you improve and refine your theme development and design process.
Read more...
How do you convince clients to trust you with their valuable and much-loved product? In my experience, the best way to sell work to clients is to apply user-centered design not only to the work we produce, but also to the clients who commission that work.

We have to understand who our clients are, what is important to them and what their goals are. And then we have to deliver work that not only meets the needs of end users, but also satisfies the personalities within the company itself.
Read more...
Right up front, I’ll offer some simple advice: In production, your code should be as performance-friendly as possible. This means, Gzip’ing, concatenating and minifying as many assets as possible, thus serving the smallest possible files and the least number of files.

I don’t think anyone would argue that these suggestions aren’t best practices (even if we don’t implement them in every project). Now that we’ve got that out of the way, how can we use white space in development code to ensure that our files are as readable and maintainable as possible?
Read more...
With the rise of Web fonts as well as affordable hosted Web font services and ready-made kits, typography is reclaiming its title as design queen, ruler of all graphic and Web design. At the same time, for far too many designers, the main concern about typography today seems to be aesthetic in nature.

The problem is, we tend to use typography and lettering as two interchangeable terms, which they are not. The allure of well-executed lettering — and, boy, I could spend hours just looking at lettering portfolios! — can affect the way we view typefaces, because both typography and lettering share common visual concepts.
Read more...
In the previous parts of this tutorial (part 1 and part 2), we looked in detail at the building blocks of our design in Fireworks (pages, shared layers, symbols, styles), and we started to make a demo prototype in Fireworks.

The demo prototype had six pages, linked together by hotspots, and each hotspot was customized for use with TAP. Now that the six-page Fireworks PNG file is ready, it’s time to prepare it to be exported as a click-through prototype and then converted (with the help of the TAP extension) to an animated, gesture-based prototype that we can use on an iOS device.
Read more...
The products we build are full of feedback loops, whether we know it or not. People who study human behavior agree that feedback loops play a critical role in what we do. From biofeedback to the quantified self, designers and psychologists alike are discovering the real power that these cyclical interactions play in shaping our day-to-day choices.

Designing for behavior change can increase user engagement, create business value and improve lives. Whatever you’re designing, it probably involves feedback. Designing that feedback to be as effective as possible can mean the difference between a successful and failed product. This article discusses how to influence behavior by designing well-crafted feedback loops.
Read more...
If people are on your website, they’re probably either skimming quickly, looking for something, or they’ve found what they’re looking for and want to read it as easily as possible. Either way, keeping text readable will help them achieve their goal.

A few months ago, I wrote an article on “Avoiding Faux Weights and Styles with Google Web Fonts.” I ended the article by showing that weights and styles are an important UX element when setting text. Bold and italic forms of a font help people to skim your website.
Read more...
When I think about where we are with the Web in comparison to other media in history, pinpointing it is really hard. Is it like when the Gutenberg Press was just invented and we’re experimenting with movable type, or are we still embellishing pages and slavishly copying books by hand?

Our knowledge of building digital things changes rapidly, taking us from newborn to adult and back again every couple of years. It’s both exciting and frustrating, because just when you think you have it all figured out, it completely changes. But if you’re like me, learning something new keeps things interesting.
Read more...