Quirk eMarketing：《 Wonderwall Inc. and Japanese Aesthetic Principles 》
Konichiwa!
In this edition of the Site of Note we take a look at a site oozing with so much user experience goodness you'd be forgiven if you found yourself ten minutes later wondering what you were doing before you clicked on this link.
Wonderwall Inc is an interior design firm based in Japan, and the aesthetic of their site is very, well, zen.
I thought I'd attempt to give the site a bit of a once over using a few Japanese aesthetic principles I learned about from another great blog, Presentation Zen.
Fukinsei (不均整) - Asymmetry or irregularity.
The idea of controlling balance in a composition via irregularity and asymmetry is a central tenet of the Zen aesthetic.
- The 5 column grid layout of the portfolio is anything but symmetrical. The elastic nature of the interaction is purposeful in that hovering over each project brings the relevant block into focus and creates a sort of natural call to action to click without actually saying so.
Learning: Clever use of animation on interaction (in this case Yugen (幽玄) - Profundity or suggestion rather than revelation) as well as more organic forms of layout based on the grid form can really pull the user into the experience and create calls-to action that are subtle yet powerful.
Seijaku (静寂) - Tranquility or an energized calm (quite), stillness, solitude.
- The site has a lot of movement, but only when you interact with it, otherwise it lies still.
- The calming click sounds (think digital raindrops) the site creates when navigating over each portfolio item are beautiful. They encourages interaction.
Learning: Using sound and animation on your website requires a great deal of consideration. In terms of function over form, sound on a website should serve a functional purpose before any weighting to form is given. In this case the function is the form. Design nirvana? I think so!
Kanso (簡素) - Simplicity or elimination of clutter.
- The project detail page takes the site into a completely different space. Clear, simple, and informative with clear and obvious calls to action.
- The photo gallery within each specific project is clear of anything that isn't contextually relevant to situation. There's no distraction around the main objective of the page - display a photo, and brief description of the work.
Learning: Designing every page on your website around the user's context and need maximises your chances of getting the user to do what you want him to do. Clear definition of your goals or desired outcomes up front, before any design has taken place means greater chance of a successful website.
Datsuzoku (脱俗) - Freedom from habit or formula. Escape from daily routine or the ordinary. Unworldly. Transcending the conventional.
- I think it's fair to say that one of the primary reasons that this site has been the subject of much discussion lately is that it is unconventional. Unconventional creates talkability. Talkability creates awareness (and incoming link goodness!). Awareness, depending on whether it's good or bad, impacts your brand.
Learning: Doing unconventional can be extremely risky. Without careful consideration from the user's point of view, unconventional is likely to lead to a poor user experience. The business and/or brand implications of a bad user experience are numerous, and none of them are good :)
Also check out:
Comment on "Wonderwall Inc. and Japanese Aesthetic Principles"
