Toolbox Studios Blog

Five things you need to know about iPad development

 

 

Toolbox just completed a major iPad design and development project for a Fortune 200 client. Our challenge was to take a large amount of existing web and print content and re-imagine and repurpose it for mobile devices. Our charge was to ensure that iPad audiences had the rich, compelling user experience to which they were accustomed, and that we brought to bear the full spectrum of the channel’s interactive capabilities for the entire project.

It was one of those engagements that pulled together our staff’s myriad skill sets — strategy, deep publication experience, UX chops, HTML 5 software development, design and typographic acuity, custom illustration, photographic art direction, mission-critical project management and old-fashioned problem-solving. During the past quarter, we designed, produced, coded and tested over fifty interactive iPad articles and a bevy of high-touch HTML 5 templates for the client’s future use.

The project has been an overwhelming success. We helped the client navigate many of the complexities of working with HTML5, and we’ve learned a few things along the way as well.

This morning Rob and I were talking about the project’s high-points over lattes at a new coffee house that’s not too far from our studios.

We talked about five things we learned along the way:

1. Take advantage of iPad’s controlled environment.

Unlike web browsers, with numerous rendering styles served up on questionable monitors with varying pixel dimensions, mobile devices like the iPhone and iPad allow designers and developers to create with a single form factor in mind. Whether we’re designing an ereading application for the iPhone, or a web kit magazine for the iPad, the designers can approach the project with a strong command of the ‘page’ in front of them, simply because its pixel count, actions, gestures and rendering methods are a known quantity.

 The iPad still presents challenges to developers and clients wanting to maintain good design. For example, it takes foresight, original design, and clear communication between designers and coders in order to properly create an animated feature article that flips between landscape and portrait mode on the fly without losing anything in translation.

2. Video can save your readers from long, boring print articles.

Rather than video being isolated from — or awkwardly tacked alongside — print design, we’re increasingly advocating for a thoughtful convergence of text, illustration, photo and video. Thankfully YouTube and Vimeo have made the short-form video normative, a standard which has paved the way for more integration.

We take our clients’ deeper-dive content (tertiary stuff that might otherwise be long, boring columns of type on the page) and chapterize the content into smaller chunks of digestible information — a perfect reason to have an inline video jukebox on an iPad app, for example. Video is increasing our clients’ traffic, it’s encouraging social sharing, and clients are asking for videos with illustration and animation that go well beyond simple talking heads.

3. Webfonts and iPads (still) make awkward dance partners
Apple’s most recent iteration of its iOS4.2 mobile operating system brings to life some significant web font improvements. Developers may recall that Mobile Safari used to crash when certain web font combinations were loaded; this seems to be fixed. As a developer, I can embed my client’s TrueType and SVG fonts within an iOS4.2  app, and that typeface will render on static and dynamic content, but two holy grails — OpenType typeface support and streaming webfonts that work in online and offline modes—are still elusive. This requires clear communication between developer and client when the issue of web fonts comes up. A recent iPad project we completed back in December served up evergreen content (unchanging articles that are always available whether or not a user is connected to the internet), but because the typefaces were installed, we had to limit ourselves to a few weights of the client’s font family. Which leads us to:

4. Start planning your offline experience early.

All of our recent iPad experiences have reminded us that clients and their designer/developers should be talking strategically about online and offline iPad user experiences from the very start of the project. What happens to your inline video content when a WiFi iPad user wanders out of range? What’s the messaging on an audio or video jukebox when a streaming video is unable to be accessed? Should you tradeoff and pre-load some teaser video content as part of the application download? How will my webkit typefaces work in offline mode? Think through these questions in light of your particular audience and their facility with technology, their propensity to be bothered if a given solution is unavailable, and in light of other content you can naturally offer in its stead.

5. We believe.

That is, we sincerely believe that the iPad is not only a compelling, well-designed piece of hardware, but that taking advantage of its form factor and nascent capabilities offers a smart, tenable path forward for our clients. All of our clients come to us because they have compelling stories which need help being told; we’re reminded daily that those stories can be brought to life using a whole host of mobile device tools we’re able to tap into.

The audiences for digital content on mobile devices is ever expanding. According to Wedge Partners, Apple will ship up to 100 million iPhones, and between 45 and 48 million iPads in 2011 alone. These projections build upon the 48-50 million iPhones and 13.5 million iPads shipped in 2010. At the recent Consumer Electronics Show (CES) in Las Vegas, twelve new mobile devices (tablets/slates/ereaders) were introduced to go head-to-head with the iPad. As Rob just mentioned, “You know you’ve reached a tipping point when my own parents are in love with their iPad.”

We've already started our next iPad project and we're looking forward to building upon the lessons learned from this successful endeavor. Look for more updates from Toolbox about the growing mobile marketplace. So: what have you learned from using that shiny new iPad you got for Christmas? Drop us a line.

— Paul Soupiset, Creative Director, Toolbox Studios, Inc.

Reprint: Apple’s iPhone 4 Review: A Roller Coaster First Week

Editor's Note: this article originally appeared on Rob Simons Says

by Rob Simons

Wow. What a first week! For all the people that were waiting for my review of Apple’s new iPhone 4, here it is – get ready for a roller coaster ride.

Before we start this journey, let me give the option to step out of line now. It has not been an enjoyable journey. Actually, it’s been very ugly in several places, with more twists and turns than I expected. And for an Apple diehard like me that’s experienced just about every Apple product since the Apple ][+, I didn’t see this ride coming. So if you’re still up for it, sit back and relax while we climb the first hill.

(Just to give you a sense of the tome I could have written, I was 2,000 words into the first half of the initial ordering experience when I decided to reboot.)

Ordering Experience

To keep this short, I’ll just say that the pre-ordering experience started out great, then quickly descended into hell. My first stop was the AT&T web site, but it was extremely unresponsive. So I decided to call 611 from my phone and order the three iPhone 4 upgrades directly from AT&T on the morning of June 17. The first AT&T rep was wonderful. If only that call had been the end of the AT&T experience.

Unfortunately, I needed to call back and make a minor modification to the order. What should have been a simple process evolved into 4+ hours of phone calls; several blatant lies from AT&T; an incorrectly canceled order; an AT&T manager that never called me back; a mysteriously re-instated order after I was told it wasn’t possible to get a new order; then the miraculous “early” delivery of my iPhone 4.

Yes. For some reason, I was one of the few that received my iPhone 4 via FedEx the day BEFORE it was released to the public. This later turned out to be a blessing and a curse.

Installation & Activation

After going from being told I wouldn’t get my iPhone 4 for several weeks, to receiving it a day early, I thought this was a sign from above that I need to... 

Continue reading "Apple’s iPhone 4 Review: A Roller Coaster First Week" »

SXSW Interactive and Youth Media

The Toolbox Studios delegation hit the recent 2009 SXSW Interactive Festival (sxswi) with several ambitious goals—to engage with other thought leaders in the interactive design space, to share best practices, to create new youth media collaborations and to validate a few technological hunches based on evidence we've been researching.

We fanned out, employing the divide and conquer technique, given the breadth and depth of this year's offerings. We made ample use of Twitter to liveblog our findings, comment on sessions, and have a little fun as well.

Initial reports suggested a 38% increase in attendance at this year's conference—many sessions were filled beyond capacity and the creative energy was palpable. 

Toolbox creative director / youth media account director Paul Soupiset has been distilling his notes from the five-day event and has shared the following six takeaways for youth media publishers, designers, game developers and marketers:

6. Teens [still] don't Tweet. While Twitter was hands down "the" tool at this year's SXSW Interactive (and one we recommend be part of any company's corporate communication plan... see more at #5), the 140-character micro-blog trend isn't being as eagerly adopted by teens. Anastasia Goodstein's YPulse teen panel again validated this hunch: You're just not going to reach a majority of 14-to-18 year olds with the über backchannel. Better to occupy the mobile space and MySpace. Facebook is there as well, but the "I wanna customize my space" fave MySpace is still top dog among this cohort. Should be interesting to see how this trend develops as Facebook and Twitter continue to dominate and grow the microblogging/lifestreaming space.

5."Not making plans is so totally Web 3.0." — this line from Caroline McCarthy, a CNET News staff writer, framed a second, related truism—Twitter was clearly still the rockstar and darling of sxswi. As McCarthy pointed out, when lines to get into parties at the Austin confab got too long, flash-mob intelligence via Twitter created new meetups, new parties, on the fly.

With a multitude of third-party tools and add-ons, Twitter offers increased freedom and mobility to stay on top of news and events in whatever niche you're interested in following.

And to those following the youth crowd, just because they aren't all on Twitter (yet), that doesn't mean their socializing isn't happening on the net—teens are embracing MySpace and Facebook, but moreover, they're embracing the relationships emerging from those connections. As Harvard fellow and youth media scholar Dana Boyd points out, "We have this belief that kids are just addicted to social network sites. If anything, they’re addicted to their friends. This “addiction” to friends is precisely what makes social networks so important, especially for tweens, who are more limited in their socializing options (until they can drive). There’s school, extracurriculars and the movie theater on the weekends, but with social networking they can be sure not to miss a single OMG moment.”

4. Get out of the way and let your audience explore. Interestingly, this reminder came out of an interactive game development session, although it was emphasized in later Web 2.0 panels as well. As one gaming expert stated, "the complexity of our gaming interfaces should level up with our users as they proceed [with gameplay]." The key idea here seems completely intuitive, but it found new currency with me at the Playing On! Interface Lessons from Games session: when we design games, instead of front loading the game with tutorials or a discursive set of rules, we should allow the player to start gameplay and learn progressively.

In the 2.0 panels, this prioritization of the audience surfaced more in the context of public relations and customer management. With social media, we all know you can't exert control over everything online as you once could. You can't play by the same rules, either. You have to learn to listen to the conversation, insert yourself/your company genuinely, and be okay that you can't predict or dictate the outcome. You can only monitor and react to it.

3. Design is still king. Evidenced everywhere I turned. Good design creates context. Good branding creates curiosity, loyalty, buzz and desirability. Too many examples to name. Okay, maybe one: Alex Bogusky's B-cycle (bicycle sharing) initiative.

2. It's all about R&R. Not rest and relaxation, but rewards and reputation. A fascinating seminar borrowed from the language of game playing mechanics and found parallels to be brought to bear in all of our social media apps. Rewards will need to move beyond simple point-tallying and actually show bling for levels attained (exemplary games display which level a user has achieved, which in turn earns him/her instant street-cred). The best of these apps incorporate some kind of collecting mechanism as well—a metaphoric trophy case—to show off those accumulated points. Whether it's medals on an army officer's uniform, merit badges on a girl scout's sash, or a collection of karate level belts, humans collect visual indicators of our advancement. Finding creative ways to do this on the application level rewards your avids, and offers a clear path for noobs who want to engage with your brand.

1. A Social Vote for Change Probably the most memorable session I went to was a lunch at Stubb's BBQ, where the topic was "Social Media for Social Change" — a lot was said about the distinction between using social media for charity and using the same tools to effectuate actual social, systemic, societal, or institutional change. 700 people RSVPd for this lunch. I was lucky to arrive early, which means I got in the door, actually ate a great brisket lunch (ironically/awkwardly eating my BBQ sitting next to two new friends who work at PETA2), and settled in for the conversation. The panelists included pioneer Beth Kanter, David Armano, Scott Goodstein,  Stacey Monk, James Young and Randi Zuckerberg. For an engaging overview of the conversation, read Kanter's brilliant summary blogpost here.