The way people are using and accessing websites is changing. This is due to users having more diverse browsing experiences on a multitude of devices, including desktop browsers, smartphones, tablets and more. This creates challenges for web producers regarding how we should design for different screen sizes, resolutions and types of interaction (e.g. touch). More than that, it calls into question what it really means to design for the web today.

With new devices available, the one-size-fits-all approach to web design that we’ve stuck with for so long is no longer relevant. It’s now essential that the designs that we create are responsive to the different ways that users access our content. This document is intended to outline a process called ‘responsive web design and enhancement’ that can be used to optimise your website’s content and adapt to different screen sizes and devices. Download the document here:

Responsive web design and small screen optimisation

Patrick has been working on our most recent web design project and we’ve now had sign off on the new homepage so though we would share a sneak preview of the work. The project is for Felton Fleet, a mixed independent school near Cobham, Surrey. It is being designed in conjunction with a mobile friendly version utilising CSS3 Media Queries which Patrick also blogged in Going Mobile with CSS3 Media Queries.

Click the image above to see the preview.

GOOD produces a website, videos, live events, and a print magazine. They seem to successfully mix an ethical ethos with good design throughout their projects.

I came across the results of a competition they have recently finished for the best infographic which would “highlight executive compensation (as in, how much CEOs etc. are paid) in an interesting way.”

It’s nice to see creative visualizations of mass data and these are very good examples of this.

I’d like to draw attention to some impressive new interfaces which seem to be bringing a Philip K Dick reality ever closer. Using various open source technologies it is possible for artists and programmers alike to experiment and innovate with things such as computer vision, augmented reality and tangible holographs.

Computer vision enables face detecting and motion tracking of live video footage meaning that a user can interact with software using gestures or that the software can autonomously react to user’s movement. The video below does not illustrate the practical potentials for openCV but is too pretty to not include here.

Gold demo from Memo Akten on Vimeo.

Amongst other things computer vision enables the process of Augmented Reality (AR); the fusion of computer graphics/text and live video imagery to ‘enhance’ the experience. This has become more popular on mobile devices of late and there are many AR applications for the iPhone on the horizon. Here is an illustration of mobile based AR:

Touch screen interfaces such as that of the iPhone have almost been absorbed into common use and understanding in their short existence. Despite this, one of the difficulties of using this type of interface is the lack of tangible feedback from the smooth screen apposed to pushing buttons on a phone or keyboard. This problem also applies when flailing around your arms whilst interactive with a gesture based computer vision interface. This almost seems like an impossible problem to overcome. Of course this is not the case as illustrated by this Tangible Hologram which responds to user interaction using small blasts of air or ‘Airborne Ultrasound Tactile Display’ (via). Amazing if not a little scary; love it!

It is almost comical how long we have had a holding page where our website used to be, a true laugh or cry moment. In my wisdom I decided that taking it down would incentivise us to design and develop our new site in a prompt fashion………incorrect. Despite this there has been a recent spark of activity in this drawn out redesign – the colour scheme. Probably not the largest chunk of work in the entire process, i grant you, but still essential.

During our meetings quite some time ago we discussed where our main skills lie and what kind of work we would like to procure in the future. We performed some pseudo-branding exercises to try to discover the desired words/images/emotions we wished to evoke and associate with Ultraviolet (Uv^d). Although this was not guided by a branding professional I believe it was beneficial and has helped us at this stage to gauge what is and isn’t appropriate for the site aesthetically.

Due to our strong background in technical areas of digital media production and the associations with the name Ultraviolet we decided to keep in mind a theme of science when creating a logo, site visuals and colour schemes. I believe that discounting the purple shade, the cool greys and blue are evocative of this. Another reason for deciding on this schema is that I believe effective use of shades of grey/black are (if used correctly) very effective in web design.

Either way I think it’s winning. Kudos to Patrick our designer. Next we have the layouts to look forward to…………

Lovely lovely words. Wordle is a java app developed by a guy from IBM. It generates “word clouds” from a sample of text you provide or generates it dynamically from your blog URL (with an RSS feed) or del.icio.us user name. Above is the the cloud from this blog. Ten points for spotting Climatron in there.