• Shortcuts : 'n' next unread feed - 'p' previous unread feed • Styles : 1 2

» Publishers, Monetize your RSS feeds with FeedShow:  More infos  (Show/Hide Ads)


Date: Monday, 11 Nov 2013 08:00

Last Friday, someone at Microsoft posed “What is your favorite font?” as the day’s question on twitter. It’s a good question, but I took issue with something small. It’s embarrassingly trivial, but here goes: I think they should have said “typeface” not “font.” Here’s why:

The difference

First, my take on the difference between those terms.

In traditional print, the distinction is easy: a font was a typeface set at a certain size, weight and style and cast in metal. There was no way to buy just a typeface. Instead you bought a font: Garamond Bold at 13 points.

In its digital form, fonts are more flexible and the moment when a typeface becomes a font is way more nuanced. In fact, it’s common to use the two interchangeably. Wikipedia even says they’re synonymous but I (and others) disagree.

I think it’s easiest to understand the difference by analogy: a typeface is like a song and a font is like a recording. One is the definition, the other is an instance. One is a concept, the other a manifestation.

This distinction is why you can have multiple foundries that sell fonts of the same typeface. A classic example of this is Garamond, a typeface that came into being nearly 400 years ago (well before truetype, shortly after printing presses). But today you can buy Garamond (the font) from at least a dozen sources. Here’s a sampling (from wikipedia).

The many flavors of Garamond

Those are all the same typeface, but each is a different font. Make sense?

In our music analogy, Garamond is like Beethoven’s Fifth and Adobe Garamond Pro is like this Telarc recording. That’s just one (great) recording and there are certainly others.

Seems Kind of Academic

Yeah, it totally is. In reality, this distinction normally doesn’t matter and people use font and typeface interchangeably all the time. So why the nitpick? Mostly because I think it’s interesting. But also, even if subtle, it’s a real difference—and once you know it, you can’t help but notice it.

You already do this with familiar media types. Even if you might ask someone about a favorite CD, Rolling Stone wouldn’t. They would call those albums. The CD, after all, is just the medium. You also wouldn’t ask someone about their favorite vacation JPEGs (although that might be extending the analogy too far, but you get the point).

So now you’re armed. When someone asks you about your favorite font you’ll know that they probably really want to hear about your favorite typeface. Unless, of course, they’re shopping for Garamonds (in which case, you can send them here).


Update: Incredibly, Erik Spiekerman saw this post and summed it up perfectly with these eight words: you design a typeface, you make a font. Enough said.


Another Update: Leave it to the crack team at Hacker News to make sure you know when you got it wrong! Someone pointed me to this fantastically simple explanation of font vs. typeface from Jon Tan:

A typeface is a family of fonts (very often by the same designer). Within a typeface there will be fonts of varying weights or other variations. E.g., light, bold, semi-bold, condensed, italic, etc. Each such variation is a different font. The only evolution in terminology that results from the transition from metal-cast to digital fonts is that (point) size is no longer fixed.

This is a slightly different take than mine. His point is that Helvetica and Helvetica Bold are different fonts, albeit one typeface. I think that’s accurate, but it fails to make a distinction between the conceptual and the physical. For some reason, I still prefer to think of these terms through some kind of a dualistic lens. Jon Tan’s description, however, is too clear and concise to ignore.

The fact is that these terms are evolving and adapting to a digital world. The way I described their usage in this post seems to match the way that I see a lot of typographers using the terms today. Frankly, if you’ve made it this far, then you probably have a more nuanced understanding of the terms than you really need!

Finally, numerous commenters pointed out that Garamond is rarely used by any knowledgable typographer to refer to a specific typeface. Rather, it gets used like the terms “Clarendon” or “Bodoni” to refer to a whole class of typefaces that have certain characteristics. I think the analogy still stands, but it would have been better for me to choose a typeface like Futura or DIN. Both of those typefaces have been digitized by more than one foundry and, therefore, exist as distinct fonts even though they are intended to represent the same typeface.

Author: "--"
Send by mail Print  Save  Delicious 
Date: Friday, 28 Jun 2013 07:00

Let’s get this out of the way: by writing I mean long-ish, thoughtful, take your time, structured writing. The kind that makes your brain work: a long email, a short story, a love letter, a business plan, etc.

I don’t think we’ve forgotten how to do that. If anything, the amount of long form communication in the world seems to be on the rise, and technology is to blame. It may have started with laser printers, then WordPerfect which became Word which became WordPress.

But take a second look. Those advances may have made us better publishers but not necessarily better writers. Want really precise kerning? You got it! Care to know how many people read about your trip to Vermont. No problem! Writing may be on the rise, but publishing has exploded!

Sadly, this attention to form over content might be getting in our way and has left serious writers looking for something simpler. The last half decade has given rise to a set of newer tools focused on the thing that’s gone missing (the writing in writing) and one of these innovations is Markdown. If the last biggest advance in real writing technology was the typewriter, I think Markdown might be the next.

Note: not familiar with Markdown? There’s a 30 second overview at the end of this post. You may want to skip ahead and then come back.

Why Markdown Matters

Before moving on, let’s put a picture in your head. If you do any serious writing in Markdown, you do it in an app made for Markdown (and there are lots of them). So when you imagine writing in Markdown, you need to envision an environment where Markdown makes sense. You’re not in a code editor and you’re not in Word. You’re probably using something that looks like this:

Markdown Editor

Now that you’ve got that in mind, loving Markdown boils down to this: Markdown lets you think about what you’re writing instead of how it looks.

Don’t get me wrong. You should care about how a document looks, but do that after the writing, not during. In fact, any time you spend thinking about bullet indentation or paragraph spacing while you’re supposedly writing is time that you’re not actually writing. And it’s probably killing your flow while tricking you into feeling productive.

Markdown, on the other hand, lets you capture the meaningful aspects of formatting (e.g. make this bold because it’s important) without any concern for its presentation. You stay focused on ideas, not looks.

Markdown is intentionally really simple so bits of formatting that you have at your disposal are limited: bold, italic, headings, lists, links, images, footnotes and quotes. That’s about it. That might seem like a drag if you’re accustomed to dozens of text styles, infinite font choices, page margins and “smart art,” but that stuff can come later. Right now you’re writing.

More importantly, sticking to the basics means you’re producing a much more universal document, one that can be rendered anywhere, in just about any format. Paul Soders thinks that’s important. Third in his list of suggestions for creating future-aware web content:

Design for scrapers first. No fonts, no headers, no navigation, no slideshows, no buttons. What does the content look like in Instapaper? Design that view first. Realize that you will have no control over this view.

But Wait, Isn’t Markdown Nerdy and Mostly for Geeks?

Yes.

At least Ev Williams (cofounder of Blogger and then Twitter—a guy who dreams up our writing future) says so. He doesn’t think people are ready for Markdown (yet) and he’s taken a solid middle-road approach with medium.com by limiting formatting to roughly the same tiny set of options that Markdown supports, but in a more visual way. This is your medium.com toolbar:

Medium Toolbar The medium.com toolbar

I’ll give it to those guys. That might be more palatable for a lot of people. But for serious writers, it’s unnecessary. Markdown is easy and writers are smart. I think we can ditch the toolbar…if not today, then soon.

First, we’re becoming less afraid of tiny embedded mini languages. We use hashtags and emoticons without hesitation. Markdown isn’t such a big leap from there. That’s more true for my kids than for my mom, but we’re talking about the future here.

Second, Markdown is easy to learn. Super easy. In fact, if you’re used to any kind of plain text writing (even text messages) then you might already be familiar withs one markdown conventions: numbers or dashes at the beginning of a sentence to create a list, asterisks around a word for emphasis, etc. You can learn the basics in five minutes and it will be second nature after thirty.

Third, text-driven formatting is appealing for devices. It’s really hard to select text with your finger and then tap something to make it bold. It’s straightforward to insert a character or two. If you don’t think that on screen keyboards make for serious writing tools, then watch this guy.

Making Markdown Mainstream

Along those lines, FiftyThree (maker’s of Paper and my personal startup crush) have raised some money so they can create the office suite of the future (a timely crusade)—presumably for devices. I hope they nail it and I really hope it involves Markdown or something like it.

Is that crazy? I’ll let you know in a week. First experiment: I’m going to peel my regular, non-nerd 7 and 9 year-old kids away from their rollerblades to teach them Markdown. Then we can see. After all, they’ll be using this supposed writing tool of the future for Junior High School essay writing. No harm is getting started now. They’ve already started blogging.


Aside: Markdown Primer

Don’t know what Markdown is? Here’s your 30 second introduction. If you’re looking for more, start at the source or try what is markdown or wikipedia.

You know how most word processors have a bunch of buttons for formatting (bold, headings, underline, etc.)? What if you could add all of those formatting details right into the text as simple little codes, allowing you to think about what you’re writing instead of how it looks. That’s markdown. It’s a handful simple text conventions that can easily be translated into rich formatting later on.

It’s easier if you see it

Markdown Converter Side-by-side

And even better if you give it a try. Here are some favorite tools:

  • Markable (online) Want to get started right now? This is a nice looking editor in the browser. Not great for distraction-free writing, but a good way to see Markdown in action.
  • Writedown (for Mac) It’s cheap, beautiful, focused and efficient. Minimal feature set, but perfect for occasional writers.
  • Ulysses III (for Mac) Much bigger aspirations and 90% there. Best if you write a lot and want a centralized place to track it all. More expensive.
  • Mou (for Mac) A geekier option than the other two. Tons of features and free! Missing a handful of features that would make it great for writing (I really wish there were a way to limit the the line length, for example. That makes it hard to use full screen.)
  • OmmWriter (for Windows/Mac) No direct support for Markdown, but there’s nothing stopping you from using it. It’s uniquely good a creating a zen–like distraction free writing environment (with a mix of sound effects and background imagery) and it’s my writing tool of choice for Windows.
  • MarkdownPad (for Windows) Also geeky and Mou-esque in it’s feature set and appeal.
Author: "--"
Send by mail Print  Save  Delicious 
Date: Monday, 31 Dec 2012 19:43

I’m barely sneaking this in before the end of the year, but here it is! My favorite albums from 2012. These are roughly in order. I listen to a lot of music (if you’re at your computer all day, you probably do to) and this list is the game I play all year. It’s kind of a gimmick so that I keep thinking about music. It’s tough to say what puts an album onto the list so, normally, I try to post some commentary too, but I’m afraid I won’t post anything if I wait for that this year. So, here you go…the top 25!

Author: "--"
Send by mail Print  Save  Delicious 
Date: Monday, 31 Dec 2012 19:43

I’m barely sneaking this in before the end of the year, but here it is! My favorite albums from 2012. These are roughly in order. I listen to a lot of music (if you’re at your computer all day, you probably do to) and this list is the game I play all year. It’s kind of a gimmick so that I keep thinking about music. It’s tough to say what puts an album onto the list so, normally, I try to post some commentary too, but I’m afraid I won’t post anything if I wait for that this year. So, here you go…the top 25!

Author: "Robby Ingebretsen" Tags: "Music, 2012, top albums"
Comments Send by mail Print  Save  Delicious 
Date: Monday, 30 Apr 2012 16:11

We (at Pixel Lab) have mixed feelings today as we wish our friend and colleague Derek Lakin the best of luck in his new role at Microsoft. We’re a really small group and losing someone as talented as Derek is hard. He makes an amazing contribution to the team. Mostly, however, he’s become a great friend and it won’t be the same around here without him.

On a brighter note, Derek will be on the Skype team at Microsoft in Stockholm and I’ve volunteered to be a frequent source of testing. Hopefully that means we stay in touch! Still, the best part of running a company is that you get to choose who you work with and Derek was a great choice.

Good luck, Derek!

Author: "Robby Ingebretsen" Tags: "Other"
Comments Send by mail Print  Save  Delicious 
Date: Saturday, 14 Apr 2012 02:47

Manifesto is kind of an old fashioned word. I started flirting with it because of Paper (the app). I’ve been a little obsessed with Paper, both the product and the process that made it.

If you haven’t seen it, Paper is an iPad app for sketching. It’s probably only 20% different than a dozen other apps but it’s 1000% better. Just about everyone agrees. They’ve sold 1.5 Million copies in 2 weeks, The Verge started reviewing styluses and Amazon ran out of them (for a few days at least). We’re all buying styluses now, mostly because of one app.

What makes it so much better? There’s been endless opinion about this. The convergence seems to be on their painstaking attention to detail and focus on doing a single thing well. Sounds familiar. In fact, that seems to be the magic one-two for creating a great version of anything: focus and then a relentless committment to doing that thing well.

That’s why you need a manifesto. It’s a powerful instrument that helps you do both of those. I started thinking about that word when I saw it here:

Paper Screenshot

That’s from a sample Paper sketchbook called “Making Paper” that ostensibly contains notes about the process of building the app and the brand. This page is to be their site map and the real page does, indeed, contain a manifesto. Their’s reads:

We noticed that somehow, along the way, software designed to help us be creative actually made us less creative. That’s because we believe our best ideas emerge when we use pencils and paper. So we set out to build tools that work the way we do.

I don’t have a dictionary definition of manifesto at hand. I’ve avoided looking it up because I’m willing to hijack it (take that word meanings!). I think of it this way: a manifesto is a declaration of why the thing you do makes the world better.

Sounds simple, and maybe it is. Maybe you’re already working under some assumptions that roughly add up to one. The power of the manifesto, though, only comes when you write it down. Keep it short and understandable. You should have a single sentence version and a single paragraph version and then be ready and excited to lay those on anyone that asks. To be clear, it’s not the sentence or the paragraph that matters. It’s the process and the fight for clarity that makes the difference.

Until you write it down, your manifesto is not a manifesto. It’s just those rough assumptions, equivocal ideas and inconclsusive connections. That amorphic thing has no power, no ability to make you focus and no capacity to strenghen your comittment. I think you have to write it down and then share it. I’m writing mine.

Paper had a manifesto and they knew it. They labeled it. I think some people might have the clarity of mind to create these naturally, without trying. For the rest of us, it takes some work but I suspect it can become a habit.

I started looking for examples and their are dozens, probably hundreds. Find a hero (a business you love, a thinker you want to emulate, a creation that touched you, a leader you want to follow) and you won’t have to dig deep to find a manifesto. They might not call it that (probably won’t), but the evidence will emerge in the form of an alluring ability to simply state their reason for being, coupled with an infectious commitment to what they create. And that’s the magic.

Author: "--"
Send by mail Print  Save  Delicious 
Date: Saturday, 14 Apr 2012 02:47

Manifesto is kind of an old fashioned word. I started flirting with it because of Paper (the app). I’ve been a little obsessed with Paper, both the product and the process that made it.

If you haven’t seen it, Paper is an iPad app for sketching. It’s probably only 20% different than a dozen other apps but it’s 1000% better. Just about everyone agrees. They’ve sold 1.5 Million copies in 2 weeks, The Verge started reviewing styluses and Amazon ran out of them (for a few days at least). We’re all buying styluses now, mostly because of one app.

What makes it so much better? There’s been endless opinion about this. The convergence seems to be on their painstaking attention to detail and focus on doing a single thing well. Sounds familiar. In fact, that seems to be the magic one-two for creating a great version of anything: focus and then a relentless committment to doing that thing well.

That’s why you need a manifesto. It’s a powerful instrument that helps you do both of those. I started thinking about that word when I saw it here:

That’s from a sample Paper sketchbook called “Making Paper” that ostensibly contains notes about the process of building the app and the brand. This page is to be their site map and the real page does, indeed, contain a manifesto. Their’s reads:

We noticed that somehow, along the way, software designed to help us be creative actually made us less creative. That’s because we believe our best ideas emerge when we use pencils and paper. So we set out to build tools that work the way we do.

I don’t have a dictionary definition of manifesto at hand. I’ve avoided looking it up because I’m willing to hijack it (take that word meanings!). I think of it this way: a manifesto is a declaration of why the thing you do makes the world better.

Sounds simple, and maybe it is. Maybe you’re already working under some assumptions that roughly add up to one. The power of the manifesto, though, only comes when you write it down. Keep it short and understandable. You should have a single sentence version and a single paragraph version and then be ready and excited to lay those on anyone that asks. To be clear, it’s not the sentence or the paragraph that matters. It’s the process and the fight for clarity that makes the difference.

Until you write it down, your manifesto is not a manifesto. It’s just those rough assumptions, equivocal ideas and inconclsusive connections. That amorphic thing has no power, no ability to make you focus and no capacity to strenghen your comittment. I think you have to write it down and then share it. I’m writing mine.

Paper had a manifesto and they knew it. They labeled it. I think some people might have the clarity of mind to create these naturally, without trying. For the rest of us, it takes some work but I suspect it can become a habit.

I started looking for examples and their are dozens, probably hundreds. Find a hero (a business you love, a thinker you want to emulate, a creation that touched you, a leader you want to follow) and you won’t have to dig deep to find a manifesto. They might not call it that (probably won’t), but the evidence will emerge in the form of an alluring ability to simply state their reason for being, coupled with an infectious commitment to what they create. And that’s the magic.

Author: "Robby Ingebretsen" Tags: "Design, Apps, manifesto, paper"
Comments Send by mail Print  Save  Delicious 
Date: Thursday, 15 Mar 2012 07:29

When I worked at Microsoft on the WPF team, my job was to manage (“project manage” that is) the controls team. We (at least thought we) were an important team. Controls are big deal, a huge part of what UI framework does. The other half of the WPF team was the Documents Team and for those guys, controls were kind of an after thought. You don’t really need controls in document platforms.

Until a few years ago, we all thought the web was more like the Documents team than the UI team but things are changing quickly and today we think of HTML as an app platform as much as a document platform. Windows 8 has bet on that. So has just about everyone.

Oddly, though, we still don’t have a great components framework for HTML. Personally, this drives me nuts. There’s not a standard way to encapsulate reusable bits of UI on the web. Don’t get me wrong, we hack our way through it pretty successfully (I’m looking at you jQuery plugins / jQuery UI) but everyone has a different approach. Some are better than others. Few are easily extensible. Most have inconsistent support for styling, subclassing, etc. It’s kind of a mess and it’s lacking the rigor of a UI-first framework.

Incidentally, the Windows folks have done a stand up job at addressing this in Windows 8 using data- properties to flag a div as a control (e.g. <div data-win-control="WinJS.UI.ListView" />). There’s been some criticism of that approach, but I personally like it. It’s a tough problem because the HTML spec simply doesn’t provide a solution today.

Well, all is not lost! In trying to figure out how we organize our component library for HTML, I’ve found two promising solutions:

Quick UI

First, is QuickUI. It hasn’t gotten the attention it deserves, but it’s awesome. It’s immediately intuitive (especially if you’re coming from a component driven framework like WPF or Silverlight), extensible, flexible, stylable, etc. It’s also declaritive (like XAML). There’s a good walkthrough on the site that will bring you up to speed in 30 min. and there’s big library of free controls (ready for styling). For me, though, the exciting bit is the extensibility. There’s a clear path for creating your own reusable QuickUI components.

If it feels a little like WPF, don’t be surprised. It’s the brainchild of Jan Miksovsky. He’s also a former Microsoft guy (an early UI guru there that invented all kinds of things that today we take for granted). He was also super influential in helping us define early requirements for WPF. He’s a components guy. He’s one of those UI-first people that also has a solid engineering background, and the sort of person that does things right or doesn’t do them. QuickUI is pretty amazing and done very thoughtfully.

Web Components

Where QuickUI is my solution for today, the longer term solution might be Web Components. This is new. It’s a spec from some folks at Google and it defines a way to build this kind of extensibility right into HTML. I think it’s incredibly promising and may be a key to HTML becoming a real UI framework.

Incidentally, I came across the spec on Jan’s blog (the QuickUI guy). He sees convergence with QuickUI and Web Components in the future. So there you have it! Invest in QuickUI today and migrate to a better solution later and for free. At least you begin to apply some of that CS rigor that makes the S part of CS true. It’s also the right time to start building out your own library of components. The age of HTML apps is upon us, we just need to wait for HTML to catch up!

Author: "--"
Send by mail Print  Save  Delicious 
Date: Thursday, 15 Mar 2012 00:29

image

When I worked at Microsoft on the WPF team, my job was to manage (“project manage” that is) the controls team. We (at least thought we) were an important team. Controls are big deal, a huge part of what UI framework does. The other half of the WPF team was the Documents Team and for those guys, controls were kind of an after thought. You don’t really need controls in document platforms.

Until a few years ago, we all thought the web was more like the Documents team than the UI team but things are changing quickly and today we think of HTML as an app platform as much as a document platform. Windows 8 has bet on that. So has just about everyone.

Oddly, though, we still don’t have a great components framework for HTML. Personally, this drives me nuts. There’s not a standard way to encapsulate reusable bits of UI on the web. Don’t get me wrong, we hack our way through it pretty successfully (I’m looking at you jQuery plugins / jQuery UI) but everyone has a different approach. Some are better than others. Few are easily extensible. Most have inconsistent support for styling, subclassing, etc.  It’s kind of a mess and it’s lacking the rigor of a UI-first framework.

Incidentally, the Windows folks have done a stand up job at addressing this in Windows 8 using data- properties to flag a div as a control (e.g. <div data-win-control=”WinJS.UI.ListView” />). There’s been some criticism of that approach, but I personally like it. It’s a tough problem because the HTML spec simply doesn’t provide a solution today.

Well, all is not lost! In trying to figure out how we organize our component library for HTML, I’ve found two promising solutions:

Quick UI

First, is QuickUI. It hasn’t gotten the attention it deserves, but it’s awesome. It’s immediately intuitive (especially if you’re coming from a component driven framework like WPF or Silverlight), extensible, flexible, stylable, etc. It’s also declaritive (like XAML). There’s a good walkthrough on the site that will bring you up to speed in 30 min. and there’s big library of free controls (ready for styling). For me, though, the exciting bit is the extensibility. There’s a clear path for creating your own reusable QuickUI components.

If it feels a little like WPF, don’t be surprised. It’s the brainchild of Jan Miksovsky. He’s also a former Microsoft guy (an early UI guru there that invented all kinds of things that today we take for granted). He was also super influential in helping us define early requirements for WPF. He’s a components guy. He’s one of those UI-first people that also has a solid engineering background, and the sort of person that does things right or doesn’t do them. QuickUI is pretty amazing and done very thoughtfully.

Web Components

Where QuickUI is my solution for today, the longer term solution might be Web Components. This is new. It’s a spec from some folks at Google and it defines a way to build this kind of extensibility right into HTML. I think it’s incredibly promising and may be a key to HTML becoming a real UI framework.

Incidentally, I came across the spec on Jan’s blog (the QuickUI guy). He sees convergence with QuickUI and Web Components in the future. So there you have it! Invest in QuickUI today and migrate to a better solution later and for free. At least you begin to apply some of that CS rigor that makes the S part of CS true. It’s also the right time to start building out your own library of components. The age of HTML apps is upon us, we just need to wait for HTML to catch up!

Author: "Robby Ingebretsen" Tags: "Code, Silverlight, components, controls,..."
Comments Send by mail Print  Save  Delicious 
Date: Thursday, 26 Jan 2012 10:28

Here’s a fun tip about the HTML5 version of Cut the Rope. If you launch the game with this web address:

http://www.cuttherope.ie/?boxbackgrounds=true

…then you’ll get a page background that changes depending on the box your playing. In the first box (the cardboard box) nothing changes. In the fabric and toy (IE) boxes, you’ll see updated background images (the background for the whole page). It doesn’t directly effect the game, but it’s pretty fun.

More importantly, no one knew about this until now so you can impress your firends with your insider knowledge!

Here’s how it happened: I was tasked with designing the “box edges” that surround open boxes (like currugated edge on the cardboard box). I was having a hard time making the box border for fabric (green) box feel right. It kind of clashed with the cardboard background, so I tested it with a special fabric background. It looked cool!

Eventually I worked out a design that didn’t need the custom backgrounds so I disabled them by default, but left them in the game with a querystring parameter (boxbackgrounds=true) so that we could get an opinion from the guys at ZeptoLab (our client, the guys who created the original game). We decided not to use it, but we never turned the feature off. It still works!

So, try it out. Dazzle your kids. Impress your mom. Who doesn’t love a custom background, right?? (Answer: nobody doesn’t love a custom background).

Here’s the URL again: http://www.cuttherope.ie/?boxbackgrounds=true

Author: "--"
Send by mail Print  Save  Delicious 
Date: Thursday, 26 Jan 2012 02:28

image

Here’s a fun tip about the HTML5 version of Cut the Rope. If you launch the game with this web address:

…then you’ll get a page background that changes depending on the box your playing. In the first box (the cardboard box) nothing changes. In the fabric and toy (IE) boxes, you’ll see updated background images (the background for the whole page). It doesn’t directly effect the game, but it’s pretty fun.

More importantly, no one knew about this until now so you can impress your firends with your insider knowledge!

Here’s how it happened: I was tasked with designing the “box edges” that surround open boxes (like currugated edge on the cardboard box). I was having a hard time making the box border for fabric (green) box feel right. It kind of clashed with the cardboard background, so I tested it with a special fabric background. It looked cool!

Eventually I worked out a design that didn’t need the custom backgrounds so I disabled them by default, but left them in the game with a querystring parameter (boxbackgrounds=true) so that we could get an opinion from the guys at ZeptoLab (our client, the guys who created the original game). We decided not to use it, but we never turned the feature off. It still works!

So, try it out. Dazzle your kids. Impress your mom. Who doesn’t love a custom background, right?? (Answer: nobody doesn’t love a custom background).

Here’s the URL again: http://www.cuttherope.ie/?boxbackgrounds=true

Author: "Robby Ingebretsen" Tags: "Design, backgrounds, cut the rope, easte..."
Comments Send by mail Print  Save  Delicious 
Date: Wednesday, 11 Jan 2012 22:57

Monday was a big day Pixel Lab. We had the incredible opportunity of developing the HTML5 version of Cut the Rope for ZeptoLab (the brainiac creators of the game) and Monday was the launch. Overall, the feedback has been incredibly positive. It’s been cool to see people get excited about what you can do with standards-based code in a modern browser.

A handful of people (CNET, here) have noticed that the game appears to require Flash. That’s partially true. The more accurate statement would be: the game will fallback to Flash for audio in some browsers. We’re a little more aggressive about this than we meant to be (more below). More importantly, the Flash decision came about because we were trying to make the game more fun for as many people as possible. Here’s the “behind the scenes” on how we ended up with Flash in an HTML5 game (and a little about HTML5 audio along the way).

HTML5 Audio

First a little bit about sound in HTML5. Right now, there is only one way standards-based way of getting sound into the browser: the <audio tag. It’s the sound-only equivalent of the video tag. It is, of course, a great addition to the spec, and for most audio—like podcasts and music—it works great in just about every browser.

Sound effects, on the other hand, are a little different. As you can imagine, short, repetitive, time-critical sounds like you find in a game can tax your soundcard in a different way and, frankly, not every browser does a good job in that situation. In fact, the requirements are different enough that there are new standards being proposed to handle this more complex kind of audio. Those standards are still emerging. So, while the future is promising, the present leaves us with a single option: we’re stuck with the <audio tag for any kind of HTML5 audio be it podcasts or sound effects.

HTML5 Standards in Cut the Rope

Our development goal for the Cut the Rope was to be 100% HTML5 and everyone (us, Microsoft, ZeptoLab) was really committed to this from day one. So, naturally, we built an sound library for the game based on the single HTML5 solution we had available to us: that audio tag.

Unfortunately, the sound was quirky from the beginning. We had great luck in IE (that’s true, not a plug), but as we cycled through different implementation strategies we found quirks in just about every other browser. We tried: recycling audio elements, instantiating audio elements on each play, using audio “sprites” (where we combine sounds into fewer audio files and use offsets to play the sound effects) and using different encoding strategies but nothing reliably fixed the issues.

I don’t think this is news. If you look around, you’ll find numerous discussions about HTML5 games and audio issues (here’s one, here’s another). We’ve had similar issues with other HTML5 apps and my impression is that a lot of people are looking to these forthcoming APIs for a long term solution.

The Conflict

Here’s where the story gets interesting. As we got closer to launch, we realized that the overall experience was really impaired by the unreliable audio. The common solution would be to rely on something else (Flash, Silverlight, etc.) as an audio fallback. Just about every sound library on the web does this, but that conflicted with our goal for a purely standards-based game.

To make matters worse, our fallback criteria were complex. We were up against browser quirks and bugs, not just feature support. In other words, even if a browser supported HTML5 audio we weren’t guaranteed that it would reliably handle the complex sound requirements of the game.

The easy thing would have been to do nothing. The most common side effect would be that audio stops working right around the beginning of the second level. Frankly, Internet Explorer (only coincidentally the sponsor for the project) was the only reliable browser so doing nothing could have been seen as a win for them. To their credit, they didn’t want to do that.

Everyone agreed that we wanted the game to be great in every browser. Microsoft and ZeptoLab were resolute on this point. We were too. Here’s where I think we made the right decision: after days of attempting to get our library working in all browsers, we decided to enable Flash audio for browsers where we had seen audio issues. The only browser where we had seen consistent and low-latency audio in every case was IE. That meant making Flash a fallback option for every other browser.

This may seem a little aggressive, but it had three desirable implications: First, it meant everybody would get audio (the thing that mattered most). Second, it let us stay 100% HTML5 in IE which was, understandably, an important goal for Microsoft. Third, it drastically reduced our testing surface for audio (which we knew to be flaky and quirky and so require a lot of testing).

With that decision, we also took a dependency on the very capable SoundManager2 for our sound effects, relying on their more thoroughly tested Flash implementation. (Not sure if they know that…thanks guys!!)

Loading Issues

We wanted the logic to work like this: if you’re in IE use HTML5 audio, otherwise use Flash… unless Flash isn’t available and then go back to HTML5. This seemed like it would give the most people the best experience. We almost got that right, but after launching we realized that SoundManager2 has a convenient feature that will aggressively force it to use Flash in browsers that don’t have <audio support for .mp3. It’s a cool feature and perfect for podcasters or musicians who rely on .mp3 (and probably aren’t aware that it’s not always supported). It’s not great for us where want to fallback to HTML5 if Flash isn’t available. We didn’t intend to use that feature, but it’s enabled by default. We accidentally left it on.

The result: if a user comes to the site in an HTML5 browser that doesn’t support .mp3 (mostly Firefox which only supports .ogg) then the library will force Flash audio. So, in Firefox we inadvertently ended up with a hard dependency on Flash. This, understandably, was frustrating to Firefox users. The good news is that we’ve fixed that check and will deploy a build with the fix in (hopefully) the next 48 hours.

Try it Yourself

If you’re curious about the audio bugs, you can force the game to use HTML5 audio (no flash) with this link: http://www.cuttherope.ie/?html5audio=true

The bugs are quirky and not everyone will experience them. In fact, at multiple points during development we thought we had solved the audio bugs only to be greeted by another failure hours or days later. You might need to play a couple of levels before the issues show up… or they may not show up at all.

To the credit of SoundManager2, some of the audio issues seemed to get better after we moved to their library (even in HTML5), but we had a beta team of 200-300 people testing the game and the failures were common enough that we still felt it was important to use the fallback. In fact, we would have had to explicitly disable Flash in SoundManager2 and we thought that seemed purely ideological or could even appear nefarious. The truth is that the Flash decision just the opposite: we wanted the game to be great for as many people as possible, regardless of which browser they were using.

Author: "--"
Send by mail Print  Save  Delicious 
Date: Wednesday, 11 Jan 2012 22:57

image

Update: A build that fixes the Flash-related loading problems (see below) in Firefox has gone live. That build also fixed the loading issues with the game on iOS devices and added some (very) basic support for touch events (both iOS and IE10 / Windows 8). Play it at www.cuttherope.ie.

Monday was a big day Pixel Lab. We had the incredible opportunity of developing the HTML5 version of Cut the Rope for ZeptoLab (the brainiac creators of the game) and Monday was the launch. Overall, the feedback has been incredibly positive. It’s been cool to see people get excited about what you can do with standards-based code in a modern browser.

A handful of people (CNET, here)  have noticed that the game appears to require Flash. That’s partially true. The more accurate statement would be: the game will fallback to Flash for audio in some browsers. We’re a little more aggressive about this than we meant to be (more below). More importantly, the Flash decision came about because we were trying to make the game more fun for as many people as possible. Here’s the “behind the scenes” on how we ended up with Flash in an HTML5 game (and a little about HTML5 audio along the way).

HTML5 Audio

First a little bit about sound in HTML5. Right now, there is only one way standards-based way of getting sound into the browser: the <audio> tag. It’s the sound-only equivalent of the video tag. It is, of course, a great addition to the spec, and for most audio—like podcasts and music—it works great in just about every browser.

Sound effects, on the other hand, are a little different. As you can imagine, short, repetitive, time-critical sounds like you find in a game can tax your soundcard in a different way and, frankly, not every browser does a good job in that situation. In fact, the requirements are different enough that there are new standards being proposed to handle this more complex kind of audio. Those standards are still emerging. So, while the future is promising, the present leaves us with a single option: we’re stuck with the <audio> tag for any kind of HTML5 audio be it podcasts or sound effects.

HTML5 Standards in Cut the Rope

Our development goal for the Cut the Rope was to be 100% HTML5 and everyone (us, Microsoft, ZeptoLab) was really committed to this from day one. So, naturally, we built an sound library for the game based on the single HTML5 solution we had available to us: that audio tag.

Unfortunately, the sound was quirky from the beginning. We had great luck in IE (that’s true, not a plug), but as we cycled through different implementation strategies we found quirks in just about every other browser. We tried: recycling audio elements, instantiating audio elements on each play, using audio “sprites” (where we combine sounds into fewer audio files and use offsets to play the sound effects) and using different encoding strategies but nothing reliably fixed the issues.

I don’t think this is news. If you look around, you’ll find numerous discussions about HTML5 games and audio issues (here’s one, here’s another). We’ve had similar issues with other HTML5 apps and my impression is that a lot of people are looking to these forthcoming APIs for a long term solution.

The Conflict

Here’s where the story gets interesting. As we got closer to launch, we realized that the overall experience was really impaired by the unreliable audio. The common solution would be to rely on something else (Flash, Silverlight, etc.) as an audio fallback. Just about every sound library on the web does this, but that conflicted with our goal for a purely standards-based game.

To make matters worse, our fallback criteria were complex. We were up against browser quirks and bugs, not just feature support. In other words, even if a browser supported HTML5 audio we weren’t guaranteed that it would reliably handle the complex sound requirements of the game.

The easy thing would have been to do nothing. The most common side effect would be that audio stops working right around the beginning of the second level. Frankly, Internet Explorer (only coincidentally the sponsor for the project) was the only reliable browser so doing nothing could have been seen as a win for them. To their credit, they didn’t want to do that.

Everyone agreed that we wanted the game to be great in every browser. Microsoft and ZeptoLab were resolute on this point. We were too. Here’s where I think we made the right decision: after days of attempting to get our library working in all browsers, we decided to enable Flash audio for browsers where we had seen audio issues. The only browser where we had seen consistent and low-latency audio in every case was IE. That meant making Flash a fallback option for every other browser.

This may seem a little aggressive, but it had three desirable implications: First, it meant everybody would get audio (the thing that mattered most). Second, it let us stay 100% HTML5 in IE which was, understandably, an important goal for Microsoft. Third, it drastically reduced our testing surface for audio (which we knew to be flaky and quirky and so require a lot of testing).

With that decision, we also took a dependency on the very capable SoundManager2 for our sound effects, relying on their more thoroughly tested Flash implementation. (Not sure if they know that…thanks guys!!)

Loading Issues

We wanted the logic to work like this: if you’re in IE use HTML5 audio, otherwise use Flash… unless Flash isn’t available and then go back to HTML5. This seemed like it would give the most people the best experience. We almost got that right, but after launching we realized that SoundManager2 has a convenient feature that will aggressively force it to use Flash in browsers that don’t have <audio> support for .mp3. It’s a cool feature and perfect for podcasters or musicians who rely on .mp3 (and probably aren’t aware that it’s not always supported). It’s not great for us where want to fallback to HTML5 if Flash isn’t available. We didn’t intend to use that feature, but it’s enabled by default. We accidentally left it on.

The result: if a user comes to the site in an HTML5 browser that doesn’t support .mp3 (mostly Firefox which only supports .ogg) then the library will force Flash audio. So, in Firefox we inadvertently ended up with a hard dependency on Flash. This, understandably, was frustrating to Firefox users. The good news is that we’ve fixed that check and will deploy a build with the fix in (hopefully) the next 48 hours.

Try it Yourself

If you’re curious about the audio bugs, you can force the game to use HTML5 audio (no flash) with this link: http://www.cuttherope.ie/?html5audio=true

The bugs are quirky and not everyone will experience them. In fact, at multiple points during development we thought we had solved the audio bugs only to be greeted by another failure hours or days later. You might need to play a couple of levels before the issues show up… or they may not show up at all.

To the credit of SoundManager2, some of the audio issues seemed to get better after we moved to their library (even in HTML5), but we had a beta team of 200-300 people testing the game and the failures were common enough that we still felt it was important to use the fallback. In fact, we would have had to explicitly disable Flash in SoundManager2 and we thought that seemed purely ideological or could even appear nefarious. The truth is that the Flash decision just the opposite: we wanted the game to be great for as many people as possible, regardless of which browser they were using.

Author: "Robby Ingebretsen" Tags: "Code, Other, audio, cut the rope, flash,..."
Comments Send by mail Print  Save  Delicious 
Date: Thursday, 06 Oct 2011 23:49

image

Of the many sincere and touching tributes to Steve Jobs yesterday, I found Bill Gates’ to be the best and most poignant:


I’m truly saddened to learn of Steve Jobs’ death. Melinda and I extend our sincere condolences to his family and friends, and to everyone Steve has touched through his work.

Steve and I first met nearly 30 years ago, and have been colleagues, competitors and friends over the course of more than half our lives.

The world rarely sees someone who has had the profound impact Steve has had, the effects of which will be felt for many generations to come.

For those of us lucky enough to get to work with him, it’s been an insanely great honor. I will miss Steve immensely.


Bill may understand Steve Jobs in a way that no one else on this planet could. His tribute is perfect. First, he addresses the most important thing: his family, his friends, his colleagues.

Then it’s personal. He and Steve lived through some big stuff together. They pioneered the personal computer and changed the world. He sandwiches the word “competitor” between colleague and friend making that undeniable part of their relationship seem more like play than anything close to a real rivalry.

Then he is generous. He gives Steve the full substance of his legacy, describing his impact as “profound” and lasting. Bill takes nothing for himself in that sentence.

The best part, though, is in the last line. That he will “miss Steve immensely” is personal and unbelievably touching, but that’s not it. Nope, the best part of this tribute is the phrase “insanely great,” the tag line for the original mac, a phrase that let’s us know that Bill Gates was and is a true Steve Jobs fanboy: a fitting tribute from  a “colleague, competitor and friend.”

Author: "Robby Ingebretsen" Tags: "Other, bill gates, insanely great, mac, ..."
Comments Send by mail Print  Save  Delicious 
Date: Thursday, 06 Oct 2011 23:49

image

Of the many sincere and touching tributes to Steve Jobs yesterday, I found Bill Gates’ to be the best and most poignant:

I’m truly saddened to learn of Steve Jobs’ death. Melinda and I extend our sincere condolences to his family and friends, and to everyone Steve has touched through his work. Steve and I first met nearly 30 years ago, and have been colleagues, competitors and friends over the course of more than half our lives. The world rarely sees someone who has had the profound impact Steve has had, the effects of which will be felt for many generations to come. For those of us lucky enough to get to work with him, it’s been an insanely great honor. I will miss Steve immensely.

Bill may understand Steve Jobs in a way that no one else on this planet could. His tribute is perfect. First, he addresses the most important thing: his family, his friends, his colleagues.

Then it’s personal. He and Steve lived through some big stuff together. They pioneered the personal computer and changed the world. He sandwiches the word “competitor” between colleague and friend making that undeniable part of their relationship seem more like play than anything close to a real rivalry.

Then he is generous. He gives Steve the full substance of his legacy, describing his impact as “profound” and lasting. Bill takes nothing for himself in that sentence.

The best part, though, is in the last line. That he will “miss Steve immensely” is personal and unbelievably touching, but that’s not it. Nope, the best part of this tribute is the phrase “insanely great,” the tag line for the original mac, a phrase that let’s us know that Bill Gates was and is a true Steve Jobs fanboy: a fitting tribute from a “colleague, competitor and friend.”

Author: "--"
Send by mail Print  Save  Delicious 
Date: Monday, 19 Sep 2011 19:10

(UPDATE: I added a more careful version of how I feel about the future of Silverlight to the bottom of that section.)

I spent last week at BUILD (all caps?). What a good week for Microsoft! Now that I’ve had a day or two to consider the big announcements and shake off the reality distortion field of Steve Ballmer (err, wait… wrong Steve) , I thought I’d share some thoughts and impressions. Forgive me if these are a little disjointed. It’s been a lot of information to synthesize, but I wanted to share early.

Overall feeling: sincerity

First a note about the mood last week: there was a lot of excitement. For the most part, the conversation shifted from concerns over an opportunity lost (bemoaning the fate of Silverlight) to one of opportunity gained (450 million potential metro app customers). The “XAML is not dead” message became credible and in spite of some concerns around Silverlight proper and it’s place on the web, it’s clear that .NET developers still have a big seat at the new table, even if it’s only kind -of-sort-of .NET.

That said, if the excitement is a little palpable, it’s also a little different. It feels buttoned up and restrained. I’ve heard many attendees comment on the sincerity of what they heard. That might sound like a strange way to characterize a keynote or conference, but this is a crowd that’s recently grown a little skeptical and sincere may have been precisely the sentiment du jour. In that regard, this conference was perfect. The “ra ra” antics of Ballmer PDCs were displaced by a much more controlled, prescriptive and even autocratic message: do this and these will be the results and, by the way, we can sell 400 million copies of Windows 8 with our eyes closed.

The numbers are magic

Because they don’t lie. We all know, of course, that they do…but we also know that Microsoft (and it’s umpteen thousand partners) really can sell 400 million copies of Windows 8 without trying too hard and that realization, more than anything else, might as well be alchemy for the developers I talked to. While everyone spent the last 12 months wondering if they managed to miss opportunities with iOS (and then again with Android), we just woke up to the news that the Microsoft ecosystem is, indeed, gigantic just like we thought (but managed to forget).

Can Microsoft deliver on that promise? I think so. I won’t pretend to know how that really works, but the PC market will grow 4.6% this year (a bad year) and then spike next. In my simplified view of the world that means Best Buy, Walmart, Dell and Costco need something to sell and those will be Windows 8 PCs. So, I think we can take it as a given that Microsoft will move 100+ million copies of Windows 8 in the first year and that’s probably a conservative number.

Metro-style apps and Windows’ split-personality

I think the only question worth asking is whether anyone will care about those new apps we all want to build. The new shell is pretty fantastic. And Microsoft is clearly committed to its adoption. Windows has turned over their single most valuable asset to the new shell: the start button. That’s the kind of commitment we’ll see from Microsoft and there’s no doubt that the store will be a front and center part of that. Every Windows 8 user will spend a little time in the new store… Only question is whether and how well it will stick.

To that end, I hope we don’t have the whole story yet. While the new shell is on track to be a really great slate experience, it’s a little lack-luster as a with a mouse. I’d hope to see at least three big investments from Microsoft:

  • First, desktop Windows needs some cleanup. Aero feels antiquated and glass feels like a parlor trick. We need the rest of Windows to be just as “authentically digital” as the new shell. Until this gets fixed, the experiences will feel bifurcated and that diminishes the value of the desktop which, frankly, is the still the value of Windows. Instead of driving people to use the new shell (a reasonable goal), my hunch is that sort of schizophrenia will drive people to ignore it (or use a mac).
  • Second, mouse interaction in the new shell needs to get much, much better. The mouse feels like a second-class citizen and in spite of what Jensen says, I don’t expect (or want) to swipe my monitor every time I want to launch Photoshop. If you’re inclined to tell me to get over it, stop. I’m still modal and I use a mouse and keyboard at my desk because they are precise and efficient and (relatively) ergonomic. If I become slower or have back problems from Windows 8, it failed.
  • Metro is a little cold. As a design language, the window for customization is still little narrow. That makes me worry that it’s going to get tired quickly. I’d love to see Microsoft push the boundaries a little themselves—and hopefully, in doing so, provide us with some examples of a friendlier and more personable metro. We need to get their for this UI to have staying power.

The most innovative thing I saw last week

I don’t really like the word innovation because it buries the real attribute that we should be after: vision. It’s easy to make something new. It’s hard to make the right new thing, to make the right bets.

Microsoft has been a little short on vision for a while, maybe ever since realizing the “pc on every desktop” battle cry of the 1990s. You might characterize the post-BUILD era of Microsoft as a “pc in every pocket” because surely that’s where this is all going. I think that’s a strong, bold vision and, hopefully, an accurate one. Maybe it’s a borrowed view of the world, but MS is making big bets on that future instead of shoring up against it and we saw a Microsoft this week that appears to be executing toward a single goal in a way that I haven’t seen since my first day there 10 years ago.

Joking at the conference, I said Steve is the new Steve. I’m not quite as serious about that as this guy, but I gained a new respect for his ability to focus an organization on a singular goal. More than that, his risky bets are paying off. It was his call to refocus Windows around HTML5—a decision he made at least two years ago, well before the writing was on the wall. He’s also responsible for big bets on cloud services, ARM and WinRT—all moves that seem obvious in hindsight but carried massive risk at the time of inception.

The other exciting things I saw last week

First, I love contracts: I know, I’m a UI guy and I should be gushing about metro. I have been and will… but contracts have the potential to tie the web together in a way that finally makes sense to non-technical users and that’s a big deal.

On the UI side, I think that docking is game changer for slates. Plus, it has the potential to make metro-style apps relevant to information workers and other folks who continue to spend most of their time in the desktop.

Along those lines, I liked the design attitude from Microsoft. We’ve moved beyond the “hero” UIs that got us excited in 2007 and replaced them with content-driven, prescriptive UIs that make sense for the way consume the world today. On the other hand, metro is easy to make good but hard to make amazing. There seem to be some good helpers for that, though. I’m excited about the “personality” animations library in WinJS.

Finally, Blend for HTML5 in Win8 is really incredible. You need watch Christian’s amazing talk to understand the depth of that tool. Poking around won’t reveal the extent of the possibilities there.

Yeah, Silverlight is pretty much dead. So what?

I think the Windows 8 platform story is really exciting. One nitpick about messaging: maybe I just don’t have the data, but I can’t figure out why C++ is getting so much airtime. XAML and C++ is a clever move, and good for a lot ISVs but I was surprised that it got the sort of love it did at BUILD. On the other hand, I was actually pleasantly surprised at the love that C# + XAML got. With all the FUD about the end of XAML, I was pleasantly surprised by a really great story (even if HTML5 is clearly the wearing the pants in that family).

And, yeah, Silverlight proper (the web browser plugin) will, as they say, likely be phased out over the next few years. I don’t understand why everyone is so upset about this? Your investment in XAML and C# and MVVM and Blend and that whole ecosystem transfers directly to metro and that’s big business—much bigger than Silverlight for the web ever was. If you want to build Silverlight apps for desktop (non-metro-style apps), stick with WPF. But think about it this way, Microsoft isn’t killing Silverlight, the web is. We really just don’t need plugins in browsers to create rich web experiences anymore. In the meantime, XAML and C# remain very important for every other UI situation where Microsoft has influence: metro, desktop and phone. That’s a pretty great story.

UPDATE: Here’s a no-hype version of how I feel about Silverlight. I can’t see how Silverlight makes Windows better and Microsoft is laser focused on Windows right now. Because of that, I would expect investment from Microsoft to taper off over the next several years. In that sense, “dead” was too strong. You’ll be able to download the runtime for a decade. So if you’re building projects in Silverlight, you’re still in great shape and, in most cases, I would stay the course. We (Pixel Lab) have at least two active Silverlight projects right now and no plans to jump ship on either. In both cases, Silverlight was and is a good decision. At the same time, now is a great time to ramp up your HTML5 and Javascript skills. I think there is a disconnect, a feeling that HTML5 isn’t “ready for primetime” and that simply isn’t true. Also, WPF got lost in the Silverlight shuffle. If I needed to build a Desktop app for Windows today, I wouldn’t hesitate at all to use WPF and let’s not forget that desktop is and will continue to be the reason that people buy Windows.

Is Microsoft on track? Are you just a fanboy?

Take these opinions for what they’re worth. I’m the first to admit that I’m an insider (though not really a fanboy—I mostly split my time between two macs) but two final thoughts: first, this is the most excited I’ve been about Microsoft in 5 years. The company vision seems cohesive and inclusive and long-term. It hasn’t felt that way in a long time. Second, yes, I’ll be building apps and I think you should too (unless you’re really talented—in that case, um, ignore this post and focus on Android please).

Author: "--"
Send by mail Print  Save  Delicious 
Date: Monday, 19 Sep 2011 19:10

image

(UPDATE: I added a more careful version of how I feel about the future of Silverlight to the bottom of that section.)

I spent last week at BUILD (all caps?). What a good week for Microsoft! Now that I’ve had a day or two to consider the big announcements and shake off the reality distortion field of Steve Ballmer (err, wait… wrong Steve) , I thought I’d share some thoughts and impressions. Forgive me if these are a little disjointed. It’s been a lot of information to synthesize, but I wanted to share early.

Overall feeling: sincerity

First a note about the mood last week: there was a lot of excitement. For the most part, the conversation shifted from concerns over an opportunity lost (bemoaning the fate of Silverlight) to one of opportunity gained (450 million potential metro app customers). The “XAML is not dead” message became credible and in spite of some concerns around Silverlight proper and it’s place on the web, it’s clear that .NET developers still have a big seat at the new table, even if it’s only kind -of-sort-of .NET.

That said, if the excitement is a little palpable, it’s also a little different. It feels buttoned up and restrained. I’ve heard many attendees comment on the sincerity of what they heard. That might sound like a strange way to characterize a keynote or conference, but this is a crowd that’s recently grown a little skeptical and sincere may have been precisely the sentiment du jour. In that regard, this conference was perfect. The “ra ra” antics of Ballmer PDCs were displaced by a much more controlled, prescriptive and even autocratic message: do this and these will be the results and, by the way, we can sell 400 million copies of Windows 8 with our eyes closed.

The numbers are magic

Because they don’t lie. We all know, of course, that they do…but we also know that Microsoft (and it’s umpteen thousand partners) really can sell 400 million copies of Windows 8 without trying too hard and that realization, more than anything else, might as well be alchemy for the developers I talked to. While everyone spent the last 12 months wondering if they managed to miss opportunities with iOS (and then again with Android), we just woke up to the news that the Microsoft ecosystem is, indeed, gigantic just like we thought (but managed to forget).

Can Microsoft deliver on that promise? I think so. I won’t pretend to know how that really works, but the PC market will grow 4.6% this year (a bad year) and then spike next. In my simplified view of the world that means Best Buy, Walmart, Dell and Costco need something to sell and those will be Windows 8 PCs. So, I think we can take it as a given that Microsoft will move 100+ million copies of Windows 8 in the first year and that’s probably a conservative number.

Metro-style apps and Windows’ split-personality

I think the only question worth asking is whether anyone will care about those new apps we all want to build. The new shell is pretty fantastic. And Microsoft is clearly committed to its adoption. Windows has turned over their single most valuable asset to the new shell: the start button. That’s the kind of commitment we’ll see from Microsoft and there’s no doubt that the store will be a front and center part of that. Every Windows 8 user will spend a little time in the new store… Only question is whether and how well it will stick.

To that end, I hope we don’t have the whole story yet. While the new shell is on track to be a really great slate experience, it’s a little lack-luster as a with a mouse. I’d hope to see at least three big investments from Microsoft:

  • First, desktop Windows needs some cleanup. Aero feels antiquated and glass feels like a parlor trick. We need the rest of Windows to be just as “authentically digital” as the new shell. Until this gets fixed, the experiences will feel bifurcated and that diminishes the value of the desktop which, frankly, is the still the value of Windows. Instead of driving people to use the new shell (a reasonable goal), my hunch is that sort of schizophrenia will drive people to ignore it (or use a mac).
  • Second, mouse interaction in the new shell needs to get much, much better. The mouse feels like a second-class citizen and in spite of what Jensen says, I don’t expect (or want) to swipe my monitor every time I want to launch Photoshop. If you’re inclined to tell me to get over it, stop. I’m still modal and I use a mouse and keyboard at my desk because they are precise and efficient and (relatively) ergonomic. If I become slower or have back problems from Windows 8, it failed.
  • Metro is a little cold. As a design language, the window for customization is still little narrow. That makes me worry that it’s going to get tired quickly. I’d love to see Microsoft push the boundaries a little themselves—and hopefully, in doing so, provide us with some examples of a friendlier and more personable metro. We need to get their for this UI to have staying power.

The most innovative thing I saw last week

I don’t really like the word innovation because it buries the real attribute that we should be after: vision. It’s easy to make something new. It’s hard to make the right new thing, to make the right bets.

Microsoft has been a little short on vision for a while, maybe ever since realizing the “pc on every desktop” battle cry of the 1990s. You might characterize the post-BUILD era of Microsoft as a “pc in every pocket” because surely that’s where this is all going. I think that’s a strong, bold vision and, hopefully, an accurate one. Maybe it’s a borrowed view of the world, but MS is making big bets on that future instead of shoring up against it and we saw a Microsoft this week that appears to be executing toward a single goal in a way that I haven’t seen since my first day there 10 years ago.

Joking at the conference, I said Steve is the new Steve. I’m not quite as serious about that as this guy, but I gained a new respect for his ability to focus an organization on a singular goal. More than that, his risky bets are paying off. It was his call to refocus Windows around HTML5—a decision he made at least two years ago, well before the writing was on the wall. He’s also responsible for big bets on cloud services, ARM and WinRT—all moves that seem obvious in hindsight but carried massive risk at the time of inception.

The other exciting things I saw last week

First, I love contracts:  I know, I’m a UI guy and I should be gushing about metro. I have been and will… but contracts have the potential to tie the web together in a way that finally makes sense to non-technical users and that’s a big deal.

On the UI side, I think that docking is  game changer for slates. Plus, it has the potential to make metro-style apps relevant to information workers and other folks who continue to spend most of their time in the desktop.

Along those lines, I liked the design attitude from Microsoft. We’ve moved beyond the “hero” UIs that got us excited in 2007 and replaced them with content-driven, prescriptive UIs that make sense for the way consume the world today. On the other hand, metro is easy to make good but hard to make amazing. There seem to be some good helpers for that, though. I’m excited about the “personality” animations library in WinJS.

Finally, Blend for HTML5 in Win8 is really incredible. You need watch Christian’s amazing talk to understand the depth of that tool. Poking around won’t reveal the extent of the possibilities there.

Yeah, Silverlight is pretty much dead. So what?

I think the Windows 8 platform story is really exciting. One nitpick about messaging: maybe I just don’t have the data, but I can’t figure out why C++ is getting so much airtime. XAML and C++ is a clever move, and good for a lot ISVs but I was surprised that it got the sort of love it did at BUILD. On the other hand, I was actually pleasantly surprised at the love that C# + XAML got. With all the FUD about the end of XAML, I was pleasantly surprised by a really great story (even if HTML5 is clearly the wearing the pants in that family).

And, yeah, Silverlight proper (the web browser plugin) will, as they say, likely be phased out over the next few years. I don’t understand why everyone is so upset about this? Your investment in XAML and C# and MVVM and Blend and that whole ecosystem transfers directly to metro and that’s big business—much bigger than Silverlight for the web ever was. If you want to build Silverlight apps for desktop (non-metro-style apps), stick with WPF. But think about it this way, Microsoft isn’t killing Silverlight, the web is. We really just don’t need plugins in browsers to create rich web experiences anymore. In the meantime, XAML and C# remain very important for every other UI situation where Microsoft has influence: metro, desktop and phone. That’s a pretty great story.

UPDATE: Here’s a no-hype version of how I feel about Silverlight. I can’t see how Silverlight makes Windows better and Microsoft is laser focused on Windows right now. Because of that, I would expect investment from Microsoft to taper off over the next several years. In that sense, “dead” was too strong. You’ll be able to download the runtime for a decade. So if you’re building projects in Silverlight, you’re still in great shape and, in most cases, I would stay the course. We (Pixel Lab) have at least two active Silverlight projects right now and no plans to jump ship on either. In both cases, Silverlight was and is a good decision. At the same time, now is a great time to ramp up your HTML5 and Javascript skills. I think there is a disconnect, a feeling that HTML5 isn’t “ready for primetime” and that simply isn’t true. Also, WPF got lost in the Silverlight shuffle. If I needed to build a Desktop app for Windows today, I wouldn’t hesitate at all to use WPF and let’s not forget that desktop is and will continue to be the reason that people buy Windows.

Is Microsoft on track? Are you just a fanboy?

Take these opinions for what they’re worth. I’m the first to admit that I’m an insider (though not really a fanboy—I mostly split my time between two macs) but two final thoughts: first, this is the most excited I’ve been about Microsoft in 5 years. The company vision seems cohesive and inclusive and long-term. It hasn’t felt that way in a long time. Second, yes, I’ll be building apps and I think you should too (unless you’re really talented—in that case, um, ignore this post and focus on Android please).

Author: "Robby Ingebretsen" Tags: "Code, Design, Silverlight, build, c#, me..."
Comments Send by mail Print  Save  Delicious 
Date: Tuesday, 12 Apr 2011 07:49

MIX is in the air (I’m referring specifically to the mix of fragrance and air that gets pumped through the lobby at Mandalay Bay). It’s a big one this year. We can all tell that there’s something big brewing inside the mothership and we’re hoping to get a glimpse. That makes things fun, but also a little tense. When I worked at Microsoft I always felt frustrated that we couldn’t keep a secret. Now I feel frustrated that Microsoft seems to be so good at it!

Well, if you need a distraction, that distraction should be typography. It’s the slow-down alternative to the MIX craziness. I’ll be speaking on Tuesday at 2:00. Be there or be square. How square? Here are 5 can’t ignore reasons to be there:

  1. Typography matters more today than ever. Windows Phone relies heavily on good typography. So does the web.
  2. This talk is a primer. No previous typography experience required. Think of it as Part IV of the Design for Developers workshop series I did a few years ago.
  3. We’ll skip the boring stuff. No lessons on the anatomy of letters.
  4. No controversial technology. Sick of the unavoidable HTML5 vs. Silverlight or Windows Phone vs. Android conversations? We’ll talk a little about ClearType, but that’s as controversial as it gets. Take a break. Learn something different. This is a design talk.
  5. There might be prizes. I’m not saying there will and I’m not saying there won’t.

Having said that, there are a few good reasons not to come to my talk.

  1. You’re tool cool to care about typography. Fine. We don’t want you there anyway.
  2. You want to go to Laurent’s sure-to-be-excellent deep dive into MVVM which is at the same time.
  3. Or maybe you want to see Scott’s equally awesome sounding talk about HTML5. It’s also at the same time. In fact, I may go to that one myself (in which case I leave my slides on auto-play so you’re still free to choose).
  4. You already know a whole lot about digital typography and only planned on coming to heckle me.
  5. You don’t like cool stuff. And you smell bad. And you can’t dance.

So there you go. Convinced? Well, have a great MIX and see you at the talk!

Author: "--"
Send by mail Print  Save  Delicious 
Date: Tuesday, 12 Apr 2011 07:49

image

MIX is in the air (I’m referring specifically to the mix of fragrance and air that gets pumped through the lobby at Mandalay Bay). It’s a big one this year. We can all tell that there’s something big brewing inside the mothership and we’re hoping to get a glimpse. That makes things fun, but also a little tense. When I worked at Microsoft I always felt frustrated that we couldn’t keep a secret. Now I feel frustrated that Microsoft seems to be so good at it!

Well, if you need a distraction, that distraction should be typography. It’s the slow-down alternative to the MIX craziness. I’ll be speaking on Tuesday at 2:00. Be there or be square. How square? Here are 5 can’t ignore reasons to be there:

  1. Typography matters more today than ever. Windows Phone relies heavily on good typography. So does the web.
  2. This talk is a primer. No previous typography experience required. Think of it as Part IV of the Design for Developers workshop series I did a few years ago.
  3. We’ll skip the boring stuff. No lessons on the anatomy of letters.
  4. No controversial technology. Sick of the unavoidable HTML5 vs. Silverlight or Windows Phone vs. Android conversations? We’ll talk a little about ClearType, but that’s as controversial as it gets. Take a break. Learn something different. This is a design talk.
  5. There might be prizes. I’m not saying there will and I’m not saying there won’t.

Having said that, there are a few good reasons not to come to my talk.

  1. You’re tool cool to care about typography. Fine. We don’t want you there anyway.
  2. You want to go to Laurent’s sure-to-be-excellent deep dive into MVVM which is at the same time.
  3. Or maybe you want to see Scott’s equally awesome sounding talk about HTML5. It’s also at the same time. In fact, I may go to that one myself (in which case I leave my slides on auto-play so you’re still free to choose).
  4. You already know a whole lot about digital typography and only planned on coming to heckle me.
  5. You don’t like cool stuff. And you smell bad. And you can’t dance.

So there you go. Convinced? Well, have a great MIX and see you at the talk!

Author: "Robby Ingebretsen" Tags: "Speaking, fonts, HTML5, mix, mix11, spea..."
Comments Send by mail Print  Save  Delicious 
Date: Friday, 18 Mar 2011 07:59

image

I’ve just finished a really great week at SXSW and I wanted to jot down some highlights before they get hazy. So, in no particular order:

Ze Frank and the IE9 Launch

First, we got lucky. Ze Frank did a soft launch of his new social giving/sharing platform star.me at the IE9 launch. We built an HTML5 game that lives inside of one of the stars that you give or receive. It’s gateway into the site if you don’t have an invite. The game is called Throwing Stars. Working on it with Ze was amazing. He’s got a crazy spidey sense about how to create fun. He stayed hands off for the most part and gave us a lot of control over creative, but the direction he gave proved to be spot for giving the game a real visceral feeling. It’s addictive.

ThinkJS

We had a “soft launch” of our own at SXSW. We’ve started to build patterns and a toolkit for creating canvas-based HTML5 games like Throwing Stars and Agent 008 Ball. We launched a boilerplate package that combines the tools and methodology that’s been working best for us. Right now it’s called “ThinkJS” and for the time being, it’s a very bash-oriented environment (great for mac, and just okay for windows). Do not fear. A Visual Studio version is coming soon. It includes our javascript port of Box2d (which is hopefully due for an update soon), EaselJS, our sound effects library and a number of environment utilities (including HTML5 Boilerplate, Google Closure, Coffee Script, a test environment and others). Kevin did a really fantastic job packaging this up. It’s a great way to jumpstart a game or any other canvas based HTML5 app.

RunKeeper Launch

One more soft launch: Pixel Lab’s newest entry into the Windows Phone 7 marketplace came in the form of RunKeeper, a port of the super popular (and crazy awesome) exercise tracker that you likely know from the iPhone. We wrote the WP7 version of the app. Technically this launched a couple of weeks ago, but SXSW was the first time I had a chance to show it off in person. Folks from RunKeeper were in the MS lounge to give demos and answer questions. It’s a great app. We’re seeing a couple of crash reports in the Marketplace so a small update is imminent. Other than that, the feedback has been incredibly positive. Much of the thanks for that goes to the RunKeeper team we worked with. They were great and they have a tremendous knowledge of how to serve their user base.

How UI Design is Influenced By Print

One of my favorite sessions at the conference was delivered by Mike Kruzeniski (@mkruzeniski), creative director on the Windows Phone team at Microsoft. He perfectly characterized a phenomena that I’ve been very interested over the last year or so: the way that UI design seems to be taking cues from print design.

This isn’t completely new, of course, but there is something in the air. Spend half an hour on dribbble and you’ll see what I mean. For years, UI design has been a close cousin and BFF to industrial design, paying attention to print and graphic design rarely and only when necessary. We see that in interfaces. UI is made to look like its physical counterpart (buttons that look like buttons, pages that look like pages, etc.).

The exception to this has been the web. Being primarily driven primarily by content and having a strong relationship to publishing, the web feels a lot more like print and graphic design.

The strange thing is that we’re all pretty used to this dichotomy. Even strange is how rarely they cross over. There are indeed “UI” (mostly video players) and “document” outside of the browser (mostly hyperlinks) but until recently these world have stayed pretty isolated.

Mike’s point is that they are and should be converging. It’s a nice love letter to the metro design language. That’s a convenient message, but I think it’s also true. The thing that everyone loves about first Zune and now WP7 is how lightweight the UI feels and how grounded it seems to be in classical design principles (grid, type hierarchy, etc.). This is the influence of print, baby!

Lightweight print-driven UI is a refreshing change from the relatively heavy UI concepts that seem to have driven the last 20 years of UI design. It’s left me thinking a little, though. While the kinds of physical UIs that we’re used to seem a little over the top sometimes, they do (when done well) have a certain warmth to them that seems hard to capture when you’re constrained to image and type. It’s hard to create that same bit of texture that you have when you’re emulating a physical object, even if it’s all illusion.

I’ve felt like the Metro suffers from this a little and can, at times, feel a little bit like it was designed by designers for designers. That’s also, possibly, an artifact of Metro having drawn on the swiss style designs of the 1950s and 1960s. That’s an era that produced incredible designs that are, at times, a little cold in their mathematic precision.

Learning and Becoming Willing To Really Stink at Something

Right before I came to the conference, I read this fantastic post from Nishant. That must have planted something in my brain because I’m seeing this idea everywhere here. Here’s the idea: a lot of us have forgotten what it’s like to learn something from scratch, to be truly bad at doing something and go through the expansive process of filling your brain with something new. Expertise is awesome and we need experts and it’s good for your paycheck. But it’s great for your brain and your happiness to do new stuff too.

Just a few examples of how this idea surfaced: Kevin told me about the madness of learning to type on a Dvorak keyboard (and how much he loved it), I heard an executive at IFC tell the story of how they learned to be a comedy channel; I watched Michael Cera play bass in his new band (takeaway: the band is okay, Michael is a decent bass player but it takes a lot of focus); I talked to a gig poster designer at FlatStock who went from pixel pushing as web designer to full time screen printing.

The Stakes are High (Too High)

This might be the only negative observation I have to bring back from the conference. I’ve felt for a while like there is something in the air in our industry. On the one hand, there’s an incredible buzz and energy as we’ve seen the pace of technology innovation move from mach 3 to mach bazillion. On the other, it feels a little more competitive and just a tad grumpier. Both sides of that coin were intensified at the conference. It was bigger than ever and the content seemed to have an edge to it, like everyone was trying just a little harder to be right or get noticed. I guess it makes sense. The stakes are, indeed, high: we all know that there are millionaires to be made out there and everyone is vying for a piece of that.

A lot of people at the conference were throwing the “b” word around (bubble). It does feel a little that way. There’s a lot of hype and not all of it seems justified. The buzzwords were in full bloom and, from what I could tell, there very few pure design or technical panels or sessions. It was all business and social media. I’m not sure what the next twitter or facebook will be, but the VCs are definitely betting that it will be built on top of either facebook or twitter.

As a respite from the tech craziness, I ended up spending a little time at the film part of the festival. I saw a few screenings and a couple of panels. I hate to say it, but I felt jealous of the mood there. The panels were incredibly collaborative and there was a genuine interest in the craft. Business was a supporting role in those conversations, but rarely the star.

Conan Documentary

That leads me what, oddly, might be the best thing I saw at SXSW this year: Conan O’Brien Can’t Stop. It’s a documentary about the comedy tour that Conan planned after he had left the Tonight Show and before he started his new gig on TBS. I walked out of the theatre in such a good mood. I loved it. To call what Conan went through a trial is, as he would tell you, an unfair exageration. We’d all love to have a problem like that. Never the less, he’d been treated unfairly and he had to deal with the very human feelings of being pushed around. The documentary shows a lot of insight into how he dealt with those feelings and its inspiring. Bigger than that, it was privilege to see the amount of intensity and energy that he puts into his craft. Amazing. Inspiring. I wish there could be a sequel. I ate it up. It’s also laugh until you cry hilarious.

Incidentally, Conan was on site for the premiere and I got close enough to give him a high five…and then wimped out. Ugh. A Conan high five is absolutely the newest entry on my bucket list. Must start planning soon. If you’re interested in collaborating, let me know. There’s got to be an app for that.

Author: "Robby Ingebretsen" Tags: "Other, conan, graphic design, HTML5, ie9..."
Comments Send by mail Print  Save  Delicious 
Next page
» You can also retrieve older items : Read
» © All content and copyrights belong to their respective authors.«
» © FeedShow - Online RSS Feeds Reader