We’ve been working with visual perception and as the final part of the course, we had to design and develop a webapplication from scratch in two days.

Brief

• Present four gestalt laws. Proximity, Closure, Similarity and Figure-Ground. Must be illustrated.
• Make an interactive application that demonstrates the ‘blind spot’ test. Has to be a Flash application/animation.
• Include the two above as a part of a website.

In groups of three, we agreed on a overall theme. Ours was the wintersport curling (wikipedia-site). From here on, we had to work individualy.

My goal was to produce a webdesign that took elements from the world of curling and integrated them into the overall design. The colours, shapes etc. all had to aid the user in finding out how to navigate/interact.

View the fully functional website (new browser tab) and read on afterwards :)

The webdesign was designed using Adobe Photoshop CS4 and Adobe Dreamweaver CS4.

The four gestalt law illustrations all has strong references to the curling sport.

I drew the illustrations and logo using Adobe Illustrator CS4.

The blind spot test (link)

The page above contains the application that demonstrates the blind-spot principle. You can read the instructions (in Danish) and check if you can find your blind spot.

The design of the application is integrated as a part of the website and has a straight foreward guide below.

The ActionScript-code I’m using is adapted from this excellent post by flashadvanced.com. It’s AS 3.0 and uses the Slider-component from Flash CS4.