Our new website

By the Editor In iMod Digital No comments

The key idea for us as previously mentioned was always a single uninterrupted experience. We wanted visitors, prospective clients and space travellers to be able to get a good idea of who we are and what we do within a few mouse scrolls, no clicking around looking for a team page, no clicking around trying to find our portfolio, no hunting for a contact area. It’s all there, in front of you, ready. Some of you may have noticed (hopefully not, as you shouldn’t need this addition) that we actually don’t have a ‘search’ item in our navigation.

It may not look like it at first, but the entire design was and is greatly influenced by Ice Cream Sandwich Holo, both in experience and design. In previous iterations of the design this was obvious, it’s since evolved from there, but little bits and pieces are still there.

The real hurdle was having a design that doesn’t hinder the uninterrupted experience idea. We couldn’t have laps of skeuomorphic design or anything fancy like that. It needed to be as simple as possible, but still catching and elegant. We didn’t want massive distractions as the user scrolled, the focus needed to be on content, so we decided to get that ‘catching and popping’ feeling everyone wants on their website with animation. Subtle and gentle animation that entices the user to scroll and interact. To further emphasise the uninterrupted experience when users are exploring the site we made all interactions as smooth as possible. Page loads have their own nifty fade transition and all state changes (in supported browsers) are animated and were built with a combination of CSS and jQuery. We think we found a good balance and managed to display a lot of animated information without it being agitating and jarring which would have been cumbersome and distracting to the experience.

The palette selection was incredibly simple as we have already designed our brand (That’s a post for another time though).

A lot of people have been asking us how we animated and built those circles on the ‘Our Team & Interesting Numbers’ section of the homepage. We used the fantastic Raphaël javascript library.

If you have any specific questions, feel free to fire at us in the comments and we’ll answer them.