Ketchup Bottles & The Physicality Of Design

flyosity 发表于 2012年01月02日 12:38 | Hits: 2751
Tag: Apple | Design

At lunch earlier today I snapped a picture of the top of a Heinz ketchup bottle.

Heinz Ketchup bottle cap

It's not remarkable, but it caught my eye because the look of the embossed text in the cap is exactly the look that so many designers are trying to replicate these days, myself included. What look is that?

The emulation of physicality.

A current trend in the design of digital interfaces is tosubtly hintthat the objects on the screen have weight, volume and surface undulations like they would if they were manufactured and held up in front of you. This is why Apple puts defined, shiny gloss lines on buttons and toolbars: because they'reemulating a plastic lens shapeand how lenses interact with light. Lensesrefract lightin precise ways and the specific coloring, gradients and glows used in iOS toolbars and buttons were put there specifically to make them look more like a long, plastic convex-on-both-sides piece of glass instead of just pixels on a screen.

Imagine if the iPhone's interface were manufactured and put up on a wall. There'd be realistic textures like linen, leather, shiny plastic and matte aluminum. These textures wouldn't all sit at the same distance from the surface, they'd be staggered — some elements indented, some elements poking out — because the real world isn't flat. Everything is either convex or concave, shadowed or highlighted. Just look at how many angles and surfaces a simple light switch has. Convex, bubbled text that casts a shadow. Indented, shadowed crevices. Light-to-dark gradients on surfaces.

Light switch

Andpeoplealloverare putting realistic switches into digital interfaces. They're trying to emulate the highlights, shadows and gradients that a real switch has when lit from above. Indented buttons, convex panels, glossy shines, textured mattes, embossed text, and it goes on. These are the elements that interface designers use to make their products appear touchable, tactile and hefty.

Now this physical emulation of real objects can betaken too far, but just like with everything else, moderation is the key. Some of the top apps in the App Store use these exact techniques to great effect. Theleather and embossed buttonsin Camera+. Theindented and matte tweet actions rowin Tweetbot. Thetextured opening screenof Path. You may not immediately notice these little details, but they make digital interfaces appear more valuable, like little hand-crafted executive paperweights: expensive, heavy and solid.

The pixel-perfect emulation of physical surfaces and lighting in a digital interface is the secret weapon of interface designers. Little touches like panels that are slightly indented and shadowed, subtle cloth-like texturing, and white highlights on embossed label text may not be immediately perceptible, but they add a richness to the overall experience that most apps just don't have.

原文链接: http://feedproxy.google.com/~r/Flyosity/~3/NI5U0k6jTFs/ketchup-bottles-the-physicality-of-design.php

0     0


可以不填写评论, 而只是打分. 如果发表评论, 你可以给的分值是-5到+5, 否则, 你只能评-1, +1两种分数. 你的评论可能需要审核.