Engage – Now available on an iPhone near you!
…written by Will and has 20 comments so far
Yep, we’ve only gone and done it again with the launch of our fancy new iPhone site, which as far as we’re aware is one of the first of its kind due to its clever Orientation-Specific Content. So, simply tap on over to engageinteractive.co.uk on your lovely little gadget and have a play.
There’s no doubt the iPhone has been a bit of a hit. Modestly dubbed the Jesusphone by many an apple (dare I say it) fanboy, we’ve decided to find out what this little gizmo can really do or if it’s all just cheap tricks.
Now, at Engage we don’t wear black turtle necks nor do we repeatedly say BOOM during presentations but we do all have iPhones (it’s a perk of working here). Regardless of what some people say, it’s a great bit of kit which boasts the first fully standards compliant mobile browser. In theory it can display web pages the same as any computer would. In practice however it makes a valiant attempt, but due to small screen size, connection speed and lack of plug-in support it can sometimes struggle.
The really fancy bits
Hold it upright and you’ll be able to read our blog. Turn it left and you’ll be able to find out more about what we do and contact information (with full iPhone application integration). Turn it to the right and we’ve got a mini portfolio – Clever huh?
The solution? – Create a site specifically coded, optimised and configured for the iPhone. You may have already heard of, or even used the increasingly popular Facebook iPhone site – well, in an attempt to rub shoulders with the stars we thought we’d create our own – but adding some features that you probably haven’t come across before – mainly Orientation Specific Content (or OSC if you’re a fan of the old acronyms)
It’s not just our website scaled down though. In the same way our main site is big on slidey innovation, so is the iPhone version! Taking advantage of the accelerometer (the little bit of ‘Back To The Future’ sounding wizardry that knows which way up the iPhone is being held) we’ve built the site so that different content is displayed depending on how your holding your phone. Hold it upright and you’ll be able to read our blog. Turn it left and you’ll be able to find out more about what we do and contact information (with full iPhone application integration). Turn it to the right and we’ve got a mini portfolio – Clever huh?
If we’re honest, it’s unlikely that a site such as ours will ever see a huge amount of traffic, but as this type of browsing becomes more common – can companies afford not cater for this ever growing market?
For now, all that it’s useful for is the iPhone, but with lots of companies bringing out their own version of the iPhone in the near future and mobile carriers reluctantly beginning to embrace true mobile internet plans, it’s likely that designing and building websites with fingers and small screens in mind is going to become more and more important.
Check back in the next few weeks, or subscribe to our RSS as we’ll be covering the basics of building your very own iPhone site!
Tags: iPhone
Danny Foo Says:
sw33t. Was it difficult incorporating this for a website?
June 11th, 2008 at 4:49 pmwill Says:
Hi Danny,
June 12th, 2008 at 12:18 pmIt was a lot of trial and error really. Not knowing what the iPhone was really capable of (or where it fell flat on it’s glassy face) meant that I tried some stuff but had to take it out but in the process realised that I could do something different. A good experiment!
Cheers,
Will
Walter Stevenson Says:
Can you share the code? I don’t see it in the HTML source, so I imagine there is some JavaScript or DOM trickery going on…
June 13th, 2008 at 3:24 amwill Says:
When I get a chance I’m going to put together a simple example site which will have all the basics that you need to make an iPhone exclusive website with the orientation detection. Subscribe to the RSS feed and you’ll spot it in the next week or so.
June 16th, 2008 at 11:16 amWill
Mig Says:
Thanks for this, just got the 3G. Anxious to create some new websites that utilizes awesome technology like you’ve shown. Had a lot of fun on the site with my iPhone!
July 17th, 2008 at 5:44 amRob Blakeney Says:
Great tutorial!
Im using this method to do something a bit different. When the iPhone is in portrait it show a small cut down version of the site, but when in landscape, it shows a full version.
The problem i am having is that when im zoomed in on the portrait verion and rotate the phone, the landscape version is zoomed in, when i zoom out and then go back to the portrait version, it is zoomed out and only occupies about 1/4 of the screen.
Is there a way to tell the iphone to reset the zoom each time it is flipped so that in portrait its 100% and in landscape its zoomed out so its fits the screen?
Cheers
Rob
August 14th, 2008 at 3:16 pmDennis Says:
http://developer.apple.com/webapps/docs_iphone/samplecode/iPhoneOrientation/index.html#//apple_ref/doc/uid/DTS10004520
August 28th, 2008 at 1:55 pmmyows Says:
This is awesome…
January 26th, 2009 at 8:56 pmBrente Says:
Very cool. I like the different content on rotation effect. It would be cool if Apple let Safari know the “shake” event so that you could change portfolio pieces when shaken. I assume that Apple will slowly allow more hooks into their browser from the OS (hopefully location too). That would be cool.
Thanks for sharing !! Great work.
March 30th, 2009 at 3:52 pmHenry Says:
Inspirational piece of work and creative idea.
I built an iPhone video site for a creative agency I used to work for but sadly it’s offline now as the company went bust late last year. I totally empathise with Rob as the zooming bug on Orientation change quite nearly had me pulling my hair out until I eventually managed to fix it and keep it at bay.
Great site though, brilliant!
May 6th, 2009 at 3:44 amGolf Royalty Says:
Shake will defiantly be the next implementation with Safari on the iPhone. As some others say, it will be a fantastic tool for refreshing specific content on the iPhone orientated web page.
Great work!
February 5th, 2010 at 11:11 amWebsite Design Says:
that’s really a fantastic post ! added to my favourite blogs list.. I have been reading your blog last couple of weeks and enjoy every bit. Thanks.
March 9th, 2010 at 5:46 pmsam Says:
Hi Will: just got here, and reading through some of the posts which is excellent information and was wondering if there are any updates on :
When I get a chance I’m going to put together a simple example site which will have all the basics that you need to make an iPhone exclusive website with the orientation detection. Subscribe to the RSS feed and you’ll spot it in the next week or so.
Will
Thanks
April 12th, 2010 at 4:49 pmSam
Farik Says:
Great work!!!!
April 16th, 2010 at 5:35 pmsam Says:
bump?
April 16th, 2010 at 9:54 pmSquidge Web Design Says:
Hi Guys, recently stumbled across your site form the Webby’s. Really impressive stuff and very inspiring! Keep it up, I’m a subscriber! Andy
April 20th, 2010 at 1:46 pm