Tag Archive for affordances

Separate Mobile Website Vs. Responsive Website

2012-10-30 LinkedIn Poll on responsive design

Frost, B. (2012). “Separate Mobile Website Vs. Responsive Website.” smashingmagazine.com. Visited on October 25, 2012: http://mobile.smashingmagazine.com/2012/08/22/separate-mobile-responsive-website-presidential-smackdown/ This article is about how to address the challenges of the mobile web by either creating a separate mobile website or creating a website that is responsive to different screen sizes. These two approaches are illustrated by the websites of the 2012 presidential candidates: Mitt Romney’s campaign has created a dedicated mobile website, while Barack Obama’s campaign has created a responsive website. The article looks at two use cases for these sites (someone looking for information and someone looking to take action) and how each of the different mobile approaches addresses them. Conceptual Design The article examines two mobile design approaches using Kristofer Layon’s model, which is based on Maslow’s hierarch of needs pyramid. Primary access and navigation are the most essential aspects of the mobile experience while enhancements like HTML 5 features are the least essential. How each method addresses the two mobile approaches is important for any product designer. Interaction Design Access to website content is the most import function of a mobile site. The Obama site is responsive, so all the content of the full-featured site is available to a mobile…

Design and the Olympic Games

Aerial Shot of the London Olympic Stadium

The Olympic Games are coming to a close and there are some interesting design decisions that seem worth mentioning. But let’s start with a cursory set of design requirements: safety, transportation, visibility and observability of events, entertainment, fairness, cultural sensitivity and appropriateness, and so much more. As with all design problems, divide and concur is a good approach: who are the audiences; what are their needs; what are the time, budget, and personal resources of the project; and what are the considerations (goals) of the sponsoring country. These are the basics of product design. From these variables, we can set priorities and deduce probabilities of errors and failures and how to accommodate them with design. Clearly, this is too much to cover in one blog, but here are a few thoughts… Safety There are many safety concerns in staging big, multinational events. Let’s first consider the different groups of individuals: safety for the participants, organizers, audience, supporting staff. We can break this down even more (by country, by sex, by religion, by location, by celebrity, etc.), but these are the large categories. It’s important to consider the safety for each group separately and provide supports as necessary. There are different…

Designing an Optimum Nudge

Tornado Exhibit at the Exploratorium

I’m sitting by a window looking out at a rainy Paris street, thinking of cultural differences between Paris and San Francisco, taking advantage of bad weather to do some writing. Over two decades ago, I did some ethnographic research a Exploratorium, looking at how different visitors interacted with the museum’s hands-on exhibits. I was looking for ways to improve the visitors’ experience, raise understanding of the phenomena they were observing. What I saw was different ways in which visitors experienced failure: p-prims that got in a way; folksy wisdom that caused confusion; lack of affordances that led to bottlenecks; permission giving that set up strange expectations; etc. The results of this study turned into a Master Thesis for UC Berkeley. Now, I would like to explore some of the ideas that surfaced during my Exploratorium research and apply them to design of nudging — carefully crafted affordances and perceptual cues that manipulated users into acting a certain way while maintaining the illusion of freedom of action. Let me start with a bit of history — a quick summary of some of the results of Exploratorium study. Permission Giving Two decades ago, “hands-on” exhibits were still novel in the museum world.…

Where to post the “OK” Button on the Screen?

OK Button on Early Mac

I have very strong opinions about where on the screen the OK or NEXT or SUBMIT buttons go in relation to CANCEL. Without giving it away, I’m going to walk through the design decision tree and provide a lot of references for both sides of the issue — yes, there are strong feelings about the right versus the left position choice. I’m not alone! Passive versus Active Buttons Active Buttons are the ones that advance the action to the next level. Passive ones return the users to previous state, negate the action sequence. OKAY, OK, NEXT, SUBMIT, ACCEPT, GO are all active buttons. CANCEL, BACK, PREVIOUS are action that reverse forward momentum and push the user to places they’ve been before. HELP and INFO sidetrack the user and distract from forward thrust of activity. In general, product designers want to move the users toward their goals — thus we want the perceptual focus to be on the action buttons. We want to make sure that users fist see the way forward, and then click on the right button that propels them forward to completion of the task. All distractions and side movements should be downplayed with Interface Design with the…

US Rio+2.0 Breakout Session on Environmental & Conservation Education

Below are the notes from the US Rio+2.0 conference hosted at Stanford last week. The notes are from the Education: Environment and Conservation breakout session. US Rio+2.0 Breakout Session Education: Environment and Conservation Attendees: Prof. Anthony D. Barnosky: Professor and Curator, Department of Integrative Biology at University of California Berkeley Wali Modaqiq: Deputy Director General (DDG), National Environmental Protection Agency (NEPA) of Islamic Republic of Afghanistan Dr. Khalid Naseemi: Chief of Staff & Spokes Person for National Environmental Protection Agency (NEPA) of Islamic Republic of Afghanistan Julie Noblitt: The Green Ninja — Climate-action Superhero Prof. Robert Siegel, M.D., Ph.D.: Associate Professor, Microbiology & Immunology Human Biology/African Studies at Stanford School of Humanities and Sciences Dr. Beth Stevens: Senior Vice President, Corporate Citizenship Environment and Conservation at Disney Worldwide Services, Inc. Madam Anyaa Vohiri, M.A., J.D.: Executive Director, Environmental Protection Agency of Liberia Olga Werby, Ed.D.: President, Pipsqueak Productions, LLC. Mostapha Zaher: Director General (DG), National Environmental Protection Agency (NEPA) of Islamic Republic of Afghanistan Our breakout group was partly the result of the conversation started the day before in the Environment session. Some of the members of our breakout group were present in that session as well. The main discussion…

Special Preview: Philosophy of Interaction and User Experience

A person uses a piece of software, a Web site, or any other product — “virtual” or “real” — to achieve a goal. The design of interaction with these products can either help or form obstacles that interfere with the realization of that goal. A product is easier to use when its interaction is designed to meet the needs of its intended audience. Product designers who consider those needs produce far more effective interaction solutions than those who base their designs on aesthetics or business needs alone. But how does one go about “considering” user needs and then come up with a design solution that works? Oscar Wilde famously said: The pure and simple truth is rarely pure and never simple. Pure and Simple design is similarly rarely pure and never simple to develop. I my class, Cognitive tools for Product Designers, we explore what users bring to usability. We all arrive at the scene with different baggage — our experiences, education, perception, memory, and so on are unique to each of us. No two individuals interpret an experience in exactly the same way. While this sounds daunting, we shouldn’t give up on design all together. We all have some…

Fun, Functionality, Flow: the 3 F’s of Product Design

Good product design—design that solves a real need; design that considers the strengths and weaknesses of the user; design that stands the test of time and cultural fads—always incorporates the the 3 F’s: Fun, Functionality, and Flow. It’s easy to talk about the 3 F’s in abstract, but I thought taking a concrete example of a bicycle would be more productive. A bicycle is a designed object that satisfies a real need, does so in way that brings joy to its users, and the act of riding results in flow experience for many. The old “Liberator” poster tries to communicate all 3 F’s to the potential buyers of its products: liberator means freedom to move, real functionality; the woman warrior communicates power and fun—you will feel the way she looks! It’s exhilarating! Notice the high heels and the beautiful vista (with a rough terrain) and a kid pointing at the riders with envy. These posters, old advertising ads for bicycles, try to communicate the same: it’s fun, functional, and exciting to ride a bike. Ride, and look good. Ride, and be the center of attention. Design for Fun So what makes a particular design fun? It seems that one of…