Twitter.com or a Twitter App?

Matt Buchanan at Gizmodo comparing the new Twitter.com to a native application:

The new Twitter feels a lot like an application, slapped on top of Twitter.com. That’s partly because it’s built like an application. It uses the same Twitter API that any third-party app does. The two-pane split view recalls the iPad Twitter app, and the design intent is largely the same: to keep you on Twitter.com while you’re consuming the content the people you follow are tweeting. The right pane is like an activity panel. It expands out to show conversations between users, photos, videos, profile info, location and more. And the whole thing flows insanely smoothly and dynamically, like an app. There’s infinite scrolling, so tweets keep coming as you scroll down. When you click the arrow to expand a tweet into the right panel, it shoots out like a card. There’s even keyboard shortcuts and autocomplete like a real app (or Gmail, another exemplary web app).

VideoJS

VideoJS look to be a beautifully designed HTML5 video player. It has really nice looks, with the ability to easily skin the player with CSS. It also has a very clever architecture which incorporates Video for Everybody – a fallback technique which provides support on pretty much any browser regardless of HTML5, Flash or Javascript compatibility.

It’s released under a GNU license, and I think it’s very neat, and very stylish solution if you’re planning to serve up your own video files.

“ū—”: A Distraction-Free Writing Environment

Cheeky but fun little parody by Merlin Mann of the Writer app which I mentioned yesterday:

We call this workhorse “ū—” in tribute to an untranslatable Inuit word meaning, “the moment when Family Leader finds himself sweeping yak hair from the [ice-covered lean-to] while his angry wife screams heavily-distracting criticism of Family Leader’s time use.” Since it’s untranslatable and we don’t speak a word of Inuit, we’re not sure what that word would be. But, we definitely thought “ū—” sounded cool and a little Eskimoey.

Also, we had to come up with a name that wasn’t already on the App store. So.

Writer for iPad

This new writing application for the iPad from Information Architects is pure elegance. Hardly surprising considering the well-thought philosophy behind it:

Professional Typography is not just pretty to look at. It facilitates the process of reading. If you look at text as an interface, typography is its usability. Common text editors are typographically weak (small font, tight leading, random measure, lack of whitespace). In addition, few people have the professional skills to design digital text. In Writer, font type, text size, column width, leading and contrast are carefully set for the best reading experience both in portrait and landscape mode.

I’ve been finding it difficult to find a reason to invest in a first-generation iPad, but it’s beautiful apps like this which might just sway me. The thoroughness of their branding nails it:

The period at the end of the logo reflects the main virtue of the application: It pushes you to get to the point.

The Tech Behind the New Twitter.com

An interesting technical look at the architecture and technology behind the new Twitter.com:

One of the goals with this project was to make page navigation easier and faster. Building on the web’s traditional analogy of interlinked documents, our application uses a page routing system that maintains a strong relationship between a URL and its content. This allows us to provide a rich web application that behaves like a traditional web site. Doing so demanded that we develop a rich routing model on the client. To do so we developed a routing system to switch between stateful pages, driven by the URL hash. As the user navigates, the application caches the visited pages in memory.

The team behind this build have made some very brave, and yet very intelligent architectural decisions. Although the site is a very sophisticated Javascript application, it’s encouraging that it builds upon one of the core design principles of the web: the URL as context.

And for anyone who doubts my recent assertion that the browser has re-emerged as a serious application platform:

With #NewTwitter, we’ve officially adopted JavaScript as a core technology in our organization.

Hallelujah.

Who Will Own The Living Room?

Techi analyse the four main players in the race to dominate the living room:

What is clear is that right now, no-one is quite sure what the winning formula is. Do you create a service like Netflix that is accessible through a whole whack of hardware? Do you make the hardware and ecosystem for others to display content? Or do you do both, and hope that the integration of hardware and software makes your experience the most desirable?

All four of the companies above have their strengths. Apple have their brand and UI expertise. Google have their software wizadry. Sony have their engineering chops and Playstation brand, while Microsoft have the capacity to reach huge numbers of people. But which model will win out? It’s likely it will still take years to find out.

I suspect that none of these big boys will “own” the living room, simply because the living room is an intimate space which isn’t prime for “domination”. It’ll take an innovative and more holistic disruptor to come along and make any impact on the transformation of the digital TV space.

Why the new Twitter.com design changes everything

This week, Twitter unveiled a new design for their website, and I think it’s a really important step in the evolution of their service, and web services in general.

The fact that Twitter has such an open and powerful API is what has allowed a thriving ecosystem of apps and services to grow and evolve. This is Twitter’s success: the micro-blogging service in and of itself isn’t the main catalyst for it’s wide adoption, it’s the way the core service can be used, applied and integrated in so many different ways, on any platform, anywhere there is a data network. It has, essentially, created an accessible, non-passive use for portable, mobile computing.

Despite languishing with a slightly ageing design, and with so many different apps around for accessing the micro-blogging service, it’s quite surprising that twitter.com is still used by the majority of users. The fact is though, that despite nonsense claims to the contrary, most of our online activity still takes place on the web, particularly when it comes to interactions. The browser is still the best choice for, well: browsing.

Apple popularised the model of the “app”, making software sexy again. Installing bespoke, well-designed apps to access your favourite online services is quick and easy – and they’ve proven that we’re willing to pay for that speed and ease. If we have so much choice when it comes to shaping our experience of Twitter, then why is their website so important?

Something is changing. Software – whether it be installed apps, or web apps – are becoming easier to use, and our online interactions are becoming ubiquitous with our everyday lives. Without even knowing it, we’re all becoming power users. We’re demanding better online experiences; we’re demanding more immersive online experiences.

The fact is that the browser is still the best platform for developing online applications, and the new twitter.com proves that. Embedded media available instantly? Show me a desktop or mobile app that can do that as elegantly. Infinite scrolling? Even the super-elegant Twitter for iPhone app does this clunkily. Related content? Inline bio panels? True, not every user wants these features all the time, but when you do want them, the browser delivers the best experience. And it’s quite telling that the new design is based so heavily on the Twitter iPad app: I think it says a lot about the kind of interactive design we’re coming to expect as we move into a new era of portable, cloud computing.

And, yes: desktop or mobile applications can be developed which do the same things. But the frameworks and development tools of the web have matured to a point where it is possible to develop and roll out these kinds of advanced features with ease. Want to roll out a new feature for an installed app? Develop, deploy, wait for the user to upgrade. Want to roll out a new feature on a web app? Develop, deploy – as often as you like. Services, APIs and applications are all well and good, but when it comes to getting the most immersive, immediate and adaptable experience: HTML is still king.

The browser as a platform: I think we’re finally there.

Less Framework 2

Joni Korpi has released version 2 of the mightily impressive and devilishly simple Less Framework. It uses CSS3 media-queries, mixed with a dash of column layout to create a distinctly unobtrusive framework for fluid CSS layouts.

Less Framework uses inline css3 media-queries to switch between three layouts:

  • a two-column layout at 320 px, for smartphones
  • a five-column layout at 768 px, for iPads and netbooks
  • and an eight-column layout at 1280 px, for desktops and laptops.

The code is beautifully simple, with a minimal set of features. It provides a perfect foundation for working with media-queries, without bundling in too many bloated features to get in your way.

All three layouts essentially use the same grid. They all have the same column width (120 px), the same gutters (24 px), and the same vertical rhythm (24 px). The only things that change are the amount of columns and the margins around the layout. This means you’re not designing three different layouts, but rather three variations of one layout.

It’s free and easy to download and implement, and is released under Creative Commons. Total win!

Flash is not a de facto standard technology

John Gruber continues to hammer home the reasons why Apple’s abandonment of Flash on mobile and touch devices is a good thing for web standards:

If no one releases a popular web browsing platform that lacks Flash support, then web sites that already publish Flash content are never going to move away from it. I think the web would be a far better place without Flash, or, at least, with Flash relegated to a position like that of Java applets: there if you want it, but not a major foundation.

Flash is never going to decrease in popularity so long as all web browsers support it. Flash might decrease in popularity because of iOS. If you believe that Flash’s current position as a de facto standard technology is harmful to the web, then users — not just iOS users but everyone using the web — would benefit if that happens.

I don’t think Flash is quite as evil as some commentators make out – it can be a powerful tool. But I agree that it needs to be repositioned: less as a standard web technology, and more as a bespoke application platform. So much of the stuff people use Flash for can now be achieved almost effortlessly with modern Javascript frameworks and clever use of CSS. I’ve yet to see a practical example of where Flash could be applied to applications on a mobile device.

Why Does Clean Markup Matter in Web Design?

Webdesigner Depot are on a roll at the moment, putting out some really useful and informative articles, covering some of the basics of good web practice. This latest article covers the practical, long-term benefits of using clean, maintainable  markup:

Mobile browsing is growing like Godzilla on atomic-steroids. Instead of being relegated to the jet-setting Blackberry addicts from 5 years ago, today everyone is using their phone to surf the web.

Assistive technology -screen readers for the blind and alternate interface devices for the handicapped- is common, and you don’t want to lose a sale or alienate traffic just because you didn’t take that into account.

Your site is likely to be translated into a half-dozen languages as readers from around the world find your content. Thanks to the Internet ArchiveGoogle’s cache and others, pages you publish today will be around for a long, long time even after they’ve been removed from your live site.

Clean markup and standards-compliance will go a long way to ensure your sites work in each of these scenarios.

Even if you’re a hardened web developer who knows your craft well, I think it’s always good to refresh your basic knowledge with articles like this: sometimes to reinforce your assertions and assumptions; and sometimes to pick up useful tidbits which have passed you by, or which you haven’t given much thought to.