Incase is apparently not just about making sexy and functional cases for devices but they also have great design sense when it comes to their online checkout process. The instant you add an item to your cart the process begins with lightboxed cart contents. This focuses the user specifically on the checkout process, rather then distracting them with items like navigation, banners or other sorts of graphics.

Add to Cart

The Checkout screen makes full use of the display area rather then asking the user to enter each piece of customer data on a separate page. They don’t beat you down to create an account but they make it easy in case you’d like to come back again. Shipping and tax is updated on the fly and you are given the chance to review the total cost before you submit your order.

Checkout is SO NICE!

There are other items about the Incase Web site which I like, but I think it’s important to give them respect for thinking about the user and not following the typical flow of most product driven ecommerce site.

We run across a lot of discussion whether the stage of wireframing a website is important or not. Should you avoid the process of wireframing and just dive into design? What is the purpose of wireframes and why many designers and developers implement this stage as part of their planning tool?

Wireframes are an essential tool of communication that provide a rough guide to website structure. Their purpose is to give guidence to general layout, navigational elements, and content structure to designers, developers and clients. The stage of wireframing is achieved after the process of sitemaps has been approved. At this time, you should have in your hands a site structure in a hierarchical style. Here at Imulus, we take time at a wireframe stage in order to run the design and developing stage smoothly. Only an educated client will understand this process if explained. Sure, all clients would like to see their website redesigned in 24 hours…that would require a lot of java. We take time to explain to our clients why this stage is important to us and to them as well. They will understand.

Our designers will work through the wireframe stage to completion and then will sit down with our developers to discuss the many possibilities. This opens different perspectives which are always handy to get everything on track. For example, when it comes to talking about some special functionality feature for the site, it is a good thing that developers know this ahead of time and see what’s expected. They can see what problems they can run into and how to solve them ahead of time. It is too late if this got avoided when the design is already in development. As for the designers, it is easier to have a wireframe in hand. You get the idea where things are supposed to be, and start to visualize the design. Try to have some fun with wireframes. OK, sure, they can get boring sometimes especially when it comes to some revisions but that’s all because you’re anxious to start the designing and developing. Also, you don’t have to adhere strictly to what the wireframe is showing. We have run across many times where the wireframe was showing one thing, but in the design stage we have changed it. It’s all right to change the wireframe in the design stage as long as the purpose and direction is not lost. My advice is to spend whatever time necessary to complete the wireframing stage; it will make your job easier in the design stage, and will save headaches to developers, as well as to clients.

A book recommendation to follow on a wireframing stage: Web Redesign 2.0 | Workflow That Works by Kelly Goto & Emily Cotler

If you browse around online much, you might have seen people talking about HDR photos, or seen beautiful or weird looking photos that had HDR in the title. If you don’t know about HDR photos or are interested in them, keep reading. If you already know, move on because this will be a brief and simple introduction.

HDR stands for High Dynamic Range, which basically means more dynamic range than we have seen in the past. This is not to be confused with HD (high definition) or more pixels. Dynamic range is the title given to the ‘light levels’ of something a human is capable of seeing. A real world example would be a picture of a sunset. When the human eye looks at the sun for long enough, it hurts your eyes and burn your retinas. When a picture is viewed of the same sunset, no harm can be done since the light levels (dynamic range) are not the same, they are mimicked. Dynamic range can be defined as the ratio between the lightest and darkest element in a scene.

So the potential dynamic range of a piece of paper is nowhere near the real world, which is why pictures look like pictures and nature pictures rarely do the real thing justice. This, combined with technology limitations, is why your camera has to choose what to display when shooting a scene with a large range of lighting – think inside a dark house with a bright window

http://www.cybergrain.com/tech/hdr/

HDR photos now attempt to get closer to the real world by displaying a higher dynamic range. Here are a few examples:

http://www.flickr.com/photos/lynchburgvirginia/407618927/

http://www.cre-aid.nl/2006/06/13/hdr-high- dynamic-range-workshop/

http://bighugelabs.com/flickr/onblack.php?id=455448365&size=Large

You can see that the photos have great color detail, and if you haven’t seen photos like this before they might almost look unreal. When I first saw pictures like this, the longer I looked at them the more they looked real.

Currently, HDR photos have to be produced with software, either from a few different exposures or using a RAW image format. Since there is no standard, the software can change a photo with varying degrees, some realistic and some ridiculous. I would classify the photo below on borderline unrealistic.

http://farm1.static.flickr.com/177/477846714_d4572dad6f_o.jpg

Search online and I am sure you will find most HDR pix are a bit overboard. If you want to read more, here are a few good links that I used:

More in depth articles
http://www.cybergrain.com/tech/hdr/
http://tutorialblog.org/hdr-tutorials-roundup/

How to create a HDR photo
http://www.backingwinds.blogspot.com/2006/10/how-to-create-professional-hdr-images.html

The Image Fulgurator is a fantastic guerrilla messaging tool. The device is being patented by the artist Julius von Bismarck. It is a camera-looking device which projects hidden messages on walls and objects at the very instant a camera fires it’s flash.

Here are a few samples of how the Fulgurated images look. The Obama one is my favorite because of how subtle it is.
*credit to Fumi

The YouTube video does it some justice.

Apparently he is patenting the device to protect it from misuse by corporate interest…. ie.. guerrilla marketing.

Who sat down and made the executive decision that advertising must look crappy and out-of-place? I understand that the point of advertising is to attract attention and therefore should be an anomaly that the viewer is drawn to, but come on… enough is enough. People are starting to become desensitized to big flashy ads that are borderline unethical.

So how does one maintain ad-space and a good design? The online radio site Pandora managed to solve this problem. Instead of sticking the ad in a banner and calling it good, Pandora takes it to the next level by incorporating the ad design into the background. Not only does this draw more attention to the ad (by using the entire background it creates more visual interest) it also doesn’t sacrifice the design for an ad – it adds to it. Furthermore (and probably most importantly) the ad is usually a memorable one. A good example of this was when I was debating this topic with a co-worker (who is a general hater of flash sites) and he named a previous ad without even thinking about it. I say good work, Pandora. Not only do I love your music, but you made me a believer in ad-space.