The march of Windows Metro inspired design

A while back I wrote a blog post saying I thought the forthcoming release of Windows Phone and it’s metro interface (plus subsequent Windows 8 release) would probably trigger a change in fashion with regards digital design. This was partially demonstrated by the MySpace new design also.

Seems this prediction may have been salient, as I’ve started seeing a variety of designs popup both on software and websites which clearly owe a nod and sometimes more, to the Metro interface.

What designs have you seen which look like bastard children of the Metro UI ?

Capture

 

Note the menu design on the Port du Soleil website navigation and the new AVG anti-virus navigation.

New MySpace Design Makes Facebook Look Old

Back in December 2010 I predicted that there would be a design shift the following year, toward cleaner lines, sharper less fussy – less “Web 2.0″ – designs.

It’s taken longer than I thought but apparently we’re still moving in that direction!

The imminent Windows 8 is all about this, continuing the theme from it’s elegant (if a little Ux flawed) younger Windows Phone UI cousin. But also, MySpace is joining the fray, as my office neighbours at VentureBeat have just demonstrated publishing a video of the new MySpace UI.

As you can see it’s remarkably clean and utilises the vast screen real-estate which most desktop computers and many laptops now have. Why people are still designing for 1024 width is beyond me; or at least they should have sites which shrink gracefully and optimise for at least 1366+ and as an aside, there are some startling similarities to our new UI design for The Taploid (launching next week)… great minds think a like perhaps!

But I digress…

In terms of colours I’m unsure whether the darker shades may become tiresome after a while – certainly I find that the Adobe CS5 and CS6 suit which has switched to a dark style UI can be annoying. That said many Adobe Air products ended up like this, such as Tweetdeck and I was happy using them.

The whole MySpace UI video can be seen here.

I wonder what is next, a return to IBM PC Green?

Is Purple the New Black (or Blue)?

Some time ago (well five years in fact) I had to the colour for the branding of my [last] start-up. I chose purple.

While everyone else was choosing easyjet-orange or shortly after Facebook blue, Purple seemed to have majesty and was little used, in 2007

At the time it seemed a bold choice. There were no other purple sites out there.

At the beginning of it’s bid for stardom, Facebook blue had just begun it’s assault. Over the years this colour has been very hard to avoid with everyone seeming to fall for the charms of this reliable and newly reborn colour – blue having been stuck for so many years saddled by it’s heritage with Microsoft.

What other technology flirts of fancy have we seen with colours?

Somehow, it just doesn't look right.

For some years Dell championed the dark grey. There there was Apple with its White iMacs and Powerbooks. Later this gave way to Silver and aluminium.

Prior to this orange had been the order of the day, with easyJet leading the way, Orange the telco in full fledged brand glory and I knew of at least three start-ups which had chosen this punchy colour.

I have seen over the last two years or so, a new love of the solid, dependable regency of Purple though. Rummble’s colour scheme –although largely dropped by the January 2011 business to business incarnation of the company – looks as recent as it could, not 5 years old.

The most recent screen shots of Windows 8 were swathed in this royal, almost religious colour.

Windows Phone 7 metro UI in purple glory

Speaking of which, my favourite cassock of my late Grandfather, a traditional – I dare say cliché looking – Church of England priest, for his Purple one. It looked fabulously opulent and offset his longish white hair.

Perhaps that’s why I’m still fond of this, until recently, entirely ignored stalwart of the main set of solid common colours. I think we’ll continue to see a lot more of it in the next couple of years.

The Future Of User Interfaces

It’s reassuring but also frustrating when something similar to what you were striving for many moons ago, is realised a few years later and receives the recognition you wanted at the time (..even if the new project is probably executed far better than you might have or the technology made easy to do at the time!).

I’m refferring to Blooms new app “Planetary” which visualises your music collection as a solar system. All very pretty it is too.

Patrick Moore eat your heart out. Click the image to go to a video of this UI.

This probably sounds rather odd (read more here on Read Write Web’s Data Visulisation article) but I agree with @ricmacnz that this will become normal to you sooner than you realise.

Back in 2007 I tried at Rummble to create an interactive 3D timeline to interrogate your social network for personally filtered content relevant to you and combined it with location based data and a personalised rating for that content demonstrated by the colour of the object. It even showed you how far away in your network the content came from.

The Rummble "Lifestream". Think Facebook Newsfeed on steroids. I previewed this briefly at Mike Butchers NMA Event in 2007. Filtering, personalisation, social streams - no one had any idea what I was going on about.Jason Calacanis said it was rubbish.

This was not only a distraction from our core proposition (albeit a really cool one!) but far too early to market.  The topics listed above are now all hot: personalisation, your social graph, feeds, taste graph and now: visualisation of that data in an interesting way.

The moral here is of course 1) focus and 2) make sure you’re not too early in the market (unless you’re like Color and can afford a runway of 3-4 years to hone your sofware while the market catches up).

Back to UI

Representations of your data in new, less clunky, less human ways are enevitable. This will be fuelled by the amount of content we are expected to wade through. When the next-generation Google finally appears (I’m less confident that I was that Facebook will crack the social search issue) it will be because a company finds a way to properly filter all this stuff.

It may be that re-imagined UI’s, moving away from the traditional lists -or omnipresent news & activity feeds- are needed in order to display that technology in a meaningful way.

A quick search will no doubt reveal posts far more detailed in their discussion and some fascinating pilot projects; but my point is only that don’t expect your mobile device of the future to be the lists and menu paradigm of today.

See you amongst the stars.

When Design Goes Backwards (or Why Don’t Teapots Pour Properly?)

When I was a less seasoned but more youthful entrepreneur, a good friend of mine and I used to joke about having a future consultancy which would specialise in advising companies on improving – what today I would describe as – the product experience.

Our consultancy was to be called “No, Not Like That!” (well either that or some expensive sounding agency name akin to Saachi and Saachi ).

My friend James was quite successful in his late teens, buying a new BMW every year as the new model came out, replacing the old. Within days of cruising around in his shiny new automobile we just couldn’t understand some of the design decisions BMW had made which clearly made this new motor car a worse product than the last.

It seemed to us that charging BMW $10,000 per hour to fix their product before it shipped would be small fry compared to the improvement  our genius deliver in user experience and thus customer satisfaction.

James in one of his BMWs, pretending to type on my old Toshiba laptop. Not sure what this photo was all about really; although it was taken with one of the first ever digital cameras with some stunning top resolution like 480 pixels.


These blaring errors are not of course with just cars but are everywhere, but never having given the time or discipline to formally study usability, anthropology, HCI (or any of the other very worthy academic courses or disciplines in this area which teach one to think through, articulate and justify rationally why things should be created as they) I never felt appropriately predisposed to start such an agency.

For a few years now I’ve wondered if that was an entirely wrong conclusion.

Products are used every day by people without these qualifications. As a consumer and user if I can see it’s wrong, illogical or difficult to use, may be it simply is. Furthermore, how was it not spotted by the very designers who penned the product?

Do you understand this sign?

Poor design is everywhere. This brand new sign which I had the misfortune to need while at Barcelona airport en route to Mobile World Congress was helping no-one. Neither of those things were in either of those directions. How can you look at this sign and think it’s clear, especially if your expertise is sign design?

No! Not Like That!

Companies continue every day to produce new products which beggar belief in their poor design. One wonders sometimes if people do it intentionally; some perverse enjoyment being taken on making people’s lives miserable.

Even basic household objects are afflicted. Poor teapot design is a particular pet hate of mine.

A tea pot has to just ONE bloody job and that is to pour tea. Yet how many tea pots simply don’t pour properly? They fail at the very first, indeed only thing they were designed to do or need to excel in.

Interesting tea pot design, but does it pour?

An additional trick is when the handle material is chosen so that it’s actually too hot even to pick up the tea pot to pour the tea. Why chose a material which is excellent at conducting heat when you know someone needs to pick it up? Some saucepans suffer from this affliction too.

I don’t need a degree to realise this is tragically poor design (no pun intended). It is entirely beyond my comprehension how you put a tea pot to market which guarantees to spill tea everywhere on every use.

You might argue that I should not be surprised that no great design process nor testing goes into a the average tea pot. I disagree; but instead lets move on then to companies who really should know better.

Microsoft 3000 mouse turned off automatically when you slotted the USB stick back into the base. Sensible.

The last mouse I bought was actually superb. The Microsoft Wireless 3000 had a clever clip in USB adapter, which stored it nicely AND turned off the mouse automatically (without the USB plugged into the Laptop, you can use the mouse of course). Great neat piece of design. Sadly, someone nabbed, or I mislaid my beloved mouse.

Off to Amazon .com I trot to buy another. To my surprise Microsoft has a new shinier better model. Naturally I buy this new model.

New design; tiny USB slots into mouse, doesn't turn it off. There's a separate off switch. Bad design IMHO.

Bad idea. The new model does away with this extremely useful feature and replaces it with a) an off switch for the mouse and b) a tiny USB stick which might both easily be lost and pop out of the mouse housing. Leave it in the laptop? It still ticks out too far to be practical to do so and anyway you then risk it falling out.

No! Not Like That!  

This change in the new mouse design is clearly a step backwards. Brooding on my reaction I realised that much of my response is driven by expectation.

So much in life is management of expectation and companies large and small frequently over promise and under deliver when the reverse should so obviously be the goal.

Designers, engineers, human beings of the world: let us unite in our attempt to not make things worse, let’s make things better!

How do you do it?

Simple: Use your own bloody products more.  If you’re “improving” a previous model, make damn sure you’ve lived with that previous product day in and day out before you start doing what you think is best to make it better. Then, just maybe the next tea pot I pick up will pour a cup of tea without ruining my mother’s doylies.

STOPPRESS: Great list of terrible designs of things here on Quora: http://www.quora.com/What-is-the-worst-piece-of-design-ever-done

I Predict A Design Shift In 2011

Design like fashion goes in many cycles – some more obvious and visible than others. I’m no expert by far so this topic would be best explored in depth elsewhere and by someone else. However I do have a prediction and it seems to already be coming true.

The original iPhone - the design for which is starting to look decidedly Web 2.0 and almost dare i say it a little naff, even if we're all fond of it

After the gradients and shadows of Web 2.0, this evolved in to the slightly cleaner apple-sque finish of the iPhone and then the iPhone 4, with the retention of more subtle rounded corners but more white space and less gradient kitche – a move on from the original iPhone (above) but still of the same lineage.

Windows Phone 7 UI, surprisingly refreshing and simple - content focused

The design of the new Windows Phone 7 O/S really caught my attention. It’s like a properly executed Vodafone 360 design. It reminds me of some 1970′s TV Sci-Fi programs, because of the bold but square interfaces of computer screens simulated at that time, with strong flat colours…although maybe I’m remembering incorrectly!

Uhura does her thing with flat graphics on pretend LCDs

My prediction simply is

..that people will like the Windows Phone 7 design style more than we think they will and that it may start to filter into other sites.

I was prompted to voice this opinion after seeing this nice article about a conceptual Facebook makeover in the Washington Post. Can you see any similarities, or am I barking up the wrong design tree?

Facebook conceptual design by Bruce Mau Design

What do you think?

Qik Mobile App Install: A Example of Best Practise

I rarely feel compelled to write a blog post because an install process for a web or mobile app is so good, but Qik has triggered just that compulsion. Qik allows you to easily record or live stream video from your mobile phone. The list of supported phones is growing fast; and you can expect the rate of engagement to explode once the iPhone 3GS is cleared for takeoff with Qik (currently you have to jail break your phone to get it working).

The point of this post though was to highlight the process they use to install onto your phone. In brief, you have the choice of being sent an SMS (supporting multiple countries), downloading it and then installing it via your PC (or “side loading” as the industry calls it), or visiting a WAP site (a mobile website) to download from a link.

However, the important bit comes once the install process starts on the phone. I click to receive the SMS, received it immediately; I think clicked the link in the SMS, it started downloading to my phone, but crucially, updated the page automatically to tick the box that install had begun, it then confirmed when install/download had completed and then when I had fired up the app.

Qik have an excellent mobile app install process from their website, closing the loop between PC and mobile & ensuring users complete the install there and then

Qik have an excellent mobile app install process from their website, closing the loop between PC and mobile & ensuring users complete the install there and then

This might seem simple but it is VERY rare this process is used; normally the site just sends you an SMS and you go on your merry way.  Closing this loop, provided you can guarantee speedy delivery of the SMS, encourages if not subtly forces the user to install the app there and then and to log in – making them feel comfortable and hand-held in the process to confirm that things are happening as they should.

A clever and slick way to help users get your mobile app onto a users handset.  When we have resource to make improvements to the Rummble website, my start-up which takes the vast majority of my attentions these days, we’ll be following this user experience as its one of the best I’ve seen yet. Well done Qik!

Reblog this post [with Zemanta]