DISEO EFICAZ DE SITIOS WEB

L A S 7 C D E L A I N T E R FA Z D E L C L I E N T E

J UA N PA B LO S E M I N A RIO

Interfaz del Cliente

La interfaz es la representacin virtual de la propuesta
de valor elegida por una empresa.
Cuando est bien diseado, el sitio web responde con
rapidez a varias preguntas bsicas a las que se
enfrentan los usuarios:

Vale la pena visitar este sitio?

Cules son los productos o servicios que vende?

Cules son los mensajes que transmite?

Exclusividad? Precios bajos? Facilidad de uso?

Las 7 C del diseo eficaz de sitios web

1. Contexto
Disposicin y diseo del sitio

2. Contenido
Texto, imgenes, sonido y video
que contiene el sitio web

7. Comercio

3. Comunidad

Capacidad del sitio para permitir

las transacciones comerciales

Formas en que el sitio permite la

comunicacin usuario a usuario

6. Conexin

4. Conversin
(Customization)

Grado en el que el sitio est

vinculado a otros

5. Comunicacin
Formas en que el sitio permite la
comunicacin de sitio a usuario,
de usuario a sitio, o en ambas
direcciones

Capacidad del sitio para

adaptarse a distintos usuarios o
permitir la personalizacin

1. Contexto (Look-and-feel)

El contexto se define como la percepcin (look-and-feel) de

una pantalla (screen-to-face) de interfaz del cliente.

El look-and-feel de un sitio web se puede clasificar por

criterios de esttica y funcionalidad.

Un sitio dirigido a la funcionalidad se enfoca principalmente

en la oferta fundamental, ya sea si se trata de producto,
servicios o informacin. Este tipo de sitios enfatiza metas
utilitarias como la facilidad de navegacin.

Un sitio dirigido a la esttica se enfoca ante todo en

grficos, colores y caractersticas de diseo interesantes.

Dimensiones de Contexto

Funcionalidad
Disposicin: divisin de la seccin, estructura de
vnculos, herramientas de navegacin
Desempeo (performance): velocidad, confiabilidad
(tiempos de inactividad), independencia de
plataforma, acceso a medios, valor prctico (Usability)
Esttica
Esquema de colores
Temas visuales

Arquetipos de Contexto

Esttica / Forma

Alto

Integrado
Dominante en el
aspecto esttico
La frontera se
mueve
gradualmente
hacia fuera
conforme
avanza la
tecnologa

Bajo
Dominante
en el aspecto
funcional
Bajo

Alto

Funcin

Ejemplo de Dominio en el Aspecto Esttico:

disney.com

Ejemplo de Dominio en el Aspecto Funcional:

wordreference.com

Ejemplo de Estrategia Integrada: bestbuy.com

2. Contenido

El contenido se refiere a toda la informacin digital

incluida en el sitio. Su amplio concepto incluye
contenidos de audio, video, imagen y texto.

Dimensiones de Contenido

Mezcla de ofertas
El contenido del sitio puede incluir productos, informacin o
servicios.
Mezcla de atraccin
Se refiere a los mensajes de promocin y comunicacin que
proyecta la compaa. Dos atractivos generales: cognoscitivo
(aspectos funcionales como precios bajos, confiabilidad) y
emocional (lazos de resonancia emocional como humor,
calidez).
Mezcla de multimedia
Se refiere a las opciones de medios que incluyen texto, audio,
imagen, video y grficos.
Tipo de contenido
En trminos de obsolescencia y volatilidad: contenido actual y
contenido de referencia.

Arquetipos de Contenido

Dominio de oferta

Supertienda
El mejor de su categora
Tienda especializada

Dominio de informacin

Dominio de mercado

Nmero de categora de
productos

Arquetipos Dominados por la Oferta

Supertienda

Mltiple

Tienda
Especializada

El mejor de
su categora

Sencilla

Estrecha

Amplia

Profundidad de la lnea de productos

Supertienda: amazon.com

El mejor en su categora: petsmart.com

Tienda Especializada: flowers.com

Dominante de Informacin: businessweek.com

Dominio de Mercado: match.com

3. Comunidad

La comunidad incluye una sensacin de membreca en

un grupo junto con un sentido fuerte de participacin e
intereses comunes de dicho grupo.

Elementos de una Comunidad

Seis criterios para evaluar el nivel de formacin de una
comunidad:

Cohesin
Efectividad
Ayuda
Relaciones
Lenguaje
Autorregulacin

Arquetipos de Comunidades

Slo amigos

Entusiastas

Amigos en necesidad

Jugadores

Comerciantes

Nivel de Participacin de Miembros

Pasivos

Activos

Motivadores

Moderadores

Beneficios para los Miembros

Satisfaccin de necesidades

Inclusin

Influencia mutua

Experiencias emocionales compartidas

Dimensiones de Comunidad

Comunicacin interactiva

Conversacin electrnica (chat)

Mensajes o conversacin instantneas (instant messaging
or instant chat)
Tableros de mensajes (message boards)
Correo electrnico de miembro a miembro

Comunicacin no interactiva

Pginas web pblicas de los miembros

Contenidos de miembros

Arquetipos de Comunidad segn Enfoque

Bazar
Permite a los usuarios navegar por numerosas reas de inters pero no
proporciona medios para interactuar de manera significativa. Similar a un
portal. No se puede establecer un sentido de comunidad.
Ejemplo: games.yahoo.com

Parque temtico
Se define como una comunidad que se enfoca en un nmero definido de
reas de inters que estn organizadas por categoras y subcategoras.
Estos sitios albergan a un gran nmero de comunidades.
Ejemplo: eHow.com

Club
Se define como una comunidad que se enfoca solo en un rea de inters
y promueve el trato frecuente entre los miembros.
Ejemplo: twitter.com

Arquetipos de Comunidad segn Interaccin

Santuario (Shrine)
Se define como una comunidad muy enfocada con un mnimo de
interaccin entre los miembros. Su esencia son las actividades de
miembros que muestran gran entusiasmo por una persona u objeto de
inters comn.
Ejemplo: el sitio web oficial de los Jonas Brothers: jonasbrothers.com

Teatro
Comunidad que se enfoca en un rea en particular pero permite la
interaccin moderada entre los miembros. Estos sitios proporcionan
contenido provocativo y atractivo para activar la interaccin de los
miembros. Ejemplo: iFilm.com.

Caf
Se define como una comunidad que se enfoca solo en un rea de
inters comn pero que proporciona una considerable interaccin
entre sus miembros. En estos sitios el enfoque principal es la
conversacin entre los miembros. Ejemplo: Facebook.com

Dimensiones de Comunidad
Enfoque o Interactividad
Games.yahoo.com

Youtube.com

eHow.com

Facebook.com

jonasbrothers.com

iFilm.com

Twitter.com

Santuario

Teatro

Enfoque

Bazar

Parque
Temtico

Club

Estado de no equilibrio:
Las comunidades
administradas
exitosamente se movern
hacia niveles de
interaccin ms elevados

Interactividad

Caf

4. Conversin (Customization)

Conversin o customization se refiere a la capacidad de

un sitio de adaptarse a cada usuario o para que cada
usuario lo adapte.
La conversin puede ser iniciada por el usuario,
proceso que se denomina personalizacin, o por la
organizacin, proceso que se denomina adaptacin.

Dimensiones de Customizacin

Personalizacin
Registro de entrada (log-in registration)
Cookies
Cuentas de correo personalizadas
Configuracin de contenido y layout
Almacenamiento
Agentes

Adaptacin del sitio

Adaptacin basada en el comportamiento pasado del usuario
Adaptacin basada en el comportamiento de otros usuarios
con preferencias similares

5. Comunicacin

Comunicacin se refiere al dilogo que inicia la

organizacin. El dilogo puede ser unilateral (en un solo
sentido de la organizacin al usuario) o ms interactiva.

Dimensiones de Comunicacin

Transmisin (Broadcast)
La transmisin es una relacin de uno a muchos
entre el sitio web y sus usuarios. Formas alternativas
de transmisin:

Correos masivos (mass mailings)

Preguntas frecuentes (FAQ)
Boletines por correo electrnico (e-mail newsletters)
Recordatorios de actualizacin de contenido
Transmisin de eventos (webcast)

Dimensiones de Comunicacin (Cont.)

Interactiva
Comunicacin interactiva es una comunicacin
bilateral entre la organizacin y un usuario. Formas
alternativas de comunicacin interactiva:

Dilogo de comercio electrnico

Servicio al cliente
Input del usuario

Hbrida
Comunicacin hbrida es una combinacin de
comunicaciones de transmisin e interactiva.

Arquetipos de Comunicacin (Cont.)

Uno a muchos, usuario no responde

Este sitio se comunica con los usuarios a travs de correos masivos
dirigidos a un pblico definido. Los mensajes son anuncios que los
usuarios reciben sin necesidad de responder. El contenido del sitio se
presenta sin medios para que el cliente responda.
Ejemplo: TheStandard.com

Uno a muchos, usuario responde

Este tipo de sitio se comunica con un nmero masivo de usuarios
registrados o a travs de correos electrnicos dirigidos a usuarios
especficos. Los mensajes del sitio son invitaciones a enviar
comentarios y respuestas. Ejemplo: www.bizrate.com

Uno a muchos, interaccin en vivo

Este tipo de sitio permite a los usuarios interactuar con el sitio en vivo,
con intercambio de informacin en tiempo real. Este intercambio a
menudo es en forma de un chat en vivo. Ejemplo: www.radiojean.com

Arquetipos de Comunicacin (Cont.)

Uno a uno, usuario no responde

Este tipo de sitio enva mensajes personalizados a los usuarios para
abordar intereses o necesidades especficas de dichos usuarios. Este
sitio no proporciona medios para que los clientes respondan. Ejemplo:
Americangreetings.com.

Uno a uno, usuario responde

Este tipo de sitio enva mensajes personalizados a los usuarios para
abordar intereses o necesidades especficas de dichos usuarios. Los
usuarios responden al sitio enviando contenido de inters o
especificando transacciones. Ejemplo: Amazon.com.

Uno a uno, interaccin en vivo

Este tipo de sitio enva y recibe mensajes personalizados del usuario o
lleva a cabo sesiones de chat que abordan intereses o necesidades
especficas de dichos usuarios. Ejemplo: LivePerson.com.

6. Conexin

La conexin es el grado en el cual un sitio determinado

puede enlazarse con otros sitios a travs de un enlace
de hipertexto o de un hipervnculo desde una pgina
web a otra.

Dimensiones de Conexin

Vnculos a otros sitios

Fondo del sitio principal

Contenido subcontratado

Porcentaje de contenido del sitio principal

Trayectoria de conexin

Arquetipos de Conexin

Sitio de Destino
Los sitios de destino proporcionan en forma casi exclusiva contenido
generado por el sitio con muy pocos vnculos a otros sitios. Los
usuarios a menudo los consideran valiosos por su integridad y la
confiabilidad de su contenido. Ejemplo: NYTimes.com

Sitio de Cubo (Hub)

Estos sitios ofrecen una combinacin de contenido generado por ellos
con vnculos selectos a sitios con intereses relacionados. Muchas
veces, estos vnculos son a sitios expertos.
Ejemplo: www.peru.com

Sitio de Portal
Estos sitios consisten casi exclusivamente en vnculos a una gran
cantidad de otros sitios. Por lo general, los portales ofrecen gran
variedad de vnculos a fin de proporcionar el alcance ms extenso
posible para otros sitios, pero presentan muy poco contenido generado
en ellos. Ejemplo: Yahoo.com

Arquetipos de Conexin (Cont)

Programas de Afiliados
Estos sitios dirigen a los usuarios a sitios web afiliados a travs de
vnculos o de vnculos incorporados en banners del sitio o algn otro
material publicitario. Ejemplo: www.medicinenet.com

Contenido Subcontratado
Los sitios web a menudo ofrecen contenido subcontratado; es decir,
contenido generado en otros sitios. Muchas veces los proveedores crean
contenido de ms alta calidad, ms atractivo o a un precio ms bajo que
las operaciones del sitio web. Ejemplo: www.realplayer.com.

Meta Software
El meta software consiste en aplicaciones de software de utilera y
agregados (plug-in) creados para ayudar a los usuarios en tareas muy
definidas. Estas aplicaciones pueden residir como stand alone en el
escritorio del usuario o como plug-ins en el browser de Internet.
Ejemplo: Google Gadgets

7. Comercio

Las capacidades de comercio son aquellas

caractersticas de la interfaz que respaldan los distintos
aspectos de las transacciones comerciales.

Dimensiones de Comercio
Para que un sitio tenga capacidades para el comercio
electrnico, debe contar con una serie de caractersticas:

Registro
Carrito de compras
Seguridad
Aprobacin de tarjetas de crdito
Compras con un click
Pedidos a travs de afiliados
Tecnologa de configuracin
Seguimiento de pedidos

Arquetipos de Comercio

Catlogo de precios

Precio de subasta

Precio de subasta inversa

Precio en agregado de demanda

Precio de regateo

Opciones de entrega

Ajuste y Reforzamiento de las 7 C

Modelo de Negocios

Ajuste de soporte individual

Contexto

Contenido

Comunidad

Conversin

Comunicacin

Reforzamiento consistente

Conexin

Comercio