The objective of the Pitchweight iPhone app was to encapsulate the functionality of the website into an iPhone app that could be used to listen to music on the go with all the benefits that a native app has over a mobile website: chiefly, to allow people to listen to music while having their phone in sleep mode, something not possible within an ordinary Safari browser. The strategy I took was to leverage the existing code I was using for the site and wrap it in some Objective C. The result is an app that can be dynamically updated without requiring the user to download any new updates. Seeing as the service constantly relies on communication with remote servers anyway, it was clear that a webview was the best choice for the project.
This one was a nice challenge getting it to behave with all the jQuery being used throughout, but things went well. In the end, the experience turned out to be very clean and simple: see the project you like, click on it, and there you are with the beautiful work right in front of you. This idea was one of the driving forces in the initial design of the site and I'm glad the mobile version lent itself to really taking advantage of that. Along with the auto scrolling and the HTML5 History API being used, overall it just feels like a luxury experience while browsing through all the different projects.
For the Capital Grey redesign, I thought a nice mobile site to accompany it would be a good gesture, after all if someone wants to look up the band after a show, it'll be a lot easier to do so right away from their mobile phone. The front page basically stacks the content of the desktop view which was by default laid out horizontally. The music page focuses on the album artwork first but uses CSS to resize the very same desktop images. This way, the mobile user can zoom in on the fine details of the photography and still view a crystal clear image. On the about page, the ajax response from the contact form submit has been adjusted for smaller viewing area.
Build Your C7 also works great on your phone. It embraces the same responsive design theme that the desktop version does. This way, no work had to be done specifically for mobile outside of the usual few bugs you get on phones. By the way, if you try clicking on one of the options on the bottom menu in the iframe, don't mind the scroll bar that appears. The true presentation you see on the mobile device actually omits the scroll bar and lets you slide the panel with touch. Definitely one of those things that you should just go and try on your phone. Look at the landscape version too, it's pretty nice when you minimize the menus with the top right arrow button.
The site you're looking at it, itself, is mobilized. It's pretty barebones so it was not a big project to mobilize the site, but it looks very nice, dare I say, maybe even more elegant than the desktop version! The header and footer are nicely translated mostly doing the usual wrapping rather than the horizontal layout. The portfolio page almost retains all the functionality that the desktop version has including the jQuery Cycle that switches images for each project. Since it's my site and I can change when I please, I try to keep it in tip-top shape. The texture on the background just makes me smile, there's something about the noisiness that I find very appealing.
The Mandaric Bicycles site (relatives, if you're wondering!) is a fairly minimalistic site, focusing on imagery to do most of the talking. The site is still in development as more products will be added as well as more copy, so the most I could do for now is translate the graphical nature of the message over to phone. On the products page, go to Niobium which will show some of the marvelous work that's being done by this company. Don't be afraid to zoom in with your fingers, the pictures are ready for retina displays if you know what I mean! Very excited about continuing work on this one.
The Stack of Wax website is not the best example I have of mobile development as the project was a bit cut short since the client wanted to launch earlier rather than tend to the mobile site as much as I would've wanted to. But, it's still nice to see yet another one of these tidy little things! The front page omits the larger company logo that usually lays over the slideshow and the slideshow itself has been properly groomed to accomdate a smaller screen. I like how the thumbnails on the Studios page still open properly through fancybox, although their arrangement isn't perfect (again, it was a little rushed). The Meet the Team page also looks very nice with each person's portrait fitting nicely amid the text.