Posts tagged as:

user experience

Get Microsoft Silverlight
Don’t have Silverlight? Get it here or download the video in
MP4, WMA, WMV, WMV (High) or Zune format.

Welcome to another installment of Counting Down to Seven, a series of articles about mobile app development that I’m writing as we count down the days to MIX10, when we reveal more about the up-and-coming Windows Phone 7 Series.

"Counting Down to Seven" badgeWe’re a week away from the start of the MIX10 conference! I like to refer to this as Microsoft’s most “right-brained” gathering, as its target audience and topic isn’t just developers and writing software, but designers, design and user experience.

With designers and design in mind, it’s only fitting that I show you a video featuring Nic Fillingham interviewing a couple of Microsoft User Experience gurus who also hail from Canada:

  • Bill Buxton: He’s a Principal Researcher for Microsoft Research, and before that, he was Chief Scientist at Alias Wavefront and a professor at University of Toronto. And I’m pleased to report that he got his bachelor’s degree – in music – from my alma mater, Crazy Go Nuts University (which some of you may know as Queen’s University). He was the guy who thought of applying Fitts’ Law to human-computer interaction, did some pioneering work with multi-touch interfaces and invented the pie menu (which means that we owe weapon selection in Saints Row 2 and the full combat/spellcasting system in Dragon Age: Origins to him).
  • Albert Shum: He’s the Director of Mobile Experience Design for Windows Phone 7. Albert’s from Winnipeg, studied engineering and architecture at University of Waterloo and went on to do design work at Nike before joining Microsoft. You can watch a video showing him talking about the new Windows Phone 7 experience and the thinking behind it in a previous article of mine, Albert Shum on Windows Phone 7.

This article also appears in Canadian Developer Connection.

{ 0 comments }

Counting Down to Seven: Lou Reed, Mobile App Designer

by Joey deVilla on February 22, 2010

Three Weeks to Go!

Counting Down to Seven (Mar 15th at MIX 10): A series about ideas for mobile appsWe’re three weeks away from the day when a lot more about Windows Phone 7 will be revealed. On Monday, May 15th, the MIX10 conference in Las Vegas is expected to open with a bang as developers and designers will learn about “WP7’s” programming and design models as well as the opportunities that Microsoft’s reworked-from-the-ground-up mobile phone OS will provide. As part of a team of evangelists who were picked to champion WP7, I’m looking forward to getting my feet wet developing for this new platform and sharing what I learn with all of you.

As good as the early indications are – the demos are impressive, and this is likely the first time that anything made by The Empire been described as “soulful” – WP7’s introduction won’t be without some significant challenges. As far as current-generation smartphones go, WP7 is a late entry into a fiercely competitive market featuring a rival who can boast about having an impressive 100,000 applications in its store. There’s the matter of the wait; the 7 Series phones won’t hit the market until later this year, and in the meantime, the Esteemed Competition will be releasing new models. There will also be the cries of “Too little, too late,” from the people who observed Microsoft squander an early lead with smartphones (I can understand the argument for “late”, but having seen some advance inside info on what these babies can do, “little” is not a valid argument).

The Real Challenge

Windows Mobile 6 user interfaceI think that the biggest challenge is going to be creating a new Windows Phone culture. I believe that one of the problems with the developer culture surrounding the old Windows Mobile was that they treated the mobile phone as simply a shrunken-down version of the desktop. As I’ve written before, the desktop is what made Microsoft a successful company, but it’s also turned into an albatross that has impeded forward movement. The company built their mobile OS in a specific way with a specific design philosophy for a specific audience: “suits”. The developers took their cues from those decisions and built applications to match. The end result wasn’t pretty in any way: business-wise, functionally or aesthetically.

We – that’s both Microsoft as well as the development community that we want to gather around Windows Phone 7 — need to create a culture that “gets” the smartphone and cares about software craftsmanship, both in the underlying programming as well as in the user experience. I want to see a development culture that encourages both technical and design chops, the way that the iPhone community does, as well as that the way web app developers like 37signals do. I want Windows Phone to set the standard for mobile applications.

To that end, I decided to write this series – Counting Down to Seven – as a way to get developers to start thinking about mobile applications. I’ve been looking at applications written for the Esteemed Competition’s phones, books and articles on mobile development for other platforms and ideas from the world of user interface and user experience design as well as from science fiction (a long-standing source of ideas for neat-o devices that fit in your pocket). My hope is to convince you not just to write apps for Windows Phone 7, but also to write apps that redefine mobile computing, do interesting and useful stuff and delight our users.

Take a Walk on the Phone Side

Lou Reed, in sunglasses, with a cigarette

There’s a mobile app that was designed by Lou Reed. Yes, that Lou Reed – the guitarist, vocalist and songwriter for the Velvet Underground, then Mr. Walk on the Wild Side and more recently, Mr. Laurie Anderson.

The app is called Lou Zoom, and although he didn’t implement it (that job went to Ben Syverson), he came up with the idea and co-designed it. That’s the sort of excitement that I’d like to see behind Windows Phone 7: so full of possibilities that even people who’d never think of designing applications start doing just that.

The idea behind Lou Zoom is quite simple: it’s a contact manager app, like the Contacts app that comes with the iPhone. The difference is that it has a couple of tweaks, no doubt born out of frustration with the current app. I’ve listed the tweaks below:

Tweak #1: Easy-to-Read Contact List

In the standard Contacts app, the list of contacts is shown as a standard list, with all entries the same size. In Lou Zoom, the list of contacts has variable-sized names: each name in Helvetica Neue, with the font size increased so that it is fills the width of the screen. Here’s a screen shot taken from the Lou Zoom page:

Screenshot of contact list from Lou Zoom app

This design might make the sort of designers who prize uniformity cringe, but think about this: phones have small screens and are often used in less-than-ideal reading conditions. If you’re going to remain under 30 forever, are guaranteed to always have 20/20 vision and vow to always remain stationary and alone in a well-lit room, you don’t need this feature. For the rest of us – including me, a guy in his early forties with standard issue Asian myopia, who finds himself squinting more and more at small type, who often uses his phone from places like dimly-lit cabs going over potholes at breakneck speeds or in crowded, dimly-lit conference spaces and having had a couple of caesars – this user interface tweak is very helpful indeed.

Tweak #2: Easy-to-Read Contact Pages

Just as the contacts are listed in nice big type, so is the info on each contact page:

Screenshot of contact info page from Lou Zoom app

As with the contact list, Lou Zoom goes for legibility and displays the information in large type. It goes one step further by displaying the text in high contrast. If the contact has multiple addresses, phone numbers or email address, a left or right swipe over the appropriate field will give you those alternates.

An Aside: Windows Phone 7’s People Profiles

The “Profile” page in Windows Phone 7’s “People” hub takes an approach that is stylistically similar to the way Lou Zoom displays contact info:

Screenshot of Windows Phone 7 profile page for a person in the "People" hub

…but it takes a markedly different approach to which items are displayed prominently. Windows Phone 7’s design is centered around what you want to do rather than with just throwing information at you. For example, the actions “call mobile”, “text mobile” and “call home” are in large type, while the person’s mobile and home numbers are in smaller text. This is a good idea — after all, what you really want to do is reach someone, not look up their phone number. The “address book” paradigm is a holdover from the days when phones weren’t smart enough to dial themselves.

Tweak #3: Search on Any Part of the Name

The standard Contacts app has a simple search function. Type in j and it will immediately present you with a list of all names in your contacts beginning with “j” (ignoring case, of course). If you expand that j to become john, you’ll get a list of all the names in your contacts beginning with “john”. The Contacts app will apply the search term you provide only to the leftmost end of the names in your contacts:

Screenshot of search for Lou Zoom app

Lou Zoom improves on search by letting you search on any part of the name. Typing in john gives you a list of all the names in your contacts containing “john” in any part of the name, such as “John Smith”, “Alice Johnson” or “Olivia Newton-John”.

The Lou Zoom site provides its own example:

Has Kate Bell recently become Kate Appleseed-Bell? Searching for "Bell" will still bring up her name in Lou Zoom. From there, her full info is just a tap away.

It’s also great for searching for people by nickname. For instance, typing in mclovin into Lou Zoom’s search will give you the name of your buddy, who’s listed in your contacts as Christopher “McLovin’” Fogell.

What Can You Tweak?

It’s time to take a page from Lou Reed’s book and find apps that could benefit from a little tweaking. Look around at mobile apps and if you find yourself and other people saying “if only it did this”. Those are opportunities! The best applications aren’t always brand-new paradigm-shattering ideas; sometimes they’re old ones with a couple of tweaks.

This article also appears in Canadian Developer Connection.

{ 0 comments }

Windows Phone 7 Series: Now That’s More Like It!

by Joey deVilla on February 15, 2010

Windows Phone 7 Series generic phone

A New Windows for the Phone

Ever since joining The Empire, I’ve been saying that Windows Mobile needs to go back to the drawing board. While there was good technology lying in its innards – mobile versions of the .NET framework, SQL Server and Office – treating the mobile form factor as “the desktop, but much, much smaller”, was the wrong approach. In the meantime, the Esteemed Competition were doing the right thing: designing their phones’ OS features and interface from the ground up rather than attempting to force-fit the desktop UI into a pocket UI.

Today at Mobile World Congress in Barcelona, Microsoft previewed the latest in a series of steps forward – consider Xbox to Xbox 360, Windows Vista to Windows 7, Live Search to Bing – there’s now Windows Phone 7 Series.

(The name’s a bit long. Whoever does the naming at Microsoft corporate HQ must get paid by the syllable.)

A Quick Look at Windows Phone’s Experience

A good starting point is this video, which covers Windows Phone’s features in three minutes, thirty seconds:

You can take an interactive tour of the UI at the Windows Phone 7 Series site:

Screenshot of the Windows Phone 7 Series site's home page

A Closer Look at the Windows Phone Experience

Over at Channel 9, Laura Foy has posted her interview with Joe Belfiore, VP Windows Phone 7 Program Management, who gave her a walkthrough of the goodies in Windows Phone (the video is 22 minutes, 18 seconds):

Get Microsoft Silverlight

Some quick notes from the video:

  • There are three mandatory hardware buttons, which are context-sensitive:
    • Back
    • Windows (the “Start” button)
    • Search
  • The screen is a capacitive touch-screen, capable of supporting multi-touch
  • The Start menu is built up of tiles: little block representing the information and features that you care most about
    • You can add your own custom tiles; Joe shows a “me” tile linked to his Facebook profile
  • A browser with:
    • Snappy performance
    • Support for multitouch actions such as pinch zoom, double-tap to zoom and finger drag
    • Very readable text, that to sub-pixel positioning in HTML
    • Phone number recognition in HTML documents; touch them to dial them
    • Street address recognition in HTML documents; touch them to get a map
    • Multiple tabs
  • The “People Hub”
    • Aggregates Exchange, Hotmail, Gmail, Yahoo! Mail and other mail contacts
    • Provides a live feed of your contacts
  • Context-sensitive search:
    • Press the “Search” button while in the People Hub, and you search your people list
    • Press the “Search” button while in the Start menu, and it runs a web search
      • Based on your query, it knows whether to give you a web search result or a local search result
      • In the demo, Joe does a search for pizza and gets a map and results for pizzerias near him, and a quick pan over to adjacent pages yield directions and reviews
      • A tap on “nearby” yield the locations of useful things like parking, ATMs and so on near the selected pizzeria
      • In another demo search, Joe does a search for “Avatar” and it returns a list of nearby theatres and times for the movie Avatar; a quick pan to an adjacent page yields the results for local business and places with “Avatar” in the name
  • Email:
    • Easy pivoting between unread, flagged and urgent emails
    • A caching system prevents you from seeing the dreaded “loading” screen
    • Press “Search” within email and you perform a search of your email messages, by subject, text and so on
  • Rotation: you can operate the phone in “portrait” or “landscape” mode
  • Calendar:
    • Support for both work and personal calendars
  • ActiveSync works in the background and keeps the phone synced with email, contacts and calendar
  • User-customizable UI colour schemes
  • The “Pictures Hub”
    • Gallery: Lets you browse all the pictures on your phone
    • Mosaic: Recent and favourite pictures
    • What’s New: New photos from your social networks
    • Camera roll: A folder for photos taken with your phone
    • Support for photo albums from Facebook and Windows Live, which you browse as if they lived right on your phone
  • Music and Video
    • History: Most recently played music and videos
    • New: New music and videos added since the last sync
    • Zune HD-style marketplace searching and support for Zune subscriptions with unlimited music plays
  • The “Me” tile
    • Lets you update your status on places like Facebook
    • Nice little typing features like auto-spelling-correction and a special soft keyboard for emoticons
  • The UI concept: Windows Phone is task-centric, not app-centric, with a hub associated with each: people, photos, media
  • There’s also a games hub, which ties into Xbox Live
  • Third-party applications and games? Wait…

Wait a Minute…What About Third-Party Apps and Games?

"MIX10: The Next Web Now" logo buttonCan you wait a month?

Here’s the deal: the announcement at Mobile World Congress was about showing what Windows Phone can do. As for what’s possible on the developer front, it’ll all be announced at the MIX10 Conference, which takes place from March 15th through 17th in Las Vegas.

There will be a dozen sessions at MIX10 for Windows Phone, and they promise to be quite interesting. I’ll be at MIX10, and will blog what I learn from these sessions when they take place.

You can save $200 off the price of MIX10 registration if you register before February 21st, so if you want to get in on the ground floor with Windows Phone and save some money, register now!

What the Tech Press is Saying

Pretty good stuff, actually. Rather than bury you with links to a zillion blog entries filed from Mobile World Congress, I thought I’d pick two of the big tech blogs, Gizmodo and Engadget:

Here’s what Gizmodo has to say about the new Windows Phone:

It’s different. The face of Windows Phone 7 is not a rectangular grid of thumbnail-sized glossy-looking icons, arranged in a pattern of 4×4 or so, like basically every other phone. No, instead, an oversized set of bright, superflat squares fill the screen. The pop of the primary colors and exaggerated flatness produces a kind of cutting-edge crispness that feels both incredibly modern and playful. Text is big, and beautiful. The result is a feat no phone has performed before: Making the iPhone’s interface feel staid.

If you want to know what it feels like, the Zune HD provides a taste: Interface elements that run off the screen; beautiful, oversized text and graphics; flipping, panning, scrolling, zooming from screen to screen; broken hearts. Some people might think it’s gratuitous, but I think it feels natural and just…fun. There’s an incredible sense of joie de vivre that’s just not in any other phone. It makes you wish that this was aesthetic direction all of Microsoft was going in.

Here are Engadget’s impressions, after having some hands-on time with Windows Phone:

The design and layout of 7 Series’ UI (internally called Metro) is really quite original, utilizing what one of the designers (Albert Shum, formerly of Nike) calls an "authentically digital" and "chromeless" experience. What does that mean? Well we can tell you what it doesn’t mean — no shaded icons, no faux 3D or drop shadows, no busy backgrounds (no backgrounds at all), and very little visual flair besides clean typography and transition animations. The whole look is strangely reminiscent of a terminal display (maybe Microsoft is recalling its DOS roots here) — almost Tron-like in its primary color simplicity. To us, it’s rather exciting. This OS looks nothing like anything else on the market, and we think that’s to its advantage. Admittedly, we could stand for a little more information available within single views, and we have yet to see how the phone will handle things like notifications, but the design of the interface is definitely in a class of its own.

(In another article, Engadget simply summed it up with “Microsoft is playing to win”.)

Watch this Space!

"Counting Down to Seven" badgeWe’ll have more announcements about Windows Phone over the next few weeks, so keep an eye on this blog!

This article also appears in Canadian Developer Connection.

{ 4 comments }

Jason Alderman’s Pitch for His MIX10 Presentation

by Joey deVilla on January 14, 2010

Two days remain for you to cast your vote for sessions at the MIX10 conference, which I wrote about in the previous article. A number of people who submitted proposals for sessions are wooing voters, and one of the best promotions is that of Jason Alderman, who put together this comic explaining why you should vote for his session, titled Guerilla User Research – Carrying Out Missions Behind Enemy Lines to Get the Insight You Need:

Comic: MIX10 needs a session (or two) on user research and testing!

This lovely hand-drawn comic is a reminder for me to fire up the scanner I bought for Christmas and get back to something for which I was notorious during my days at Crazy Go Nuts University: cartooning.

This article also appears in Canadian Developer Connection.

{ 0 comments }

MIX10 Web/UX Conference: March 15 – 17 in Las Vegas

by Joey deVilla on January 13, 2010

MIX10: The Next Web NowI’m going to be at Microsoft’s MIX10 conference, which takes place from Monday, March 15th through Wednesday, March 17th at the Mandalay Bay Hotel in Las Vegas, where I’ll be catching sessions and posting photos and reports. If you can spare a couple of days off work to attend Mix10, you should too – and soon, because the early bird discount is going to evaporate very soon!

What is MIX?

MIX10: Where designers and developers intersect to make the web a great place

The email sigs for people involved with MIX claim that it’s a “designer/developer lovefest for the web”, and I think it’s a pretty one-line summary of the event. It’s a conference for people who develop and design for the web, with particular attention paid to user interface and experience. This will be the 5th MIX conference, the first one having been held in 2006.

What Sort of Sessions Will There Be at MIX10?

The future of web design and user experience

Here’s a selection of some of the sessions and workshops at MIX10:

There are some other cool things happening at MIX10 that I can’t talk about until the conference. Be there, or if you can’t, watch this space!

You Get to Vote!

Open call for content voting is live. Vote now for your favortie session submissions.

You can help choose some of the content for MIX10! We took a number of submissions for presentations in an open call for content, and now it’s time to vote for them. You can see all the submissions here, and voting ends on Friday, January 15th.

Early-Bird Discount

Register by Jan. 15th and save: $600 on your pass and a free night at Mandalay Bay

If you register for MIX10 by January 15th, you’ll save US$600 off the admission and pay only US$795 – and you’ll also get a free night at the conference hotel, Mandalay Bay! After the 15th, the price goes up to a full US$1395, so if you want to go, register now!

This article also appears in Canadian Developer Connection.

{ 1 comment }

Building Apps People Need (and are willing to pay for)

January 5, 2010
Maslow's hierarchy of needs

If you’ve taken a psychology course or have leafed through a user experience book, you’ve probably come across a diagram of Maslow’s Hierarchy of Needs:

Dan Zambonini of the web development shop Box UK took some inspiration from it and wrote an article titled Web App Business Models: User Needs and What People Pay For. In [...]

Read the full article →

Qixing’s Big Move

January 4, 2010

Good Luck, Qixing!

We may be losing a User Experience Evangelist, but I think we’ll get a great Windows 8 in return. Qixing Zheng, who’s been with Microsoft Canada’s Developer and Platform Evangelism team for the past three years, is leaving to join the Windows UX Team as a Program Manager. While I saw firsthand that [...]

Read the full article →

Some Thoughts on Interface Design

January 13, 2009

This article was originally published in Canadian Developer Connection.
Comments on “The Device/Desktop” Opportunity

The Device/Desktop Opportunity got a number of comments, both in the “Comments” section and sent directly to me via email. First, I’d like to say “please keep those comments coming!” One of my intentions was to start some discussion.
I got a number of [...]

Read the full article →

The Device/Desktop Opportunity

January 9, 2009

This article originally appeared in Canadian Developer Connection.

Why isn’t Brookstone in Canada yet?
For those of you who aren’t familiar with Brookstone, a good way to describe it is “lifestyle gadget store”. A good portion of their catalog is devoted to “lifestyle electronics”: things like

alarm clocks for travel that also play soothing noises to [...]

Read the full article →

Most Google Users Ignore Everything After the First Three Results

June 16, 2008

I would’ve thought that they ignore everything after the first page, but ReputationDefender says that according to a Cornell University Study [PDF], most Google users ignore everything after the first three results.

Read the full article →

All HTML Form Control Elements Require Labels

June 6, 2008

UX Rule #1 – All HTML Form Control Elements Require Labels, and this rule is illustrated by showing the differences between Facebook’s and GMail’s login forms.

Read the full article →