Responsive Handling, Not Just for Cars Anymore.

December 12, 2011

As a driver of a Jeep Wrangler, I have driven on and off pavement, over dirt hills and ditches, through deep mud, water and snow. I have even driven over a bridge made of two logs to cross a creek with the guiding direction of Trail Guides. I have learned to adjust my driving skills to the road that lies ahead. The same flexibility is required in web design, where the trend of mobile Internet access through smart phones and a variety of other devices is changing the way web sites are driven. The average web surfer looking for the latest news, media or Facebook updates gives little thought to the development of the web site he/she’s visiting. However, as a Senior Interface Designer, I needed to take care just as I do when heading on to a new trail head.

Trends in Mobile Design

When it comes to design, there are two sides to the mobile Internet coin: device-driven design on one side and responsive web design on the other.

Device-driven design means developing a site for each device to create the best user experience for that specific device. As recently as just a few years ago this was as a plausible approach. There was the desktop/laptop computer and a few smart phones. But those days are gone, as it seems that every month a new device enters the market. Designers must adapt to desktop web standards, phone, Android, BlackBerry, iPad, Netbook, Google TV, Kindle Fire and so many more devices. Many of these offer the feature of being able to view the site either vertically or horizontally, multiplying the number of options designers must consider.

“We need to let go. Rather than creating disconnected designs, each tailored to a particular device or browser; we should instead treat them as facets of the same experience.”
— Ethan Marcotte

The second, new side of the mobile Internet coin is Responsive Web Design. Wait, responsive design? Isn’t that something Road & Track Magazine reports on every year as the latest sports car models and tire innovations are released? Well, to be honest that is where my mind went the first time I heard about “responsive design.” But it seems that the car market has new competition when it comes to being truly “responsive.”

Responsive Design Defined

Responsive Design is a web site design/development approach that adjusts the content to meet the requirements and/or limitations of the device that the web site is be displayed on. So I know you are asking yourself, what does this mean? Well, it means that the design is no longer a rigid, skyscraper-like design, set to display within the specific requirements of a single device. The design must be developed more as a viscous fluid that responds to the device on which it’s displayed. It needs to be able to move and scale portions of the page, or hide them completely, to optimize the message/content being presented. This is where the design challenge arises.

Designing with the iron fist structure of early HTML tables, with fixed columns and rows has been gone for years, but this ultra-fluid design concept takes planning process to the next abstract level. The design must be able to move, to create a flexible layout that combines elements. Media such as videos and photos need to be scalable to meet the screen resolution of the device. This responsive method of design requires a new level of programming of the page, the magic created by the web site development team, never to be seen by the end user. 

Responsive Design’s Look & Feel

If the design is done well, the user will be able to navigate this site without a second thought, never needing to consider how it was designed or for what device. As we develop new sites for the 50+ market we need to keep the ease of use in mind at all times. But ease of use for the mature market is much more than big type and big buttons…it is creating emotional storytelling that weaves together with clear and purposeful information.​

Let’s look at a sample responsive design concept. A picture is worth a thousand words.

With a desktop/laptop screen size of 1024 pixels wide by 768 pixels tall. There is plenty of room for a standard 3-column web site design. The main navigation can span the page (A) with in-section subnavigation listed as the first column. The width allows for a large relevant animated photo gallery (B) that has multiple photos that rotate with scripting and a nice wide main content column (C). It also allows for related content to be featured as call-to-actions (CTAs).

On a mobile device the same web site (320 wide by 480 tall or a new higher device resolution of 640 pixels wide by 960 pixels tall), can contain the same information, but requires a little reorganization of the content. All of the navigation is now featured in the header as a pull-down menu (A). A strong feature image is used here (B), but may not support the animation script that was used on the desktop version due to reduced viewing size or lack of device support. Finally, the copy is presented much as it is on the desktop version (C), but the related CTAs are now in the single column that displays. Scripting allows for device detection up front as the user loads the page. But on this version of the mobile site we also offer the user the option to load the desktop version of the web site if they prefer as smart phones become higher resolution and faster. And are able to include features like a linked phone number that dials for the user to make contacting the company directly easier.

Effects of Responsive Design on Web site Development

So what are some of the tricks of the trade, when designing for endless screen sizes, especially for the 50+ market? Well it comes down to thinking like the end user. What is the average user looking for when they visit the site I am designing?

  1. Main navigation: on a traditional site the main navigation might run across the page; however, if it is viewed on a smaller screen, it might be easier to navigate with a pull-down menu or list of links at the bottom of the page, as a conclusion to the page.  
  2. Column width: When designing for a single format, like a 1024 wide x 768 tall screen, the columns just need to add up to about 990 pixels wide, so column widths used to be set to an exact number and the horizontal scroll bar does not appear on most screens. Now with the responsive designs, the exact pixel number is traded for percentage of the page. For example, a right sidebar to hold CTAs or related links might be set to 35% of the page width.
  3. Content: Tell a story that grabs users and makes them interact with your site. As you reduce the screen, you need to decide what content really needs to be displayed. Here at Immersion Active, we have a saying: simplify, then simplify again. It is important to consider the most important information and present that alone. Too much content can cause users to be overwhelmed and looking else where for direct information.
  4. Images: Once set to an exact pixel size and optimized for a single device, uploaded and placed, images are now displayed on demand. Code scripts scale the image and present it at optimal size for the device on which it will be displayed. This is known as context-aware image sizing.
  5. Media: Be it video, animation or audio is king. Advances in access speeds, HTML5 coding, and free services like YouTube have made the desire for media increase across the board. As we develop for the different types of browsers, we can use scripting to deliver media to match the specs of the device. So you can seamlessly serve up a video on a smart phone or animated graphics in the most recent browser on your laptop. 

What Does it All Mean?

The continuing evolution of design technology tells us that while the method of delivering the content is always changing, the user experience is still the most important aspect of design. I need to steer the content to connect with the person who is coming to the site I design. It does not matter if it is on a laptop in their home office or on a smart phone in a train. What matters most is the value of the content being presented and how easy it is understand. 

Ethan Marcotte, says it well,
“…at its most basic level, responsive design is about serving one HTML document to countless browsers and devices, using flexible layouts and media queries to ensure that design is as portable and accessible as possible.”

Like driving off the main roads in my Jeep Wrangler, design today needs to be fluid; it needs to allow the user to look beyond structure. Forget the axles and tires of the vehicle and focus on the experience, whether it’s delivering the client’s message with optimal impact or conquering that large pile of rocks challenging me to drive over it. I have learned to adjust my driving skills to the road that lies ahead and I continue to adjust my design skills to the evolving world of online content.


Be Afraid. Be Very Afraid.

October 31, 2011

(Also known as: Social Media Comes to Project Management)

When I was a kid, the best part of Halloween was sitting on the living room floor with my older brother and 2 younger sisters, our treasure pile of candy from the evening’s haul spread out in front of each of us, bargaining and trading for our individual favorite candy. Now of course we each had a stash not included in the big trade…oh, wait, maybe I was the only one who did that…well, let’s come back to this in a bit.

Since that time, I’ve grown up, don’t really do the Halloween costume thing, still have (and eat) my favorite candy (sharing most of the time). I’ve become a project manager in an internet marketing agency, and…oh yeah…I am a baby boomer. Barely a baby boomer, but a boomer just the same.
It’s the Halloween season and these memories of Trick or Treat have me thinking about how social media tools are the new treats of project management, and in fact, there’s really nothing to be afraid of.

Trick or Treat

(Also known as Positive Motivation)

The basic premise of Halloween is pretty easy. Trick or Treat. If you don’t have treats for me I’ll play a trick on you. Avoid the toilet papering, the eggs, the doorbell ringing and just let me grab some candy for my pumpkin bag. Call it positive manipulation. Social media and project management is really just as easy. It’s the art, science and technology of getting things done through teamwork. It used to be that project management was all about “on time, in scope and in budget”. That’s old candy and not really going to be worth much in the trade deals. The new metrics for successful project management center on the team and using engagement, cooperation and relationships via social media. We can call the candy treats that come from utilizing social media methodologies within the context of project management Empowerment, Confidence, Ownership and Commitment.

Here’s another good treat: social networking provides context to information. There’s not just your usual status metric of percent complete, but comments and responses that provide value and qualitative information on project status. A major element in project management is the ability to manage project variables and variations from the project plan. Social media provides the quick, accurate communication to address urgent situations and find quick, effective resolutions. Just like eating too much candy at Halloween can make you not feel well, jamming tasks and schedules down team members’ throats can turn their stomachs. Let them help set the pace, find process efficiencies and roll the changes across projects in real time. Most team members use social tools naturally. It’s just good sense to let them work with tools they’re already comfortable with.

Fear of the Dark

(Also known as What’s Wrong with Command and Control and What’s Right with Collaboration)

We always got to go trick or treating at night. There was a unique dynamic to wandering the neighborhood streets in the dark. Suddenly what we were so comfortable with during the day was filled with dark shadows, weird noises, strange lighting, and scary decorations (like big cemetery tombstones draped in spider webs in the front yard). Current methods of capturing project info are complex and time consuming, alienating team members and forcing pm’s to beg, persuade and nag for status updates resulting in incomplete or inaccurate project information. To add to this scary element, major project decisions are often made on this information. Social networking provides more relevant information with clearer visibility into project and stakeholder initiatives. Team members become full participants rather than passive recipients of tasks and schedules. Staying entrenched in tradition is painful, especially since communication is the largest tool and responsibility of a project manager. Facilitating real-time conversations around projects helps keep an accurate pulse on the business and allows executives to make more proactive decisions. That’s right— proactive decisions. Stop the old stress-laden fire-fighting approach to managing projects. There’s a big leap into the unknown, and a pretty scary thought for some who find command and control their comfort blanket.

Here’s another scary concept – “Social is all about the collective and what they can share and achieve together.” Having the team work together with the project manager as a hub of communication rather than requiring every tidbit of information go through the project manager creates an environment of client focus and project success. Here’s another treat—the real value of project management is not creating project plans and schedules—it’s facilitating collaboration and value-driven solution implementation. For additional insights on teams, Steve Denning, in a recent article for Forbes wrote, “The mode of coordinating work must shift from bureaucratic control to dynamic linking.”

Saving the Best for Last

(Also known as The Bottom Line)

Everything has its price. When it came to that living room floor candy trade, I had a definite negotiating strategy not just to increase my “haul” for the evening, but to make sure as much of it as possible was my favorite kind. This meant assigning value to the candy I had as well as recognizing the value of the treats I wanted.

What would you trade for fewer meetings and increased efficiencies? What would you trade for rapid coordination of operational efforts and quick plan adjustments? Let the project manager do more than monitor their emails for tasks, status updates, change requests and waiting for team responses. Drive issue resolution with collaborative posts. Multiply the opportunity to increase project profitability and enhance client satisfaction. The trade is easy—go for the better information and better decision making, trust your project information, and work in an environment team members enjoy. There’s a tangible and intangible contribution to the bottom line.

For those of you looking for metrics regarding what’s happening in the professional world of project management and social media, the Project Management Institute (PMI) conducted a study on the subject of social media regarding how project managers are using social media on their projects—181 people responded, showing that LinkedIn remains the most popular social media tool for professionals, 85 percent of the respondents used social media to stay in touch with friends; 48% used social media for document sharing; 36% used it to stay in touch with team members; 27% used social media for status updates; 25% for managing teams; and 24% to communicate to project stakeholders. Stats per PM Network magazine (PMI Institute, Aug 2011, Volume 25, Number 8). These stats are a statement that project managers are definitely using social media for personal connections and are realizing the value within project management methodologies. There are three factors that will continue to increase these stats: technology will continue to focus on social media; tools will continue to be developed and refined; and lessons learned during project management will standardize their application.

Until Next Year

(Also known as Halloween will be Back Again Next Year and You’ll Have to have a New Costume)

OK. So at this point I’ve basically shared all I can about project management and social media; the tricks, the treats, and the trades. Now…about that little stash I mentioned that I held back and didn’t include in the sibling Trick or Treat trade…it wasn’t much…really…just a few special items that I would selfishly keep for myself.

Trick or Treat.


What Steve Jobs taught me about “old” people and product development

September 12, 2011

With the formal resignation of Steve Jobs, quite a few stories are coming out of the woodwork about Apple’s iconic CEO. One of my favorite stories takes place early in Steve’s rise to stardom when he attended the birthday of a 9-year old celebrity. Steve’s gift to the young man was, what else, a Macintosh computer. As the story goes, Steve pulled the boy aside during the party to personally watch him open the gift. As he was showing the boy how to use his new computer, two “older” gentlemen came up behind them and starting oohing and ahhing. The two gentlemen, clearly impressed with what they saw as a work of art, started asking Steve questions for which he quickly dismissed them and returned his attention to the young boy. As it turns out, the two “older” gentlemen were Andy Warhol and Keith Haring. At the end of the night, Steve continued working with the young man long after the other guests had left. Later, when asked by a reporter why he was so much happier with the boy then the two famous artists, Steve’s response was, “Older people sit down and ask, ‘What is it?’ but the boy asks, ‘What can I do with it?”

Steve’s reply could easily lead you to believe that the billionaire boomer is ageist – and you may be right. But as we’re about to learn in Steve’s first authorized biography, Mr. Jobs is a complex man.

My personal Steve story takes place about two years ago as he was dealing with the ugly realities of pancreatic cancer. Immersion Active was working on a special project with a client where we were exploring the idea of putting free iPads in the hands of seniors. As an early adopter of the iPad and someone who has watched a lot of older adults interact with technology, my gut told me this was going to be big with our consumers. What Apple had developed was something that we believed would close the gap on what is described as the “digital divide.” More specifically, we saw an opportunity to take aging-in-place and tele-health from an elusive dream to profitable and life-changing reality.

Knowing that Steve had a reputation for replying to personal email and thinking that this idea might resonate with him given his state of health, I decided to reach out to him. Within 24 hours I received the following reply:

Steve has asked _____ to speak with you about your email. Please contact her at _________ to arrange a date and time of your convenience.

That next week, Apple flew three executives to Maryland to discuss the idea.

That week, I learned four things from Steve:

  1. Big and responsive aren’t mutually exclusive: I don’t care if it was Steve or the Prince of Nigeria that read my email, the bottom line is that someone did, a plan was in place to respond quickly and intelligently, and meaningful action followed.
  2. Apple is unintentionally ageist: This is going to be tough for some of you to hear but some of the most ageist people I know are boomers. At Immersion Active, we’re very careful about generational stereotypes but this one unfortunately sticks. Steve may have been accurate in his assessment of how older adults looked at technology at the time, but Apple’s marketing obsession with youth (until the most recent iPad commercials that is) has been borderline bigoted.
  3. Apple is intelligently ageless: I honestly believe that Apple doesn’t develop products for old people or young people (as Steve’s people so adamantly reminded me), but they do develop products that aim to delight that which they’ve taken the time to understand about us as humans beings.
  4. Compelling simplicity is the tough investment that follows complexity: There’s nothing simple about the iPad. From the product development lifecycle, to the technology inside, to distribution and maintenance of the “App ecosystem,”  the iPad (and it’s iOS siblings) are complex with a capital “C.” The fact that our experience with Apple products, from pre-sale to support, is so eloquent is because they invested the extra effort to make it so. This “extra effort” is so often written off by smart executives as unnecessary and “not worth it.” Really? Apple is now not only one of the largest companies in the world but, more importantly, most profitable.

So let me wrap up by posing a few questions:

  • Do your product development and marketing efforts aim to delight or merely satisfy?
  • Where do you invest your time understanding our consumers — before, during or after you’ve developed your product? With them as human beings or as a “bucket” of attributes?
  • Do you seek the advise and expertise of others who are truly vested in our consumers as human beings?
  • Do you listen? Do you have an intentional and thoughtful feedback loop that customers (and your other stakeholders) understand and can easily access with some expectation of meaningful follow through?

For twenty years I’ve resisted being labeled an Apple “fan boy” but, call me what you want. If your thought after reading this is that Apple and Steve are some strange anomaly than I’d ask just one final question: Do you really believe in what you’re doing?


What Google+ Means for 50+

August 4, 2011

By Michael Epps Utley

Google+ has been invitation-only so far, but growth has been astounding. It has reached 20 million users in 24 days compared to 1,035 days for Twitter and 1,152 for Facebook. It offers new features such as Circles and Hangouts, which seem to be more intuitive for many managing different areas of life.

 [Source: https://plus.google.com/112418301618963883780/posts]

For those serving the 50+ markets, this new entry raises questions. Is Google+ going to replace Facebook, which boomers and seniors have been adopting in great numbers over the past couple of years? And how can I do social media well if it is always going to be a moving target?

First off, we have some time. Google+ has not made business pages available and has asked businesses to hold off on trying to get into the network as companies. Also, mature markets generally adopt a bit more slowly than other groups (but once they begin to adopt, lookout!).

In the meantime, we have some time to think about how to best use Google+. However, Google+ has already shown us something new — social networks offering different features are not necessarily going to cancel one another out.

This proliferation of social networks is going to require a new strategy and way of understanding them.

Social Media is a House Party

The new reality for marketers using social media is visualizing social networks, not as one destination or another, but as numerous rooms at a great house party.

Facebook

The party is in full swing in the dining room. The chairs have been removed and people wall-to-wall are eating, talking, laughing, and telling stories. It is the biggest room, and new friends are arriving every minute. Everyone is having a blast and they are even introducing friends to one another. New connections are being made, active lives are being shared, and people are interacting around major and minor events related to the past, present, and future.

LinkedIn

In the formal sitting room, the conversation is much more subdued, business cards are being shared, and small clutches of individuals are attempting more substantial conversations about specific topics. Mainly, it is a room where people are for a time, but it is not going to have the spontaneous energy occurring in the dining room. It’s not uncommon for people to enter the room and back out quickly. There are also a few who have been in there all night and seem as fresh as ever.

YouTube

The kids (and some of the more energetic adults) are in the media room flipping the channels on ten screens and having an epic time. The conversation is so loud and disjointed that a few parents come in to calm things down, but they just get caught up in the energy. Pandora and iTunes Ping are in the corner trying to get everyone to look to the turntables they are setting up, but video dominates. Kids are constantly running to the other rooms and sharing videos, and some of the adults engage and follow the kids back to the media room. But the conversation here is more unfiltered chatter than sharing.

Twitter

The doors, hallways, and foyer are packed with people coming in and out of rooms, blathering about everything. They are not so much in a room as highly platform independent. Much of their conversation is consumed in other rooms as they enter and exit.

Google+

The kitchen in this house is brand new and people are still working their way in. It used to be something else, but it’s big, has some major new fixtures, and has the potential to serve creativity and collaboration in a way that none of the other rooms at this party ever made possible. The people in the room are very excited, are trying out the new blender, and are already making some new things for everyone to try out in the other rooms.

Work the Party, not the Room

Going forward, with your target audience of mature consumers mingling in these different places, you’ll need to overcome some limiting factors.  Here are some tips for success:

1. Use Tools to Scale — If you are spending your time logging into accounts or you are not being consistent in your posts, you can fix that problem with the right tools.

2. Be Smarter with Content — Each piece of content you produce in these areas can be “versioned” for multiple uses. Plan for each item you create to produce three or more touches in different networks making sure each is appropriate for its “room.”

3. Value Engagement and Sharing — Do you remember why you got into social media in the first place? Connecting and sharing. If you need a place to start, begin to measure and report 1) your content, 2) instances of contact, and 3) a ratio of the two. Then see what types of content lift contact.

4. Make Direct Connections — Use social media as a feeder for capturing email addresses. Email is the guestbook at the party ensuring your customers receive an invitation to the next event.

5. Work the Party — Second, perhaps, only to mobile, social media is where change and new activities are originating. So, marketing via social media going forward will continue to require more sophistication rather than less.

To use social media well going forward, you need to plan for the entire range of places and platforms, not just one of the networks that aligns with your goals. You need to ask, “How can I add value to my audience in this room?” and apply that across each of the social networks. Plus, each network offers different kinds of feedback, so working the party means taking in all the feedback and applying learnings to your work in each community. Once you are gaining unique insights from each “room” and applying them to the entire “party,” you will have an effective presence in the social web that makes the party as rewarding for you as it is for your audience.

Please share your thoughts with us. If you have found something helpful, please let us know with a quick comment.


Bigger Than Me: Social Cause Marketing and Boomers

June 20, 2011

By Joe Ford

Summer isn’t complete without our family’s annual pilgrimage to Hershey Park.  This year while watching the kids enjoying the timeless Scrambler, it’s perhaps time for a lighter reflection on brands that are “doing well by doing good.”

How a visit to an amusement park triggers these kind of ponderous thoughts I’ll never know, but let’s just blame it on the Dippin’ Dots.   As we all mature, it seems there is a renewed interest among all generations (but even more markedly, among the 50+ contingent) in connecting with initiatives and brands that have purpose, and some intangible quality that I can loosely call “warmth.”  Have you noticed it in the air? Read the rest of this entry »


The Lost Art of Boredom

May 16, 2011

By Lisa S. Burroughs

I’m so bored!

We have all said that a lot as children, right before our parents shooed us outside to play or threatened us with housework to alleviate our condition.

When was the last time you were bored? I can say quite confidently that I have not been bored in years. Is this a good thing? With all the options for constant stimulation available to us, boredom has become an extinct creature that didn’t have a reason to exist in the first place, like that bird that couldn’t fly. Good riddance.

Digital activities like texting, checking your social networks, refreshing your RSS feed, reading email, playing games, and checking in at your current location have the power to fill every second of your day, including those seemingly wasted seconds between other tasks. I’m not going to give you hard statistics on how much time we spend online via our desktops, laptops or mobile devices because we all know it is way too much and it culminates to an overwhelming cacophony of noise and information known as digital overload (DO). Read the rest of this entry »


Join Immersion Active in California

April 4, 2011

Immersion Active’s David Weigelt will be packing his bags and heading out to sunny San Francisco the week of April 26th to attend the 2011 Aging in America Conference. Between visits to Tommy Toys (his favorite Chinese restaurant), you’ll find David presenting on the topic of Engaging Family Caregivers via the Social Web. In addition, David hopes you’ll join him at Mary Furlong’s What’s Next Boomer Summit. Mary’s event is held before and after ASA’s event and is a must attend for anyone looking to doing business in the boomer marketplace.  If you’d like to attend and save a few dollars, Mary has been kind enough to extend a 20% discount to Silver Tsunami readers. Just enter the code wnia11. To learn more and register online, visit: http://www.boomersummit.com/ See you there!


Have we reached a new tipping point?

March 28, 2011

By Kathi Scharf

Last Monday my 65-year old mother called and calmly told me that she and my father were suing me for breaking up their marriage.

Dumbfounded, I cautiously asked “Why?”, at which point she told me that they had stayed up all night playing with the new iPads we had given them that weekend for their birthdays.

Laughing, she went on to share all the apps she’d installed, like CNN, QVC, Angry Birds, and four different poker apps, just to mention a few. This, from a woman who has a brand new laptop but still struggles to regularly find her Gmail account! Read the rest of this entry »


A note from David on the tragedy in Japan and our own “tsunami”

March 15, 2011

It’s 2 am and I can’t sleep. Upon leaving work yesterday, Immersion Active’s social media guru, Ross Hollebon, suggested that I might want to address the inconvenient truth about the name of our weekly ebrief, Silver Tsunami, in light of the tragedy still unfolding in Japan.

But that’s not what has me awake.  I’m up because my phone has been vibrating throughout the night with updates and information from various colleagues from around the globe. Each time, I’m hopeful that I’ll see an update from Immersion Active’s friends, Hiro Murata and Florian Kohlbacher, in Japan, but, as of this posting, nothing yet.

So let me take this opportunity to explain the name of our newsletter.  Read the rest of this entry »


Clicks and Pageviews and Bounce Rates — Oh My! Why You Shouldn’t Be Afraid of Analytics

February 28, 2011
lions and tigers and bears oh my

You don't need red, ruby slippers to learn from your numbers.

Good news: web analytics can give you lots of data about what’s going on “behind the curtain” of your website.

The bad news?

Unless that data is translated into business information, all you have is endless counts, percentages, charts, and tables.

Yawn. That can be boring and a little scary at the same time. But it doesn’t need to be. Here’s a quick look at some of the business information you can glean from one of the most basic pieces of analytics data: traffic source. Read the rest of this entry »


Follow

Get every new post delivered to your Inbox.