Check it out: http://www.slideshare.net/MarkRiggan/mobile-first-responsive-web-design

Apple iPad (source: Apple)

It may not have the best name, but the Apple iPad has generated some intense buzz lately. Mobile Internet traffic on the iPad has surged so fast that it has already jumped ahead of Blackberry and Android in Internet usage (source: Net Applications). Games, apps, and even books are being bought at a rapid pace. I have had my iPad for awhile now and have had the chance to mess with all of its features. It’s hard not to like the iPad. By no means is it perfect, but if we take a step back and look at it from a global perspective, the iPad could truly impact mass media as we know it.

Everything is going digital these days. Thanks to devices such as Amazon’s Kindle and Barnes & Noble’s Nook, books and publications are the latest to convert to a digital format. I will briefly explain how the iPad handles media from five different industries and more importantly, how it may potentially impact these industries for the future.

Music

Buying music on the iPad is no different from buying it on an iPhone, or even a personal computer for that matter. Thanks to the iPad’s larger screen, Apple is able to closely resemble the shopping experience that you would typically find on a desktop computer. More screen means more room to advertise and promote featured items.

Listening to music on the iPad is enjoyable with its ample quality speakers. Of course, don’t expect the iPad to replace your surround sound system anytime soon.

Verdict: The iPad’s storage limitations are a big downer, but the quality of the sound and the usability of the iTunes music store is a breeze with its larger screen. I wouldn’t expect the music industry to alter itself because of the iPad anytime soon.

Impact: Moderately Low

TV, Film & Video

Netflix streams videos to the iPad

I have to admit, I am a big fan of the DVR. However, there are times when I either forget or cannot record my shows and watch them whenever I feel like it. That is why I have been addicted to going online to watch them. Most networks publish their recent episodes within 24 hours, available in high resolution. The iPad certainly takes advantage of streaming your favorite TV and film videos. Apps such as Netflix and ABC make watching your favorites a breeze.

Browsing and purchasing videos through iTunes is just as easy as buying music on the iPad. But I’m putting my bets on free streaming video to be successful with the iPad.

Verdict: The high resolution screen and ample audio quality make watching videos enjoyable. The lack of Flash certainly restricts the amount of content available to users, but I think that limitation is will soon be non-existent. Expect the TV and Film industries to provide greater access and more intuitive, engaging ways for users to watch their content.

Impact: Extremely High

Web

One of the most popular features of the iPhone is the ability to browse the web with a similar experience to a desktop computer. The problem the iPhone had was that websites would get scaled down beyond the point of legibility. This not only used more bandwidth but also frustrated users. Websites either got optimized for the iPhone or ignored the problem entirely.

Nike optimized their flash-heavy site to HTML5 standards, specifically for the iPad (source: Apple)

The iPad’s larger screen reduces the amount of scaling that websites had to endure. This nearly eliminated the legibility issue that the iPhone had with most websites. Apple has made it clear that they will not allow support for Flash on the iPad. While there are plenty of websites that use flash, they will need to find alternatives if they want their content to display on the iPad.

The real question that comes to my mind is at what point do we [as web designers] allow the device to render websites as it sees fit? There were a great number of websites that were optimized for the iPhone. But should we ignore optimization since the iPad has that larger screen? Or should we take the opportunity and make it just as unique as every other device? Sites that have taken the time to get up to current standards for the iPad have been generously promoted on Apple’s website.

Consumers who are used to browsing the web on the iPhone will find no trouble doing the same on the iPad. For newbies, I think they will.

Verdict: The larger screen is greatly appreciated when browsing the web. Some will argue over the lack of Flash, but I find it outdated, too restricted, and sluggish to be beneficial on mobile devices. Fluid websites really take advantage of the two orientations that the iPad has available. The web industry will certainly have an opportunity – and in my recommendation should act upon – to provide a richer experience on the web with technologies such as HTML5, CSS3, and Javascript.

Impact: Moderately High

Books

Thanks to the Amazon Kindle, e-book readers have been populating the markets as of late. I can carry around all of my books in a single device. What the iPad does that other e-book readers don’t is display books in color. It will only be a matter of time before other devices like the Kindle and Nook release a color version, but for the time being the iPad shows books in their true form.

Some may argue that the iPad will cause eye strain due to the fact that it is backlit, whereas the Kindle and other e-book readers use e-ink technology. Other than the usual amount of eye strain I get from looking at monitors all day, I haven’t experienced any additional discomfort due to reading books on the iPad.

The iBook store is a breeze to find books and even download samples. For the most part, you’ll find discounts on e-books compared to their printed version. The iPad allows the books to be read in two orientations: 1 page at a time (portrait) or 2 page spread (landscape).

Book publishers will have a larger market to target to and they should be able to take some risks due to the lower costs associated with digital books distribution.

Verdict: The iBook store is visually impressive and I believe will be a big hit for those who read popular books. The current library is large, but not large enough. Once other publishers jump onboard (and trust me, they will), I think reading books on the iPad will become second nature. No more paperbacks! This could potentially be huge for higher education.

Impact: Moderately High

Magazines & Newspapers

Wired Magazine will set the standard for e-publications (source: Wired.com)

I will admit, one of the reasons that I decided to even look at the iPad in the store was the demo that Wired Magazine posted online awhile back on their app for the iPad. They took their printed publication (which is amazing in itself) and created an iPad app that not only showed their publications, but showed them in an interactive way that will, in my opinion, revolutionize digital publications.

Newspapers, such as The New York Times and USA Today, have shown that the news can be interesting and interactive! The large screen size of the iPad allows publications to use a more traditional print layout, but at the same time give it interactivity.

Verdict: Depending on how publishers approach the iPad will determine if this media is ready to go digital mainstream. Some of the magazines are charging premiums for their digital editions, which may sway people elsewhere. Early apps show promise of what could be to come in the future. It may be too early to tell, but there is a huge demand for this media to go digital.

Impact: Extremely High

So What Do You Think?

Okay, so I’ve given my thoughts on how the iPad could potentially impact mass media. What are your thoughts on the iPad? Is it setting the standard for digital media? I’d like to hear from you.

Why Won’t You Help Me?

Great example of the Bystander Effect (source: carbonsmart)

A couple of teenagers start a fight in the hallway at school. We’ve all been in this situation, whether we were a part of the fight or we were witness to it. How many people do you think will intervene and break up the fight? Very few. More often than not, others willl group around and witness the fight unfold before their eyes. We’ve all been there at some point in our life.

The Bystander Effect refers to the phenomenon in which the likelihood of someone acting upon an emergency situation will decrease if the number of people around the situation is larger.

(Source: psychology.about.com)

Videos are posted all over the Internet about experiments and even real-life situations caught on camera where people simply ignore distress calls. At first, you probably would laugh at the situation but in reality it is pretty sad how we are hardwired to react a certain way based on our surroundings.

Why do we ignore? Put simply, it’s a matter of trying to fit in with the crowd. If everybody else is just watching and not doing anything, therefore, I should act like them to fit in with the social norm.

A study on the bystander effect, Markey (2000) tested how it played a role in getting help online through a chat service. Markey had three primary goals:

1. Would gender determine the response time in receiving help?
2. Does the amount of people needing help affect the response time?
3. By asking help from a specific individual, would it decrease the response time?

The results validated the bystander effect by proving all three questions. Gender did not have a distinctive effect on response time. The larger the number of people in the chat room increased the response time per person. By asking someone specific for help, the response time was rapidly reduced (as if nobody else were in the chat room).

Only 5 to 10 percent of the population engages in behavior contrary to the social norm. Because we want to fit into these groups and maintain our membership with them, we conform our actions to the norm.

The bystander effect is a great way to show the power of social validation. We tend to do what we think is best to fit in with the crowd, regardless of the situation.

Online Shopping

Shopping online is becoming more popular each and every day. It’s more convenient, cost less, and with websites becoming more focused on usability, it is much easier! The real challenge is the actual shopping itself.

Questions start to come into play, such as:

• What do I buy?
• What color?
• Which model?
• Will my friends like me if I wear this shirt?

Online shopping is a great example of how powerful social validation can be. Websites that allow user feedback or shopping statistics can provide a great experience for both the business as well as potential customers. It is used as a tool to reinforce their purchase.

People look to others to decide what they should do. This is especially true when they are uncertain about whether or what action to take.

(Source: Neuro Web Design (2009), Dr. Susan Weinschenk)

Make It All About The User

So what are some ways to enhance the user experience for online shoppers? Here are just a few that come to my mind and should be relatively easy to implement:

• Product ratings
  These are typically a 5-star scale, ranging from 1- Not Good to 5- Highly Recommend. They are straight to the point and are based on the collective average.
• Product reviews
  Whether they are from professionals or from actual customers, product reviews can provide a more qualitative analysis of a product. Users will listen more to those who appear to be in a similar lifestyle as them. Therefore, product reviews that relate more closely to the user’s use of the product will have a better effect.
• Similar products
  When looking at products on a site, it can be beneficial to see a list of similar products. In a store environment, you would expect similar products to be grouped and placed in the same location. Why not mimic that for the web? By doing so, you allow your users to seamlessly flow between similar products without having to backtrack or go through the search process all over again.

Hey Which Game Would You Buy?

Highly rated game and was highly well sold worldwide (source: RockStar)

Let’s take video games for example. I personally go out and buy the latest and greatest video games on the market. I have my sources online that I go to daily and read up about the upcoming games. This is my strategy for figuring out whether my investments will be worth it in the end. After all, spending $60 per game adds up rather quickly. So when these games get reviewed (most get a review within a few days of its release date), I’ll read it and decide whether the game is going to provide me with an amazing experience. I am putting my trust on my sources. If my sources unanimously say that a game is amazing (i.e. Grand Theft Auto 4), then I will go out and buy that game. About 9 times out of 10 my sources are correct. I like those odds. In today’s economy, every dollar counts and I want to ensure that I am making a great purchase – every time.

My strategy not only works for games, but it works for other big purchases, like a TV, surround sound, car, etc. People rely on others’ opinions in order to make an informed decision.

Your Opinion Matters

Amazon’s products have two very valuable pieces of information on their website: user ratings and similar products. As an online shopper, I find this very helpful when making a decision in buying a product. Most of the time, I’ll focus on why a product is necessarily bad rather than why it is good. It could be the functionality, the photo of the product was misleading, or the materials were below expectations. I like to do my research beforehand when buying stuff online. I’ll check professional reviews, read the product description on the manufacturer’s website, etc. I’ll know beforehand why it appears to be awesome. By reading what users rated and said about the product, I can filter out and find information that I want to know: reasons why I should not buy this product. Of course it is up to me to determine the validity of this information.

How many times have we gone to the iTunes Store with the intention of buying just one or two songs and ended up downloading entire albums? Sounds good to Apple, but not so helpful on the wallet. Happens to me all the time. Not only is iTunes addicting to media lovers, but Apple now uses meta information in which it uses to suggest similar media (music, apps, videos, etc.) that pertain to your collection. This information organizes their media by tags, such as most downloaded, highest rated, similar genres, etc. Having this information at your fingertips is helpful – or hurtful, depending on which way you look at it.

Related Articles

• 6 Things Video Games Can Teach Us About Web Usability
• Don’t Blink! You’ve Got 50ms to Impress Me
• Hierarchy of Consumer Needs for a Product

Time to Speak Out!

Social validation is hard at work in many ways. Ever feel pressured to buy something because everybody else has one? Did you grow up trying to be like one of the popular kids in school?

This topic doesn’t end here today. I open it up to you guys. Got any stories about how social validation has helped or hurt you in a given situation?

Is this the future of the web? (Source: Flickr)

By now we have all heard about the Apple iPhone. Since its release in 2007, it has dominated the smartphone market with over 30 million units sold worldwide. Both RIM (makers of the Blackberry) and Palm have been working hard in their R&D departments trying to create a product that will trump the all-in-one from Apple. They aren’t the only ones, even companies like Samsung and LG have entered the competition. But all of this competition is good, especially since it can only force Apple and others to continue to improve on their products.

Satisfaction Guaranteed?

The Apple iPhone has brought back the hope we gave up on the Mobile Web years ago. Lets face it, it feels great to browse the web on the iPhone. ChangeWave reported that the Apple iPhone 3GS had a 99% satisfaction rate. Even the earlier models — having a 73% satisfaction rate — outperformed competitors in usability testing.

While viewing websites are relatively easy on the iPhone and other similar devices, it can be much better. Sites that do not have mobile-ready alternatives always end up getting scaled down and this makes it difficult for the end user to properly navigate through the site. End result – higher frustration levels from users. If people can’t read the site or navigate it effortlessly, they will leave and move on. This results in lost opportunities for businesses.

The End of the PC Era?

The mobile web is gaining attraction and more people are using their smartphones to access the web each and every day. People aren’t sitting at their desks anymore using desktop or laptop computers. They are on the go. Teenagers today are setting the example as they text message, tweet, blog, or whatever else on their mobile devices. The web is conveniently there for them to access. RBC analyst Mike Abramsky estimated in a report that by 2011, shipments of both PCs and smartphones will be roughly 400 million per year. What is more staggering is that by 2011, smartphone shipments will surpass PC shipments. Designers and developers need to make sure that their sites are as usable and accessible as possible. This starts with optimization.

Performance Matters!

In my research, I found that by optimizing mobile websites for devices such as the Apple iPhone you can tremendously increase performance. The following is an excerpt from the abstract in my thesis:

User performance on the optimized mobile websites was enhanced by as much as 550% compared to performance on the non-optimized sites. Furthermore, user ratings of usability were strongly correlated with their actual performance of specified tasks. Based on these findings, it was concluded that optimization of websites for mobile web use can greatly enhance usability and reduce frustration from users, allowing organizations to better reach the growing mobile audience.

Source: Identifying and Applying De Facto Standards in Mobile Web Design Using the Apple iPhone, Mark Riggan

Companies are beginning to realize the potential that the mobile web has on their audience, due to the popularity of devices such as the iPhone. However, there are still a lot of websites out there that ignore the mobile market and allow the devices to render their sites as is — which in most cases will be scaled down. Speaking from personal experience, I get tired of having to zoom in and out of websites in order to review information. This of course is implying that I have the patience to wait for the site to load entirely.

And So I Conclude…

Designers unite! Let clients know the potential in mobile websites. The Apple iPhone is only going to get better as well as the other competitors such as Blackberry, Palm, and Google. Learning how to design websites for different types of devices will only strengthen us as a whole.

So what are your thoughts on the mobile web? Does the iPhone make you want to surf the mobile web more? Can you imagine a world where desktop computers are fading away? Check the facts…the future of the web lies in the palm of your hand.

1. Users Have No Patience

Regardless of what the product is, users will get frustrated easily if they have to wait a long time for a response to an action. Nobody likes a loading screen in a video game. While loading screens can be minimized in multiple ways, it is hard to eliminate them altogether since they use disc-based media. Developers try to keep the user entertained by playing background music, customizing the loading icon/progress bar, or displaying information such as history or facts during the load time. EA Sports FIFA 09′s loading screen has the user play against the goalie in a practice environment while the game loads.

For Web usability, this means that new pages must display within 1 second for users to feel like they’re navigating freely; any slower and they feel held back by the computer and don’t click as readily.

Jakob Nielsen – Alertbox, October 5, 2009

On the web, loading screens are most associated with Flash. Flash applications almost always have loading screens. If something takes more than 1 second to react, most users will get frustrated and leave. Even the simplest of things such as a hover element should not have a delay. Bandwidth is becoming less of an issue these days and websites should be able to make the user feel as if they are in total control.

2. It’s All About the Experience

Even the elderly could not resist the Nintendo Wii (source: BBC)

Why do people play video games? Simple: They want to have fun and enjoy the action, however that is defined. Modern games increasingly try to engage the user by making the games contain a strong storyline and mirror elements you would find in the cinema, such as recent popular games like Grand Theft Auto 4 and Uncharted 2. Since these games are attempting to be more realistic, it is no surprise that the video game industry is overtaking the movie industry. Instead of watching great movies, you get to feel like you are in one, with full control of the characters. The creative interaction is the key rather than just eye candy. The Nintendo Wii became popular among traditional and non-traditional gamers due to its unique interaction, even though its graphics were inferior to other gaming consoles.

On the web, the experience is what keeps users coming back. E-commerce websites are particularly focused on the experience because they want potential customers to feel like they are shopping safely and securely. Users browse the web for information. It is how the website presents this information and, more importantly, how it gets the user to that information that makes the experience worthwhile. Amazon and eBay have been pioneers in the e-commerce world and their strong returning customer base proves that they know what they are doing.

3. Progressive Enhancement is Good

This generation of video games are now available with HD audio and video. If you own a system capable of high definition like Xbox 360 and Playstation 3, you can take advantage of high quality graphics and sound. Not only can games look more crisp and realistic with vibrant colors, they can also produce uncompressed multiple channel audio that makes you feel like you are in the game – literally! For those who don’t have an HDTV or a modern surround sound system these systems will simply downgrade those features and play the game as normal. The games will always function the same and sound the same – it’ll just be in a lower resolution and with only 2 channels of audio. No harm done to them. Progressive enhancement in action.

Websites are starting to show progressive enhancement as well with the use of CSS. Web designers try to reward users who browse with modern browsers (i.e. Firefox and Safari) with a beneficial experience that users of IE cannot have, without detracting from the functionality. Designers are using RGBa values, which allow them to include an added alpha channel to the element. This is a powerful tool to have in your designer toolbox because it allows you flexibility and control in overlaying graphic elements and to incorporate opacity variances into the design.

CSS Document
.element {
     color: #fff;
     color: rgba(255,255,255,.5) /* for modern browsers */
}

The example above declares a standard CSS rule for the text color. Older browsers who do not support CSS 3 will only recognize the first line and ignore the rest. The more modern browsers, however, will read the second rule and therefore ignore the first rule. The same concept applies to the CSS 3 border radius property and the CSS 3 opacity property (alpha channel on the entire box element). Andy Clarke uses transitioning properties on his website that are only functional in Safari. These properties, which make the DVD and disc animate on hover, can provide some unique design interactions. Taking these concepts and applying them into websites gives users a unique experience and at the same time doesn’t take away the essence of the design entirely for those who use, well… IE.

4. Minimize Learning Curve by Including Tutorials

Instruction booklets are becoming less used these days for video games. Developers are now putting tutorials into the game and having the user learn as they progress. Most typical games will have the first level or so of the game be the learning grounds for the rest of the game. This is becoming a de facto standard in the industry. During this time, users will be prompted with basic controls and developers will design the level to make sure the the controls are used properly before permitting users to continue the game. These learning tools help minimize frustration and also get the user prepared. What better way to learn than to actually try. Reading instructions is not as effective.

Websites need to be careful about introducing new objects or applications to the user. If you suspect a user will have to think about how to use a particular part of your website, you will have a problem. Users will need assistance with it – whether it is simple instructions or a video tutorial.

5. Keep the Interface as Simple as Possible

In-game menu. Better watch your back! (source: Game Trailers)

Interfaces are extremely important in grabbing the user’s attention. Video games are coming up with some creative ways of designing their interface. While being creative, they still function the same and are easy to navigate. Nobody wants to be confused about where they are or how to get out of the location they are in. Navigation should be carefully thought out. Dead Space uses an intuitive in-game menu where your menu pops up in front of you while you are playing the game. There is no interruption from action as you still have control of your character. Madden NFL 10 uses a simple menu system that zooms to different parts of the stadium in the background based on the navigation section you have chosen.

Websites must remain simple to use, or users will get frustrated and leave. The UI needs to make sense and be engaging at all times. Breadcrumbs are important for sites that are large, preventing users from feeling lost.

The ability to simplify means to eliminate the unnecessary so that the necessary may speak.

Hans Hofmann

6. Don’t Rely on Graphics Alone

Great graphics, but unusable controls, make this game hard to recommend

Those who remember Grand Theft Auto 3 can agree that it was not the most beautiful looking game around at the time of it’s launch. That said, they will also agree that it was the best game to play at the time and it was a huge hit. Graphics can’t do it alone. The experience also needs to be great. GTA3 was impressive because it had an engaging storyline, incredible controls, and was a blast to play. A game with pure eye candy and no functionality will not last long in this industry.

On the web, functionality needs to be priority over design. Once a site functions properly, then you can apply the interface to it. Just like a chair, it needs to function before it looks great, otherwise it is useless. Plan out your websites carefully and make sure that you are considering all aspects exhaustively. Just like video games, a website can be popular if it functions and is enjoyable but will be useless if it’s just eye candy.

So, what are your thoughts on video games and web usability? Do you have any other comparisons? We’d like to hear from you!

“The most powerful and enduring brands are built from the heart – if people believe they share values with a company, they will stay loyal to a brand.”

Howard Schultz (Chairman and CEO, Starbucks Coffee Company)

The following are some guidelines that I believe are crucial to any identity that a company wants to market effectively:

Minimalism

WWF
Designed by Sir Peter Scott, in 1961

KISS (keep it simple stupid) the logo

Don’t make the design unnecessarily complex. Logos can be seen from different distances; therefore it needs to be universally noticeable. The design should be able to maintain its detail.

Color

It should all start with monotone

Because there are people out there that may have a disability in their color vision, it is important that logos be designed to give the same effect and meaning with or without color. Therefore, it is important when designing a logo to start with simple shades of black. Colors can then be applied afterwards to enhance the visual.

Maintain global recognition

Color is important to the brand because it unifies everything together. If the client already has a color scheme specified, the identity must follow the scheme accordingly (even if the scheme is not appropriate). On special occasions it is allowed to suggest a more appropriate color scheme.

Shape

Shell
Designed by Raymond Loewy, in 1971

Rely on shape – not effect – to express meaning

Keeping accessibility in mind, it is important to design the identity in which the meaning is expressed by its shape, not by its effect. So make sure that the design itself doesn’t rely on fancy patterns that could become useless in some mediums. We tend to recognize shapes first, especially from afar.

Typography

Don’t underestimate the power of type

In some cases, the brand doesn’t require an icon, therefore relying on type entirely. The type should be visually balanced, especially if a tagline is to be embedded with the identity.

Avoid extraneous details

Speaking of taglines, it is best to let the client know that taglines are meant to be used outside the logo itself. Try to make your clients aware that taglines can change much more rapidly than the brand themselves. Other details to avoid are the technical names in a company, such as LLC, Inc, etc. These are meant to be included in documentation where it is relevant and warranted. This might be a hard rule to follow – because of the client’s demands.

No more than 2 fonts are necessary

Continuing with the visual balance, it is a good idea to minimize the number of fonts used. The font family is the first priority and then the font style. If using two fonts, make sure the font families complement each other.

USA Network
Designed by Peloton Design, in 2005

Flexibility

Always use vector!

It is necessary that all brand identities be designed using vector graphics (composed of paths) as opposed to raster graphics (composed of pixels). Adobe Illustrator is the de facto standard program to use. This is essential because it enables the identity to be scalable without the quality deteriorating.

Make it cross-media compatible

There are many different types of media, each with their own mediums. It is important that the brand identity be able to be reproduced across all of these. The three primary types are web, print, and broadcast. In particular for print media, the identity needs to be able to be reproduced through offset, flexography, screen, gravure, and digital printing.

Trend

Think trend-proof

While it can be greatly influenced, current trends should not be the primary focus of the brand identity’s design. The design should be able to withstand current and future trends.

Uniqueness

Don’t replicate, innovate

Try to be creative and don’t rely on what others are doing in their designs. It is okay to observe for inspiration, but don’t steal from others. Focus on the purpose of the identity and determine the best course of action.

Don’t use stock art

Don’t rely on art that is available to others. Not only does this void the logo’s uniqueness, but it implies poor judgment on the designer. However, taking shortcuts by morphing stock art into something unique is okay in some cases. Again, focus on the purpose and make sure that you are taking the best approach.

Scope

Design for the client, not for the designer

The client is the one that is paying the bill, so it is best that you try to make them happy first. Just because a wild font may look awesome to you, it will not necessarily look awesome to the client. Always refer to the primary purpose of the logo before daydreaming on the design.

More often than not, users are on a mission and are determined to find specific information. You [as a company] get one chance to impress your targeted audience with your design. Based off of previous studies, users can judge your website in as little as 50 milliseconds!

Does Apple give you a good first impression about who they are? Still curious?

Most designers would think that they should focus solely on the home page design, thinking that the users would go there first. On the contrary, users could possibly land on any of the pages in your website through search engines or outside links from blog posts, emails, websites or more.

A research team lead by Dr. Gitte Lindgaard found that people can make rough decisions about a Web page’s visual appeal after being exposed to it for as little as 50 ms. In her study, she had participants judge websites that were flashed on a computer screen for 0.05 seconds. It is worth noting that most users don’t actually browse the web in this same manner; however, it informs us that users can make decisions rather quickly. Most eye tracking studies show that the human eye can quickly skim over a page. It is almost a general rule of thumb in usability that all Internet users browse or scan websites, not read them. This directly elevates the importance of content usability.

0.1 second is the response time limit if you want users to feel like their actions are directly causing something to happen on the screen. For example, if you click on an expandable menu and see the expanded version in less than 0.1 seconds, then it feels as if you made the menu open up. If it takes longer than 0.1 seconds for the revised state to appear, then the response doesn’t feel “instantaneous” — instead, it feels as if the computer is doing something to make the menu open.

Thus, to create the illusion of direct manipulation, a user interface must be faster than 0.1 second.

Jakob Nielsen

Judge Me in a Heartbeat!

BP keeps their home page clean and concise, allowing users to skim effortlessly

First impressions are critical to keeping a user curious about a website. Chances are that if you don’t make a good first impression, you’ll lose them permanently. Websites that use enhanced usability strategies are more likely to keep the user from bouncing. Some of these strategies include:

Don’t Make Me Think

As a rule, people don’t like to puzzle over how to do things. If people who build a site don’t care enough to make things obvious it can erode confidence in the site and its publishers.

Don’t lose search

Some people (search-dominant users), will almost always look for a search box as they enter a site. These may be the same people who look for the nearest clerk as soon as they enter a store. This can be an exception to small sites with very 1-2 levels of structure.

Make it easy to go home

Having a home button in sight at all times offers reassurance that no matter how lost I may get, I can always start over, like pressing a Reset button or using a “Get out of Jail free” card.

While it may be hard to judge anything in as little as 50ms, the key fact is that people can be hooked or discouraged by a website’s design and content rapidly. It is always good practice to test your site designs for usability and see what participants think of the site. It only takes a handful of people to determine distinct patterns on what is right or wrong.

So let’s hear from you. Let us know your experiences when browsing a website for the first time.

Consumer Needs for a Products:

1. Functionality
2. Usability
3. Pleasure

Take a chair for example. How many different types of chairs have you seen? A lot. They range from the very basic to the extravagant. What do you look for in a chair when shopping? Is it the bright, attractable colors? How about the cool cup-holder feature? Maybe the shape and feel are what you like. Chances are that you’ll return the product back or abandon all use of it if it doesn’t meet at least 2 out of the 3 consumer needs levels.

Functionality

Level 1 refers to the core basics of a product. Can it perform basic functions of what it is designed to do? In our example, a chair simply needs to support the person’s weight. Also, it’s good to point out that functionality may include the endurance of a product. Can it perform basic functions over a long period of time? Depends on the quality.

Usability

Level 2 refers to the functionality in relation to the consumer. Do the functions appeal to me? If so, how? I want a chair that not only supports my weight, but rocks too! I would also like a cup holder when drinking a cold beverage and enjoying my comfortable chair. Those are features that would appeal to me. Usability is a tough one because the designer of the product attempts to appeal to their intended audience as best as they can.

Pleasure

Level 3 refers to the emotions that a consumer endures with a product. Does the product look aesthetically-pleasing to me? If I were trying to match furniture (which I know my fiancé would expect me to) I would want the color, shape, texture, etc. to coordinate with what I am trying to match.

Pleasure-based approaches are about really understanding people and respecting and celebrating human diversity. They are about understanding the benefits that people want from a product and understanding what is required in order to deliver these benefits. Above all, pleasure-based approaches are about designing products that can bring a real joy into people’s lives.

Patrick Jordan

Apple® consistently provides products that meet all 3 levels (at least to me personally) to satisfy consumers. I know for a fact that I feel emotionally-satisfied when I use my iPhone everyday because it:

1. Reliably functions properly (and consistently)
2. Pertains to my needs of use
3. Looks amazing and feels comfortable

We can look at any product and tell whether it is valuable to us by going through the 3 levels described here. Consumers can greatly be influenced by the way websites are designed. The same hierarchy applies.

So let me hear from you! In what ways have you been influenced by a product? Does it make you think about what you really look for in a product?

Web Accessibility in General

Accessibility is an incredibly important aspect of web design. A company, organization, or individual who wants to have a website needs to consider having accessible content. In some fields like government and education to name a couple, they are required by law to have accessible websites.

So what does it mean to be accessible? Accessible to what? Accessibility is about making your content independent on a person’s abilities or disabilities. Regardless of a person’s physical or mental condition, they should be able to access your sites content.

Disabilities are categorized into four main areas:

• Visual
• Hearing
• Motor
• Cognitive

Accessibility Tool for Designers

WebAIM offers a tool called WAVE that evaluates a web page for accessibility issues. Not only do I use this tool personally on all of my projects, but I highly recommend it to others who have a concern for making their sites web accessible.

You can evaluate your website with WAVE one of two ways:

1. Download and install the Firefox WAVE toolbar.
2. Go to WAVE’s website

WAVE offers you a lot of tools to use at your disposal. You can check for errors, look at the structure and order of your site, see a text-only version, disable styles, and much more.

What is nice about checking for errors is that it visually shows you where the errors (if any) are coming from. This can make your design and development process much more efficient as you can pinpoint particular areas of concern.

There is not a greater feeling than to see WAVE give you the thumbs up and the green light on your design. Designers and developers should always be thinking about accessibility in their projects.

I encourage you to try this tool and avoid eliminating a valuable audience.