webqem blog

As we find ourselves designing for more and more mobile devices these days, we’ve been keeping a very keen eye on industry leading mobile sites recently. Designing for mobile is not always straight forward, as you are working with a much smaller screen real estate, reduced functionality (no flash for Apple devices) and needing to make buttons much bigger (as finger are often fatter than the mouse cursor). It makes for quite a challenge – and it’s interesting to see most of the industry resorting to similar techniques to make sites work well and look good on mobile.

Here’s a few mobile specific trends we’ve been noticing.

Sliding Galleries

Allows to easily navigate between multiple slides and frequently offers some fancy transition effects. This is especially useful in mobile layout because on a limited space you can display multiple pictures.

Photo Backgrounds
Large photo as website’s background creates stunning visual effect. Having an overlay of content the photograph faster conveys the story and brings a really great sense of contrast.

Dual Column Navigation

The style is remarkable for having a skeleton οf navigation menu split into two columns. Such layout perfectly serves many mobile sites as all menus are housed within the scope of a mobile screen.

Horizontal Navigational PanelsThe big trend around menus is the use of large horizontal panels, which are sure to be a mainstay in mobile design. They’re space effective and can considerably facilitate fingertip content browsing as the clickable area is larger. And they just seem to mimic the UI of iOS and Android, which makes for a comfortable and familiar interface for users.

Hanging Up the Moon is a beautifully executed website which promotes a self-released, home-recorded music album by Sean Lam. While the music might not be to everyones tastes, it’s worth seeing just for it’s unique design – and well thought-out navigation and usability. We love the subtle bits of animation which really bring the site to life – all tastefully done in HTML5. Site design by Singapore based Plate Interactive (who have a pretty cool site themselves, albeit Flash).

Here is an incredibly minimal, but lovely and colourful portfolio site by Russian web designer, Alexander Zhestkov. One big long expanding page, which renders identically on mobile devices – is a incredibly simple but very effective approach. The tasteful colour palette and the small type are what make it work aesthetically, putting the viewers focus on the portfolio of work. If you dig the design, give the guy some support with some FB likes and Google +1′s.

Website for media companies usually fit into two categories – overly shiny and uninformative, or over informative and dull. We like how Diablo Media have rode a careful between the two. They’ve managed to put together a site that isn’t light on the content, but dressed up well enough that it is anything but dull. The single long page layout, crossed with a traditional horizontal navigation works well with the striking big images. The icing on the cake is the clean and modern typography.

We’ve just checked out this video previewing Google Wallet, and we’re convinced that this kind of this is most definitely the future. NFC chip’s in phones have been standard in Japan and Korea for some time, but they were locked into your mobile provider – generally only being able to make payments from a single account (like your Mobile credit). Google Wallet wants to open this up, so you can carry multiple accounts, credit, debit, gift and loyalty cards – all in the one system.

You can imagine it won’t be very long before you will be able to leave the house with nothing but your phone, gone will be the days of fat wallets filled with prehistoric bits of plastic. This is obviously going to have a huge impact on traditional retail – but we suspect that Google have some interesting things in-store for online retail (ala Paypal).

We’re keeping a very close eye on this, interesting things happening.