Pattern languages provide a great structure for defining solutions to complex problems, and there is probably no greater complex management task than customer relationships.

Customer Interaction Patterns is an interesting perspective on customer interactions from a deconstructionist / technologist point of view.


Figure 1. Relationships Among Customer Interaction Patterns

Copyright © 1998 AG Communication Systems Corporation
Permission is granted to copy for the PLoP98 Conference

With the Internet being so ubiquitous, it seems like everyone is a web designer these days. So how do you make your portal standout above the rest with a timeless and enduring design?

Here are a few tried and true tips for achieving web design perfection.

Begin With The End in Mind
Before designing a web site, take a step back and objectively ask "What are we trying to accomplish with this web site?".

Is the portal a revenue generator? If so, how much? Is it strictly informational? Interactive? All of the above?

Get consensus from everyone involved in the project early on so that they understand the end goal. When the inevitable questions, concerns, and "analysis paralysis" sets in, the end goal has the final say whether a decision is in or out.

Form Follows Function
Today's web sites are far more interactive than traditional marketing and media, yet many web designers have an entrenched background in print and television marketing, which emphasizes one-way broadcasts to customers instead of two-way interactive dialogues.

If the end goal defines "what" you want to accomplish, then the function of the web site should shape "how". It is rarely the case that form is the means to a web sites end, unless you're creating brochure-ware.

Is the function of your portal to help customers find exactly what they're looking for? If so, then a search centric design would follow some common conventions, such as placing a search text box towards the top of the page with room for at least 30 characters.

"But the search button should be Red to match our corporate logo" someone might say. "No, the next step is to make sure the search engine actually works and returns relevant results!" the web designer should reply.

Only after the functional requirements are met should the aesthetic form be addressed.

Less Is More
I have 2 pictures of myself from 1977. In one of them, I'm wearing bell bottom pants and a wide collar disco shirt (ala John Travolta in Saturday Night Fever) and in the other picture I'm wearing good old Levi's jeans and a T-Shirt.

Which picture do you think is more timeless? Which one do you think makes me cringe when I look at it?

The point is, there is a price to pay for being "fashionable". You should not follow cool web design trends that will later look dated (and perhaps comical). The most bare boned, functional portals may not win any graphic arts awards, but you can bet they will be still be serving their purpose in 3-5 years with little need for aesthetic changes.

Examples of excess in web design today include:
Flash Intros (with the obligatory "skip intro" buttons)
Graphical or Iconic menus that only reveal their true purpose on hover
Anything animated

If you sense that a web design is excessive, walkthrough a deconstruction exercise asking the team to remove as many elements as possible and still meet the end goal and functional requirements. You'd be amazed at how much "fluff" can be removed from portal designs.

Color is Better Than Black and White
Ahhhh.... you've made it! Congratulations! Your portal meets the stated end goal and serves it's functional purpose to the best of it's abilities.... but.... well.... it does look a little bland.

Because color and function are intertwined, you may want to revisit the functional aspects of the design. For example, can you color code data grids with red or green rows if they deserve any emphasis? Can you call attention to particular elements using bold fonts? Always seek to make color part of the information whenever possible.

When you do start splashing the design with some color to spice it up, keep the following rules and facts in mind:
The contrast of dark fonts on a white background is preferred.
The human eye objectively interprets earth tone colors as being naturally timeless. Anything else is subjective.
8% of males and 0.5% of females are red/green color blind.

Use the Golden Ratio
Web sites like hot or not appeal to human's innate (and often superficial) ability to identify a ratio known as the Golden Ratio, or Phi.

"What is beauty?" is an oft asked question pursued by many artists for centuries, and the answer is (drum roll please) .... 1:1.618.

Because web design is fundamentally the composition of several rectangular elements, this golden ratio can be applied to almost every design decision.

When critics say something doesn't "feel" right in a web layout, it may be because the Phi ratio is well implied in one area but grossly defied in another.

As I write this, OSCON is going on here in Portland, Oregon and the list of speakers and sessions gets better every year.

Open Source is going mainstream and is rapidly becoming a viable and sustainable business model, therefore the average attendee no longer looks like the stereotypical Birkenstock wearing, pony-tailed developer (ok... so I still occasionally wear my Birks  ).

Sure, development still dominates the discussion, but there is a very necessary and welcome balance of legal, business, sales, and operational discussions.

It's quite clear to me that Open Source and SaaS will be the dominant growth markets in software for the next 10 years. Maybe not so much in desktop and consumer apps, but definitely in Enterprise software and infrastructure.

The growth in open source is actually in the 'product halo' and not so much from the actual software. Support, consulting, documentation, hosting, testing.... the list goes on.

I wouldn't be surprised if hosting costs got so cheap that the 2 models converged to become "Free and Open Source Software Services" (FOSSS) with the premise being a vendor will host the software for you (for free) and only charge for training, implementation, and consulting (perhaps via remote desktop or through channel partners).

The downside to the programmable web and web service APIs is that the switching costs will continue to get lower. Switching your Email account, calendar apps, and even ERP/CRM systems will be as simple as switching your phone carrier today. FOSSS vendors will gladly help you move your data around for free in exchange for potential long-term services revenue.

Business software will always be complex simply because the compliance, accounting, and tax rules will not change significantly. Therefore, the services will always have more value over the software, especially if the software can be commodified.

This style guide and toolkit provides all the information necessary to create i-Dialogue page templates that match the look-and-feel of an existing web site.

i-Dialogue uses open web development technologies, such as HTML and CSS, for displaying web pages.

2 new i-Dialogue worksheets are available to help Marketers define their online marketing campaigns.

The Drip Campaign Worksheet helps to define a series of email auto-responders over a finite campaign duration, such as a 30 day download trial period.

For example, "Day 0" is defined as the day when a Lead first registers to download a white paper. On Day 3, you might automatically send a follow-up email with a personalized introduction. On Day 10 you might send a purchase offer or coupon, and so on.

The Tiered Collateral Worksheet is useful for defining what you're willing to give in exchange for self-identification information.

For example, you may provide access to a white paper in exchange for a verifiable email address, but require a first name and phone number for an online test drive or product demo.

These worksheets compliment each other in that auto-responder email messages may contain a personalized call-to-action that offers increasingly more marketing collateral in exchange for more personal self-identification, such as in a Rogers and Peppers 1-to-1 style of marketing campaign.

I've avoided commenting on Microsoft's announcement to enter the hosted CRM market in 2007, but the news is widely covered, so it's worth sharing a few observations.

1) Microsoft's vision of the software+service model is a winner; if it can be executed.

Microsoft would like business users to continue using Outlook and not even realize that they're using a CRM system. Your Outlook software is wired to a CRM service that logs every email interaction, appointment, and contact record.

But Salesforce.com could just as easily create better Outlook plug-ins to address this requirement.

2) Microsoft CRM will continue to be built on their Active Directory and Exchange servers, which were not designed for the Internet hosting era. Microsoft says that they will bear the brunt of this overhead by hosting CRM for businesses.

This will be a great feather in the cap for Engineers, but from a business perspective I think the hosting costs and SLA challenges will be a huge, and ultimately unprofitable, drain on Microsoft resources.

3) Microsoft will be very price competitive and they won't care about profitability for at least 3-5 years. This means that customers might get a workable CRM solution for 40-70% of the cost of Salesforce, but it also means that if Microsoft does not reach at least $500M in annual revenue at the end of 5 years, the whole product line could be shelved.

4) Salesforce.com has a better partner strategy. There will not be an equivalent to AppExchange when Microsoft Live is launched. Salesforce.com does a great job of acknowledging the broader Internet ecosystem and encouraging partners and customers to create "mash-ups" with other systems.

This outer locus of control is counter-cultural to Microsoft. Microsoft Service partners will be the big winners (not ISVs).

5) Microsoft is closer to offering businesses a whole solution. They have an array of back office applications at their disposal, which will give customers the ability to transfer CRM opportunities directly over to Accounts Receivable, Inventory, and Shipping processes.

But Salesforce.com's open web service API makes integration with any Back office system feasible and partners are sure to fill the demand (such as with SAP and Oracle Financials).

6) Microsoft's record of hitting product launch dates is not very good. The mid-2007 target is really aggressive and they still haven't released Vista. The announcement was primarily intended to get Microsoft Partners excited at a recent partner event.

The AppExchange has several free applications developed by Salesforce.com that provide a great start for building solutions. Many of these solutions are fairly turn-key and can be used by employees immediately, while others may need some customization.

Almost all of these solutions could benefit from a Customer Interaction Management (CIM) element, such as an integrated website or customer portal.

I recently reviewed several of these free apps and made some notes on how i-Dialogue could extend these apps to create a whole solution that interacts with customers.

Medical Practice Manager
A great app for tracking patient visits and insurance providers, but doesn't provide detailed practice management features like HL7 codes. I would like to extend this with the ability for patients to create their own appointments online, receive appt reminder emails, and perhaps even update their insurance information online.

A review in the AppExchange listing alludes to possible HIPPA compliance issues, but I'm not so sure a Healthcare solution hosted by Salesforce.com would too far off the mark. After reviewing a HIPPA Ready Portal Checklist we developed a few years ago, I only noticed 2 factor authentication and de-identification of patient records to be possible design challenges to a fully HIPPA compliant practice management solution using AppExchange (and isn't 2-factor authentication more of a recommendation than a requirement? Not sure).

Property Management
Real-Estate is a popular category on the AppExchange and this app quickly gives you a database of properties, rentals, and transactions right out of the box.

The CIM opportunity is the ability to search properties and rentals via an integrated i-Dialogue web site, plus adding the ability to associate images/pictures with properties.

The i-Dialogue portal would also help interested parties contact the realtor to follow-up on a property or rental.

Event Management
We're developing a portal interface for this app as I write this. It provides a great data model for managing special events and coordinating all the logistics with hosting an event (to include equipment, facilities, food & beverages).

The self-service element in i-Dialogue gives customers the ability to register for events online, print directions to the event, receive email reminders prior to the event and post-event surveys.

Services Project Manager
Pro Service Automation, or the tracking of timecards against billable projects, is largely an internally used application and this app provides the basics.

Customer Interactions might include the ability for customers to see their project histories online, contact project resources, and collaborate on documents.

Recruiting
This app is begging for the ability to publish open Job Descriptions online and allow prospective candidates to search Jobs and apply online.

Evacuee Management
This application was created in the aftermath of hurricane Katrina to help place evacuees with temporary housing.

Some CIM opportunities include the ability to locate friends and family through message boards / discussion groups and self-service ability to update status / request housing.

Pet Finder
Handy database for relating lost pets to owners. Definitely a candidate for web self-service so owners can register their names and details on their lost pet.

Some other applications that I'd like to see with CIM portal integration:
Golf / Tennis Reservation System
Hotel / Motel Reservation System
Appointment Scheduler
eLearning Certification System
Facility Management

There are 2 great articles that will help you get the most out of your Web-to-Lead conversions.

Associating Campaigns with Inbound Leads notes that you can auto-associate a lead with a campaign by adding the following fields:

<input type="HIDDEN" name="Campaign_ID" value="7013000000004ko">
<input type="HIDDEN" name="member_status" value="responded"> 

You can have i-Dialogue automatically associate a Lead with a Campaign if the Web-to-Lead form is on a landing page associated with a campaign. To create a campaign landing page, drag a web page onto a campaign object in the i-Dialogue tree menu.

A best practice tip is to create a campaign named something like "Google AdWords - Keywords" and then associate a landing page containing a Web-to-Lead form with the campaign. Not only will the Leads in Salesforce be automatically credited as responding to the Campaign, but the Google total impression count and click-throughs will be updated as well.

Passing Hidden Values through Web-to-Lead Forms builds on the advanced feature of using hidden fields to pass any type of information from the web server to a Lead record.

Watch this HOWTO video to learn how simple it is to create a Web-to-Lead form in i-Dialogue (There's no editing tricks. It really does take just a couple minutes to publish a lead form in your portal).

Creating hidden fields in i-Dialogue is easy. Add a question to any form of type "Textbox" then in edit mode, select the "Question Is Hidden" checkbox. That's it! Salesforce recognizes the Question Code to be the field ID and Default Answer to be the value.