E-Commerce

Customer Interface

Customer Interface

Agenda Introduction The seven design elements of the customer

interface The alternative “look and feel” approaches to design The five content archetypes Be concerned with community The levers used to customize a site Types of communication a firm maintains with its

customer base Firms connect with other businesses The alternative pricing models of commerce

archetypes Case studies: Palm Conclusion

Quote

"On the Internet, ease of use comes first and transfer of money comes second. Revenues on the Web are determined almost completely by usability."

Jakob Nielsen, The Economist, April 28, 2001

Introduction

The customer interface is the virtual representation of a firm's chosen value proposition

Seven design elements of the customer interface (7 Cs) Context Content Community Customization Communication Connection Commerce

7 Cs of the customer interface

Context Site’s layout and design. [how]

Content Text, pictures, sound, and video that

the website contains. [what] Community

The way that the site enables user-to-user communication. [Shop with a friend]

Customization- Sites ability to tailor itself to different

users or to allow users to personalize the site.

7 Cs of the customer interface

Communication The way the site enables site-to-user [email

notification], user-to-site[customer service request], or two-way communication [instant messaging]

Connection Degree that site is linked to other sites.

Commerce Site’s capability to enable commercial

transactions. Sale of goods and services on the site.

7Cs of the Customer InterfaceContext

Site’s layout and design

CommerceSite’s capabilities to enable commercial

transactions

Connection

Degree site is linked to other sites

CommunicationThe ways sites enable site-to-user communication or two-way communication

CustomizationSite’s ability to self-

tailor to different users or to allow users to personalize the site

CommunityThe ways sites enable

user-to-user communication

ContentText, pictures, sound and video that web

pages contain

Business Model

Commerce

Connection

Communication

Customization

Content

Community

Context

Consistent Reinforcement

Individual Supporting FIT

Business Model

Commerce

Connection

Communication

Customization

ContentContext

Online and Offline Integration of the 7CsThe integration of online and offline strategies is important to success:

Context

Both online and offline stores appear simple and elegant.

Commerce

Both storefronts enable and facilitate commerce.

Connection

Polo is very independent in both formats, with few links on the website and no apparent in-store relationships.

Content

Same clothes, same prices, similar selection.

Community

Both the site and the store attempt to create a culture surrounding the product offering.

Communication

Online sales help is available, just like in stores.

Customization

The online shopping experience is more customizable (registration, shopping cart, etc.) than the offline experience.

Polo.com

Ralph Lauren, Madison Ave., NY

The context of a website captures its aesthetics and functional look-and-feel

Dimensions of Context Function Refers to the organization and accessibility of

information Section Breakdown is the way the site is organized into

subcomponents Linking Structure enables users to move easily between

sections Navigation Tools facilitate how the user moves through the

site Site Performance is measured in terms of speed, reliability,

platform independence, media accessibility and usability

1-Context

What is Archetypes?

the original pattern or model of which all things of the same type are representations or copies

prototype; also : a perfect example

Context (Cont’d)

Aesthetics Refers to the visual characteristics of a site Color Scheme refers to the colors used throughout the site Visual Themes help to tell the story portrayed across the site

Context Archetypes Aesthetically Dominant: Emphasis is on the look-and-

feel of the site. This type of site makes heavy use of visual elements

Functionally Dominant: Emphasis is on the display of textual information. This type of site limits the visual design to a minimum

Integrated: Balance of form and function. These sites have a clear and appealing theme that support the underlying graphics

Form vs. Function — The Design Context Frontier

Integrated

Aesthetically Dominant

HighLow

High

Low

Function

Aesthetic/ Form

Functionally Dominant

The age old argument of form vs. function is being changed by the Web:

Frontier is gradually

moving outward as technology

advances

Frontier is gradually

moving outward as technology

advances

Aesthetic Example — KMGI.com

High form, low function: The KMGI approach used to make heavy use of visual elements, but lacked performance capability.

Now, KMGI has integrated more functionality into its site, while still maintaining some of the strong visual elements.

BEFORE AFTER

Functional Dominant — @Brint.com

Low form, high function: Brint.com assumes its users have little need for visual elements or themes and instead seek ease of use and plentiful information:

The site is also text-

laden

The site is also text-

laden

Notice the plethora of

links

Notice the plethora of

links

Integrated Approach Example — Patagonia.com

Patagonia’s integrated approach is a balance of form and function that creates an attractive and easy-to-use interface:

The links, for instance,

are both textual and graphical

The links, for instance,

are both textual and graphical

The 7Cs of CarPoint

The site is information-intensive with lots of links and options to access other parts of the site.

Visually, the site’s graphics denote the theme of the value proposition; even if there were no words, one could still derive that this is a site devoted to car sales.

Functionally, the site appears to have adequate speed, reliability and usability.

The site is information-intensive with lots of links and options to access other parts of the site.

Visually, the site’s graphics denote the theme of the value proposition; even if there were no words, one could still derive that this is a site devoted to car sales.

Functionally, the site appears to have adequate speed, reliability and usability.

CarPoint takes a predominantly functional approach to the context of the site:

2-Content Content

Text, pictures, sound, and video that the website contains.

Dimensions of Content Offering Mix: product, information, services

Less emphases on information or services Appeal Mix: promotional & communication

Cognitive: functional aspects eg: low price Emotional: affect of product or brand; humor or

stories Multimedia Mix: text, audio, images, video Content Type: time sensitive vs. reference

Dimensions to ContentThere are four key dimensions to content, each carrying choices about how to convey the site’s content::

Dimension Dimension

Choices

Offering MixOffering Mix Appeal MixAppeal Mix Multimedia Mix

Multimedia Mix Content TypeContent Type

Products

Services

Information

Cognitivefunctional, low price,

availability,etc.

Emotionalhumor,warmth,stories,

etc.

Text

Audio

Video

Image

Graphics

Current

Reference

Content Archetypes

Superstore Category Killer Specialty Store Information Dominant Market Dominant

Based on Offering Mix

Five Contents Archetypes

Superstore one-stop shop where a customer can

find a wide range of goods in multiple categories.

Category killer exclusively provide products and

services by specific products or by a customer-need category.

Specialty store (Offering Dominant): focuses on exceptional quality and exclusivity while selling single or multiple products.

Superstore Example — Amazon.com

One-stop shop where the customer can find a wide range of goods in multiple product categories:

Note the array of product

categories on the site.

Note the array of product

categories on the site.

Category Killer Example — Petsmart.com

Exclusively provides products and services by specific product or by a customer-needs category:

Again, note the categories; rather than

being broad, they focus on a single vertical.

Again, note the categories; rather than

being broad, they focus on a single vertical.

Specialty Store Example — Frontgate.com

Focuses on exceptional quality and exclusivity while selling single or multiple categories of products:

The site offers a broad array of products, but

they are all high-end, premium

quality products

The site offers a broad array of products, but

they are all high-end, premium

quality products

Contents Archetypes

Information Dominant focus heavily on information, a subset of

these sites focuses on entertainment as well.

Market Dominant do not directly offer goods or services

for sale but create a market where buyers and sellers congregate to conduct transactions.

Information-Dominant Example — Business 2.0Organize and house vast archives of information and provide tools to the customer to explore areas of interest and find answers to specific questions:

“New economy, new rules, new leaders” — this site is focused

entirely on providing timely information to

business leaders

“New economy, new rules, new leaders” — this site is focused

entirely on providing timely information to

business leaders

Offering-Dominant Archetypes

Superstore

CategoryKiller

SpecialtyStore

Number of Product

Categories

Multiple

Single

Narrow BroadDepth of Product Line

Market-Dominant Example — PlasticsNet.com

Create markets where buyers and sellers congregate to conclude transactions:

This site creates an online market for the plastics

industry; note the supplier

information and product specs

available

This site creates an online market for the plastics

industry; note the supplier

information and product specs

available

Content Archetype

Physical Product

Information Service

Superstore Walmart.com CEOExpress.com IBMSolutions.com

Category Killer Petsmart.com DowJones.com Schwab.com

Specialty Frontgate.com tnbt.com Tradex.com

Information and Entertainment Census.gov IFilm.net Digitalthink.com

Market Maker PlasticsNet.com VerticalNet.com Monster.com

Content Archetypes vs. Offering Types

3-Community

Community includes a feeling of membership in a group along with a strong sense of involvement and shared common interests

Community refers to the interaction between site users

Dimensions of Community Interactive Communication: Users can directly exchange

responses with one another in real time via Chat, Instant Messaging, Message Boards or Member-to-Member e-mails

Non-interactive Communication: Site presents static information and only allows unidirectional communication with users

• Cohesion

• Effectiveness

• Help

• Relationships

• Language

• Self-Regulation

• Cohesion

• Effectiveness

• Help

• Relationships

• Language

• Self-Regulation

Just FriendsJust Friends

Enthusiasts Enthusiasts

Friends inNeed

Friends inNeed

PlayersPlayers

TradersTraders

Need Fulfillment

• Inclusion

• Mutual Influence

• Shared Emotional Experiences

Need Fulfillment

• Inclusion

• Mutual Influence

• Shared Emotional Experiences

Degree ofParticipationDegree of

Participation

Communities — Elements, Types and Benefits

Elements of Community

Types ofCommunities

Member Outcomes: Participation and Benefits

Elements of communitySix criteria. Cohesion

Sense of group identity and sense of belonging to the group.

Effectiveness Impact of group on member’s life

Help Perceived ability to ask for and receive

help

Elements of community

Relationships Likelihood of individual interaction

and friendship. Language

The prevalence of specialized language.

Self-Regulation The ability of the group to police

itself.

Types of Communities

Just Friends—social Enthusiasts, shared interests

Community of Practice Friends in need, support groups Players, games Traders

Degrees of Participation

Passives, look but don't post Actives, participate in topics created

by others Motivators, create topics, plan

activities Hosts

Caretakers or moderators, keep order

Member benefits

Need fulfillment: emotional or information needs

Inclusion: encourage to participant in each others activities.

Mutual influence: Openly discuss issues.

Shared emotional experiences

Intro. to Six Community Archetypes

BazaarBazaar

Theme ParkTheme Park

ClubClub

ShrineShrine

TheatreTheatre

CafeCafe

Each archetype will be defined and an example of each will be given:

Archetypes of Community-Community Classification

Bazaar allow users to wander through a number of

interest areas but does not provide any means for users to interact with one another. Yahoo games

Theme Park focus on finite number of interest areas that are

categorized by categories and sub categories Club

highly focused on only one area of interest and promotes a considerable amount of interaction among members.

Archetypes of Community

Shrine highly focused community with minimal

interactions between members. Intensely personal rather than public eg: biographies of TV shows

Theater focused in a particular area but allows for

moderate interaction among members. Café

focuses on a common area of interest but provides considerable interaction among members.

Bazaar Example — Yahoo GamesCommunity that allows users to wander through a vast number of interest areas but does not provide any means for users to interact:

The site offers a wide collection of games

that can be played with other users, but

community is not a priority; the elements of community are not

present (cohesion, effectiveness, etc.).

The site offers a wide collection of games

that can be played with other users, but

community is not a priority; the elements of community are not

present (cohesion, effectiveness, etc.).

Theme Park Example — VoxCap.comCommunity that focuses on a finite number of interest areas that are organized by categories and subcategories:

This site encourages activism on world and community issues, but it is

activism that is the theme.

This site encourages activism on world and community issues, but it is

activism that is the theme.

Club Example — Gillette Women’s Cancer Connection

Community that is highly focused on one area of interest and promotes a considerable amount of interaction among members:

The most prominent link

on the site encourages

member communication

on message boards

The most prominent link

on the site encourages

member communication

on message boards

Shrine Example — The Unofficial Cheers Website

Highly focused community with minimal interaction between members:

This site allows comprehensive exposure to a single topic (in this case, a TV show) with no

interaction among users.

This site allows comprehensive exposure to a single topic (in this case, a TV show) with no

interaction among users.

Theater Example — iFilm.com

Community that is focused in a particular area but allows for moderate interaction among members:

Not as focused as a “shrine,” this site concentrates on film, but still allows for little

interaction among users.

Not as focused as a “shrine,” this site concentrates on film, but still allows for little

interaction among users.

Cafe Example — Bolt.comCommunity that focuses on a common area of interest but also provides for considerable interaction among members:

“Everything you need to speak your mind, hang out, hook up...

whatever” — this teen site allows for a high level of interaction among its users.

“Everything you need to speak your mind, hang out, hook up...

whatever” — this teen site allows for a high level of interaction among its users.

4-Customization

Customization refers to a site's ability to tailor itself to each user or to be tailored by the user

Dimensions of Customization Personalization: The user initiates and manages the

customization process Tailoring by site: Software dynamically publishes

unique versions of the site to address specific user's interests, habits and needs more appropriately

Tailoring based on past user behavior Tailoring based on behavior of other users with

similar preferences

Personalization by User Example — Mylook.com

Enables the user to modify site content and context based on consciously articulated and acted-upon preferences:

The first step in this site’s customization

process is to choose the

category with which you are the best fit; content will then be

customized accordingly.

The first step in this site’s customization

process is to choose the

category with which you are the best fit; content will then be

customized accordingly.

Tailoring by Site Example — Amazon.com

Enables the site to reconfigure itself based on past behavior by the user or by others with similar profiles:

Without consciously articulating

preferences, users find that

Amazon.com makes recommendations based on their past

buying habits.

Without consciously articulating

preferences, users find that

Amazon.com makes recommendations based on their past

buying habits.

5-Communication

Communication refers to the dialogue between a site and its users

Dimensions of Communication Broadcast: One-way information exchange from

organization to user. Broadcast communication can be in the form of mass mailing, FAQ, e-mail newsletters, content-update reminders and broadcast events

Interactive: Two-way communication between the organization and a user. Interactive communication can be in the form of e-commerce dialogue, customer service and user input

Hybrid: Combination of broadcast and interactive communication

Communication Archetypes One-to-many, non-responding user

No need to respond One-to-many, responding user

Survey, questionnaire, etc. One-to-many, live interaction

Seminar, chat, celebrity chat One-to-one, non-responding user

Updates or reminders via e-mail One-to-one, responding user: order notices One-to-one, live interaction: LivePerson

6-Connection with Other Businesses

Connection is the degree to which a given site is able to link to other sites

Dimensions of Connection Links to Sites: Links that take the user completely outside the

home site and into a third-party site

Home Site Background: Links that take the user to a third-party site, but the home site is noticeable in the background

Outsourced Content: The site content is derived from third parties

Pathway of Connection: Refers to the links to access additional information

Pathway-out - links cause the user to completely exit website Pathway-in - links cause the retrieval of material from the same or other

sites without exiting the current website

Dimensions of Connection

Home Site BackgroundHome Site Background Outsourced ContentOutsourced ContentLinksLinks

% of Home Site Content% of Home Site Content Pathway of ConnectionPathway of Connection

?

Sites connect with other businesses in the following ways:

KEY

Home site

Connected Sites

Links can take the user completely outside of the

home site Links can take the user to a new site, but the home site is still in the

background

Site content is derived from third parties

%?

What percentage of content originates from the home site and how much is outsourced?

Does the site lead users to other sites, or does it simply retrieve information from outside sites?

Connection Archetype

Six alternative connection approaches Destination site Hub site Portal site

Affiliate Programs Outsourced contents Meta software

Connection (Cont’d)

Connection Archetypes Destination Site: Provides almost exclusively site-generated

content with very few links to other sites

Hub Site: Provides a combination of site-generated content and selective links to sites of related interests

Portal Site: Consists almost exclusively of links to a large number of other sites

Affiliate Programs: Directs users to affiliated websites through embedded links

Outsourced Content: Contains content generated by third parties

Meta-Software: Utilities and Plug-in software applications created to assist user in narrowly defined tasks

Intro. to Six Connection Archetypes

DestinationDestination

Each archetype will be defined and an example of each will be given:

HubHub

PortalPortal

AffiliateAffiliate

Meta-SoftwareMeta-Software

Outsourced ContentOutsourced Content

PATHWAY-OUT

Links lead the user outside the environment of the site; links are absolute in that the user’s click causes an exit from the original website.

PATHWAY-OUT

Links lead the user outside the environment of the site; links are absolute in that the user’s click causes an exit from the original website.

PATHWAY-IN

Links are hybrid; the user’s click causes the retrieval of material from the same or

other sites without exiting the current website.

PATHWAY-IN

Links are hybrid; the user’s click causes the retrieval of material from the same or

other sites without exiting the current website.

7-Commerce

Commerce refers to the sale of goods, products or services on the site.

Dimensions of Commerce Functional tools that are the commerce-enabling

features of a website Registration Orders Through

Affiliates Shopping Cart Configuration

Technology Security Order Tracking Credit-Card Approval Delivery Options One-Click Shopping

Commerce (Cont’d)

Commerce Archetypes Catalog Pricing: The price of goods and services are preset

by the seller

Auction Pricing: Buyers bid against each other, and the highest bid wins the supplier's products or services

Reverse-Auction Pricing: Sellers bid against each other, and the lowest bid wins the buyer's business

Demand-Aggregation Pricing: Buyer demand for specific products is aggregated in order to achieve economies of scale

Haggle Pricing: Buyer and seller can negotiate over price

Archetypes of Commerce (Transaction Models)

Auction Pricing Reverse AuctionCatalog Pricing

Demand Aggregation Haggle Pricing

The following are Internet-based transaction models:

KEY

Buyer

Seller

Seller dictates price to buyer Multiple buyers bid (seller chooses highest bid)

Multiple sellers bid (buyer chooses lowest bid)

Buyer demand is aggregate

d to achieve

economies of scale

Buyers and sellers negotiate

The 7Cs of Palm.com

ContextPalm.com takes an integrated

approach to the look and feel of its site; there are prominent

graphics, but also functionality.

CommerceThe Palm Store is located at

Palm.com; hardware, software and peripherals can all be

purchased.

ConnectionPalm.com provides links to a

number of alternate providers of software products in a meta-

software environment.

CommunicationPalm.com is a one-to-many non-

responding site; it sounds out updates on product info, but

users response is limited.

CustomizationMyPalm allows users to

personalize the site to handle all of their Palm data online.

CommunityPalm.com has a community

section with message boards, software exchange and other

online user-to-user info.

ContentPalm.com is an information-dominant site with all of its content created in-house.

Learning outcome

7 Cs of the customer interface in detail

Critical factors in the layout (Function)

The levers used to customize a site Dimensions of performance Dimensions of Connection Dimensions of Commerce