jan korbel

Two tutorials by Codrops: Understanding the CSS Clip Property and Putting CSS Clip to Work.

Jason Fried writing for the Inc.

You don’t have to analyze the bottle like I just did to understand that it is well designed. You know it, because you can see the bottle, feel it, and use all of its features immediately. You can see where it starts and ends. It is not complicated. It is in balance with its purpose. Imagine a bottle without a spout or a bottle that was burning hot or a bottle that was as slippery as ice. Every reasonable person would know that wouldn’t work.

Contrast that with software. What are the criteria for evaluating software? Software doesn’t have mass. It doesn’t have shape. It doesn’t cast shadows. It has no edges. It has no size. You can’t pick it up. You can’t feel it. It doesn’t obey the laws of physics. It’s not really even there. Nothing is pushing back, saying, “That’s a bad idea; that won’t work; that’s going to burn someone or hurt someone or make someone drop it or…” Almost none of the tools we’ve developed to evaluate physical objects apply to software.

This is why most software goes bad over time.

Glenn Reid writes:

I can still remember some of those early meetings, with 3 or 4 of us in a locked room somewhere on Apple campus, with a lot of whiteboards, talking about what iMovie should be (and should not be). It was as pure as pure gets, in terms of building software. Steve would draw a quick vision on the whiteboard, we’d go work on it for a while, bring it back, find out the ways in which it sucked, and we’d iterate, again and again and again. That’s how it always went. Iteration. It’s the key to design, really. Just keep improving it until you have to ship it.
[…]
One of the things about designing products that can come up is Ego, or Being Right, or whatever that is called. I’m not sure how this evolved, but when I worked with Steve on product design, there was kind of an approach we took, unconsciously, which I characterize in my mind as a “cauldron”. There might be 3 or 4 or even 10 of us in the room, looking at, say, an iteration of iPhoto. Ideas would come forth, suggestions, observations, whatever. We would “throw them into the cauldron”, and stir it, and soon nobody remembered exactly whose ideas were which. This let us make a great soup, a great potion, without worrying about who had what idea. This was critically important, in retrospect, to decouple the CEO from the ideas.

Via @daringfireball

John Gruber fireballs:

The trend away from skeuomorphic special effects in UI design is the beginning of the retina-resolution design era. Our designs no longer need to accommodate for crude pixels. Glossy/glassy surfaces, heavy-handed transparency, glaring drop shadows, embossed text, textured material surfaces — these hallmarks of modern UI graphic design style are (almost) never used in good print graphic design. They’re unnecessary in print, and, the higher the quality of the output and more heavy-handed the effect, the sillier such techniques look. They’re the aesthetic equivalent of screen-optimized typefaces like Lucida Grande and Verdana. They work on sub-retina displays because sub-retina displays are so crude. On retina displays, as with high quality print output, these techniques are revealed for what they truly are: an assortment of parlor tricks that fool our eyes into thinking we see something that looks good on a display that is technically incapable of rendering graphic design that truly looks good.
…
If you want to see the future of software UI design, look to the history of print design.

I mostly agree, but I would be carefull with relying on the print for guidence to future software UI designs. For one thing, print is not interactive, neither is used to get the job done in the same way software is.

I agree we are at the beginning of the swing in the opposite direction from skeuomorphism and I think we will overdo it, as we always do.

The evolution of design is sort of tacking against the wind.

Another example of what I call primary research in HTML5, CSS & JavaScript:

FFF is a collection of interactive experiences. Each experience has its own unique design and functionality. All the experiences are created in HTML5, the site works beatifully on both desktop and tablet.

Inspiration on font combinations used on real web sites.

Via @agilek

Shapeshift is like Masonry but with drag & drop. Touch support included.

Good people at Online MBA have sent me a link to this video.

Title says it all.

Via @machal

Choose a pattern and print it. Nice tool by countryman Rastislav Blaha.

Some good thinking done by Chris Norström. Solves the confusion of the classical “iPhone slider”, where you are not sure if the visible status (OFF) is the active one, or you have to switch to get to it.

Article written by Kontra and goes along these lines.

Apple’s software problems aren’t dark linen, Corinthian leather or torn paper. In fact, Apple’s software problems aren’t much about aesthetics at all… they are mostly about experience. To paraphrase Ive’s former boss, Apple’s software problems aren’t about how they look, but how they work.

Via Daring Fireball

Stefan Klocek writing a good one for the Smashing Magazine:

In this article, we’ll introduce you to a strategy for fixing the broken experience that starts with surface improvements, goes progressively deeper into structural issues and ends with a big organizational shift.

A marketplace for premium Bootstrap themes and templates.

Nice things happen when standards come up.

Brian Groudan on Mozilla UX blog:

I worked closely with Mozilla user experience researchers and designers to rethink how Firefox can better offer “save for later” in the browser.

Overview of the design process phases follows.

Looks usefull.

Via @robinraszka

Nice overview how to code for high pixel density (160 PPI and up) displays.

Via @daeltar

Nice work by Kiandra team.

Jetstrap may be useful.

Via @jakubspanihel