Design Topics Category Archive

Music Services & Band Names – A UI Nightmare? by Curtiss - May 29, 2011

Search for Beloved in iTunes

In this image, I’ve used different color outlines to differentiate between the 3 different artists using the name “Beloved”

Recently, as I’ve been using my Zune Pass more and more, I’ve discovered a bit of a quagmire when it comes to usability, user experience (UX) and user interface (UI) design. What should music services like Zune and iTunes do about bands/artists that use the same name? How do you differentiate between very different artists without making the UI and/or UX even less usable than it was before?

The Problem

For instance, if you open up iTunes or Zune and search for the band “Beloved”, you will find results from 3-4 completely different artists that all use that same name (Zune shows albums by 4 different artists; iTunes shows albums by 3 different artists using the artist name “Beloved (U.S.)” instead of just “Beloved”). As a UI/UX designer, how would you propose that these music services differentiate those artists? (more…)

10 Unexpected Online User Behaviors to Look Out For by Guest Writer - June 14, 2010

When designing a website, there are key user behaviours that should be taken into account. But in order to take them into account, it helps to know them. Below are 10 of the more interesting and less well-known user behaviours that regularly occur in user testing:

People have banner blindness

People don’t notice banners. It’s been found in eye tracking studies their gaze literally avoids settling on any area that looks like an advert instead it seems people actively try to avoid looking at them. This effect is called banner blindness.

Banner blindness affects most people, and has a startling side effect. Useful areas of the site that are overly graphically designed (and end up looking like an advert) are ignored by users as though they were adverts.

(more…)

The PhotoShop Content Aware Fill Demo by Allen - March 26, 2010

This might be the most impressive demo I’ve ever seen for a PhotoShop feature. It’s from a PhotoShop team member showing off a feature that will be available in the upcoming PhotoShop CS5. It’s called “content aware fill” and can basically take ANYTHING out of a photo. It’s like an eraser with a brain.

Just imagine – you breakup with  your girlfriend or boyfriend and instantly remove him or her from every photo ever…or as the demo shows, you can easily remove trees from scenery as if they were never there.
(more…)

Redesigning The Airplane Boarding Pass by Allen - January 13, 2010

Tyler Thompson was frustrated with the way that Delta issued boarding passes. Tyler notes, “It was like someone put on a blindfold, drank a fifth of whiskey, spun around 100 times, got kicked in the face by a mule (the person who designed this definitely has a mule living with them inside their house) and then just started puking numbers and letters onto the boarding pass at random (yes, I realize that a human didn’t lay this out, if a human had, judging by the train-wreck of design, they would have surely used papyrus). There was nothing given size or color importance over anything else, it was a mess.”

Tyler decided to start working on a new layout for the Delta boarding pass. You can check out all of his thoughts on how he went through a variety of iterations before arriving at his final design and layout.

A number of designers provided their attempts at new boarding passes for a variety of other airlines.

After nearly 20 years in the business, it’s amazing how many times things are done the way they are done because that’s how they are done. Only until a person like Tyler (and the others) create better ways do we clearly see how much better things can be done. It would take Delta a spot of time to change the way their boarding passes look to make them so much more rich and practical. Will Delta reply to Tyler? Our bags will probably arrive on the luggage carousel first. Helmut Granda takes a look into what it would actually take to change the Delta boarding pass.

I like Yoni De Beule‘s Delta revision the best followed by Matt Davey‘s Germanwings redesign.

eduCheckup – Grading Higher Ed Web Sites by Curtiss - October 23, 2009

eduCheckup logoI wanted to take this opportunity to highlight a Web site I’ve been enjoying for the last few months. Nick DeNardis recently celebrated the one year anniversary of his video blog series “eduCheckup.” A few times a week, Nick visits a site that’s either been suggested by his users or that he’s found on eduStyle, and then reviews that site with a unique outside perspective. He evaluates the visual appeal, the quality and accessibility of information and the quality of the source code. He then averages the scores he’s given in each category and provides a letter grade (like you’d get in school) for the overall presentation. (more…)

Designing Online Social Networks: Social Group Theory by Guest Writer - August 13, 2009

Online communities (facilitated by Web 2.0) have become very important over the past few years – not only to niche communities, but now to mainstream brands. Social networking is about human connection and links between people. The reasons why people join groups and social networks are typically that groups can:

  • Provide encouragement and support
  • Establish identity with others and fulfil the need to feel included
  • Provide the outlet for some people to establish their need for recognition, social status, control and/or leadership
  • Alternatively, provide the necessary control over aspects of lives for those who don’t want to be leaders (e.g. Weight Watchers)
  • Help establish friends, relationships and the opportunity to interact with others

Historically group membership has served an evolutionary survival function – put simply, there’s safety in numbers

There’s been much research into group psychology but not so much about how this applies to a marketer trying to monetise an online community or introduce one to their brand. Here are some interesting phenomena about groups designed to help a brand owner capitalise on networks and the social phenomena:

(more…)

Adobe Announces New Flash Platform Tools by Allen - June 1, 2009

Adobe has announced the beta availability of Flash Builder 4, Flash Catalyst and the open source Flex 4 framework. Flash Builder was previously known as Flex Builder – interesting name change.

Adobe notes regarding the Flash Builder 4 beta launch, “…is based on the open source Flex framework and comes with a powerful set of new features to simplify RIA development. Formerly known as Adobe Flex Builder, the new IDE improves basic development functionality, adds significant new data-centric development features and streamlines the design-develop workflow. ”

The Flex framework should bring together for both developers and designers who build Flash applications.

Flash Catalyst allows designers to take art from Photoshop and Illustrator and transform the art into user interfaces that developers can use to build the actual final working interface.

Online Audiences and the Paradox of Web Traffic by Allen - March 27, 2009

If you are as much of an analytics nut as I am, then the video below is for you. It features Dr Matthew Hindman, Assistant Professor of Political Science at Arizona State University discussing online analytics. Dr. Hindman uses a variety of data from Hitwise to go very deep into the true analytics and much further than a basic web report.

From the overview, "Using three years of daily Web traffic data, and new models adapted from financial mathematics, this talk examines large-scale variation in Web traffic. These data show that Web traffic is highly heteroskedastic, with smaller sites having orders of magnitude more variation in the relative number of visitors they receive. These consistent patterns allow us to provide reasonable estimates of how likely it is Google will still be the most visited US site a year from now".

(more…)

img/stack Helps You Manipulate Images on the Fly by Allen - February 2, 2009

Tobin Schwaiger-Hastanan has announced that a new version of <img/>stack is now live. The service is described as, “<img/>stack works by taking a URL to an image and instructions on what to do with that image to create a new image on the fly.”

Tobin noted in an email exchange, “I wanted to simply request the image based on how I needed it for the page and just expect it to be there.  Cropped, resized, centered… I didn’t want to have to go back and forth between photoshop and batch processing scripts.”

There’s a tutorial on how the service works which is pretty easy to understand. Basically you can resize an image, crop an image, create thumbnails and fit an image to a specific size. The application lives on their server, you just call the parameters and the image to change and it will render the image as requested on the screen.

Looks like it could be a good fit for web applications that handle a lot of images for products or even avatars.

CenterNetworks Updates (and upgrades) Design by Curtiss - August 11, 2008

Our sister site, CenterNetworks, unveiled a new Web site design late last week. I must admit that, though I never really had any problems with the previous design, I think the new one is a real upgrade. The new design features cooler colors, working within the blue and green spectrum, and a slightly more intuitive layout. The ads seem a little less obtrusive and more of the items people are apt to use on a regular basis are easier to find. Let me know what you think of the new design, especially if you had experience with previous incarnations of the CN design.