All posts tagged ‘iPad’

File Under: HTML5, Mobile, Web Apps

How Do Native Apps and Web Apps Compare?


Two roads diverge on a tablet screen. One is the path to the native app, the other leads to the open web.

Luckily, you can take both. The latest mobile devices ship with a thoroughly modern browser capable of handling emerging web standards. Beneath that is a modern operating system with access to the magic inside the hardware: the camera, GPS, gyroscope and compass. But if you had to pick one — native app or web app — which would you choose? Your decision will make all the difference in how you approach your design, development and distribution.

The Issues Native Apps Web Apps
Internet access Not required Required, except for rare apps with offline capability
Installation/updates Must be deployed or downloaded Hit refresh
User interface Native apps are responsive and functional Browsers can be clunky, but new advancements in JavaScript like jQuery Mobile are catching up fast
Device compatibility Platform-dependent, hardware-dependent Platform-agnostic, content can be reformatted with CSS to suit any device
Animation/Graphics Fast and responsive Web apps are getting closer, but will probably always lag
Streaming media Few problems with audio and video. Flash works, but only if the device supports it Flash works where supported. Browser-based audio and video are getting there, but still beset by compatibility headaches. Give it a year or two
Fonts Tight control over typefaces, layout Almost on par, thanks to advancements in web standards. Give it six months
Is my content searchable? Not on the web By default
Sharable/Tweetable? Only if you build it in Web links are shared freely. Social APIs and widgets allow easy one-click posting
Discussion and collaboration Only if you build it, and it’s more difficult if data is disparate Discussion is easy, all data is stored on a server
Access to hardware sensors Yes, all of them: camera, gyroscope, microphone, compass, accelerometer, GPS Access through the browser is limited, though geolocation is common
Development Specific tools required for some platforms (like Apple’s). You have to build a new app for each target platform Write once, publish once, view it anywhere. Multiple tools and libraries to choose from
Can I sell it? Charge whatever you want. Most app distributors take a slice, up to 30% Advertising is tolerated, subscriptions and paywalls less so. No distribution costs beyond server fees
Distribution Most app stores require approval. And you gotta wait No such hassle
Outside access to your content No, the reader must download your app Yep, just click a link
Advertising Control over design (though limited in iAds) and rate More choices for design, plus access to web analytics. Rates vary widely

See Also:

File Under: Frameworks, Multimedia

Meet Treesaver, a New HTML Magazine App

A startup called Treesaver has developed a slick presentation framework for digital magazines that runs in the browser. It has many of the features you’d expect from a clean, reader-friendly content wrapper (like Instapaper or Readability) but it couples that functionality with a way-cool user interface.

Pages can be navigated by swiping from side-to-side, and you get helpful ghost images on either side of the page you’re reading, which aid in signposting. Also, the pages within the web app dynamically resize for different screens — and it even resizes on the fly as you make the browser smaller and larger. It’s all HTML, JavaScript and CSS.

Here’s the demo video for Nomad Editions, the first of Treesaver’s launch partners using the company’s framework to make a public announcement (Treesaver is still pre-launch right now):

Nomad also got some love from The New York Times Wednesday.

With digital magazines all the rage, everyone’s racing to get their traditional paper-and-ink publications onto the iPad. There are two routes — the native app, which requires the use of Apple’s tools and adherence to its rules, or the web app, which lets you do just about whatever you want as long as it works in a browser.

If you build a native app, you get some impressive performance with the swipey-swipey stuff, and you control both the ad revenue and your kerning pairs. But you’re also locked into a specific device’s platform, distribution is a pain, and you’re disconnected from the internet unless you bother to build it in.

The webby route has its own advantages, of course. Filipe Fortes, one of the founders of Treesaver, has posted an excellent list of all the ways the web wins — a wider audience, a wider range of compatible devices, easy access to social networking tools, real hyperlinks, search indexing, content embedding.

Treesaver will be entering beta testing in a few weeks, and the code will be released under an open-source license soon after that.

See Also:

File Under: HTML5, Web Apps

DeviantArt’s Muro Drawing App Is Pure HTML5 Awesomeness

The folks at DeviantArt, a website best known for hosting images of fairies and vampires created by gothy art students, have debuted a new browser-based drawing tool created entirely with web standards.

Muro works in all modern browsers, and you can dive in and start drawing on a blank canvas, all without Flash or any other plug-in. There are several brushes available to everyone, but to access the more advanced features, you’ll need to create a DeviantArt account and log in.

The image above was created by DeviantArt user loish using the new tool. It’s amazing to see what people are creating with it.

Muro is reminiscent of other browser-based drawing tools like Odosketch, which uses Flash, and Sketchpad, which, like Muro, uses only web standards. But Muro is cleaner and more of a joy to use than any other HTML5-based sketching app I’ve seen.

As browsers become more powerful and web technologies like HTML5, CSS and JavaScript become more advanced, we’re seeing more and more killer web apps emerge. But productivity apps, fancy fonts and media playback hacks aren’t just interesting tricks we can all marvel at, they are examples of how the web is quickly maturing into a true computing platform.

I found Muro to be more useful on an iPad — a fingertip is much more forgiving than a mouse or a trackball when you’re trying to draw something on a screen. Also, the default settings seem to be optimized for the iPad’s browser. In Chrome and Firefox, it took some fiddling to get the brushes to the point where they produced the desired results. But once you get the hang of it, it’s super easy and fun. You’ll waste a lot of time if you’re not careful.

I also asked Dennis Crothers, Wired.com’s head of user experience, to give it a test drive with his Wacom tablet. You need to be running Wacom’s tablet data plug-in (which you probably already have installed if you have the device) for it to work. He was impressed. He says Muro isn’t the best drawing tool out there — this is coming from a designer who spends the bulk of his days in Adobe Illustrator — but for an HTML5 web app, he says it’s an excellent piece of work. I agree.

Green-haired girl by loish. Crappy Veve by me.

See Also:

File Under: Social

Lots of Hubbub About Flipboard

It’s the iPad app everyone’s talking about. It’s free and available for download.

Flipboard is a social networking aggregator. While we’d argue that the flexibility of the open web experience is still more desirable than the closed-off app experience, Flipboard does a decent job of simplifying and “cleansing” the most important social web activities. You still get most of the functionality — tweeting, sharing, browsing — but without the clutter that web-based aggregators can’t seem to shake.

Give it a spin. And tell us: Where do you do your social networking? In the browser or on your touchy-shiny?

Nice bit of Aphex Twin on the video soundtrack, BTW.

File Under: HTML5, Mobile, Web Apps

Gmail Mobile Is Always on the Move


Google has updated its mobile Gmail interface for iPad users. The company announced the update Monday on the official Google Mobile blog. To see the updated interface, just surf to Gmail using Safari on your iPad.

Gone is the split-screen interface for composing e-mails. Now, you get a tasteful, lightboxed modal overlay — fewer distractions, cleaner and more room for the text of your e-mail. A screenshot is above. The changes will only show up for iPad users, and the new site (for now) is only available to English-language users.

It’s not a major update, but it demonstrates a new way of developing the web app that allows Google to respond more quickly to user feedback. Google switched the product over to a more easily-iterative HTML5 codebase last year. The mobile Gmail site gets updated more frequently — usually just small stuff here and there — and is becoming faster and more usable all the time.

On my own iPhone, I switched from the native Apple mail app to Gmail’s mobile web interface long ago, and I’ve never gone back. I still use the native mail app to send e-mails when I have to (from Twitter or Instapaper, for instance) but for everything else, I use the Gmail web app in Safari. In the early days, it was fairly painful, but it’s gotten much faster and much more usable since Google switched to the current iterative approach. The floating control bar, the swipe-to-archive gesture, the menu navigation and the way threaded conversations expand and contract are elegant, innovative enhancements that all web app developers can learn from.

What do you use for mobile e-mail? Native or web app? Let us know and tell us why you chose that route in the comments.

See Also