Este documento presenta una metodología para el diseño y desarrollo de sitios web centrada en el usuario. Explica que un enfoque basado en el usuario conduce a sitios web con alta usabilidad que brindan una buena experiencia al usuario. Describe etapas clave como realizar un brief del encargo, analizar la competencia, evaluar la usabilidad del sitio actual mediante pruebas con usuarios, diseñar una arquitectura de información organizada, y crear una interfaz de usuario atractiva que comunique efectivamente. El objetivo general es

1. Mexital I+D®
Metodología
Para el Diseño y Desarrollo
de Sitios Web
Desarrollado por Mexital I+D® para YMCA Concepción Chile
I+D

2. Mexital I+D®
Problemática de actualidad:
Enfrentados al Estrés Intranet Comunidades
del Usuario ante la Web Blog
? Widget
E-Mail Integración
Nos preocupamos por mejorar la experiencia del Usuario que se
encuentra ante la gran diversidad de plataformas en la Web actual.
Los sitios Web tienden a vincularse dando paso a múltiples variables
Chat Transacción
que generan el estrés del usuario.
Vínculos mal diseñados y errores sin respuesta son comunes en
sitios con una mala organización de contenidos. Tv & Video Perfil
En resumen una mala experiencia del usuario se traduce en un cliente
insatisfecho y que no volverá.
Una comunidad de usuarios inexpertos y estresados resulta un pésimo
panorama para las pretensiones del mercado ante el despliegue de
tecnología y productos.

3. Mexital I+D®
Diferenciamos y potenciamos a nuestros clientes
Diferentes Clientes - Usuarios
buscan diferentes resultados
Clientes - Clientes habituales
Usted sabe que, de hecho, el cliente es el rey de su negocio. Sin él, su
empresa no existiría. Por eso debe hacer todo lo posible por dejarle
satisfecho, tan satisfecho como para que repita. Por eso, y porque según
los estudios, los clientes habituales generan el doble de beneficios que los
nuevos clientes.
Sponsors - Sponsors potenciales
Patrocinador o Sponsor es la compañía que te paga por poner publicidad
en tu página Web. Hay diversas compañías como diferentes tipos de pago, Un usuario que califica un Sitio Web con
algunas pagaban por hit , otras pagan por click , por registro , compra , etc. altos índices de usabilidad es un cliente
Para sacarle provecho a un sponsor en necesario que este se adecue a satisfecho, que vuelve y recomienda los
nuestro sitio Web , a nuestro trafico , etc. servicios bien ejecutados.
Usuarios Avanzados y Expertos
Un sitio web que cumple con los estándares
Se anticipan a todos los vinculos y reconocen las características de los de creación se basa en un método que
sistemas, desechan rápidamente los sitios con errores y mal diseñados. aborda la web semántica o web 2.0, éste
Tiene más experiencia con las interfaces y pasan varias horas navegando. se denomina DCU:
Diseño Centrado en el Usuario.

4. Mexital I+D®
Metodología DCU
Diseño Centrado en el Usuario

5. Mexital I+D®
Brief Encargo Acotar el encargo mejora la
productividad
Detallar los pasos del proyecto en el que se va a trabajar, si bien suena a un poco de trabajo previo
ayuda MUCHO al proceso creativo y prácticamente pone las bases del diseño.
Una vez que el brief está hecho, la mayoría de veces todo marcha sobre ruedas, porque dentro de
él tenemos ideas, conceptos, personajes y personalidad.
Es la mejor forma de conocer al cliente y saber cual es el verbo del sitio. Crea el hábito de hacer
las cosas en orden y seguir un sistema que aumentará definitivamente nuestra efectividad y
productividad.
Brief de Cliente
www.mexitaldesign.com/brief

6. Mexital I+D®
Benchmark Ponga ojo en su competencia
1
Benchmarking es una técnica de gestión empresarial que pretende descubrir y definir los aspectos
que hacen que una empresa sea más rentable que otra, para después adaptar el conocimiento
adquirido a las características de nuestra propia compañía.
En otras palabras son comparativos de habilidades en la Web. Las mediciones se centran en la
gestión y los aspectos que impactan directamente la Usabilidad y la Experiencia del Usuario de
su competencia.
Con estas mediciones se tienen datos confiables de cómo, por qué y en qué su competencia es
mejor y más efectiva. Estos datos son fundamentales antes de enfrentar su proyecto.
Instituto Español de Comercio Exterior (ICEX)
http://www.icex.es/

7. Mexital I+D®
Usabilidad Conozca porque su actual sitio
2 Web no cumple las expectativas
El modelo conceptual de la usabilidad, proveniente del diseño centrado en el usuario, no está completo sin la idea
utilidad. Es aquí donde se hace primordial conocer el verbo del sitio.
El “grado de usabilidad” de un sistema es, por su parte, una medida empírica y relativa de la usabilidad del mismo.
* Empírica porque no se basa en opiniones o sensaciones sino en Tests de Usabilidad, que miden eficacia,
eficiencia, satisfacción y navegación.
* Relativa porque el resultado no es ni bueno ni malo, sino que depende de las metas planteadas (por lo menos
el 80% de los usuarios de un determinado grupo o tipo definido deben poder encontar con éxito el producto X en
N minutos sin más ayuda que la guía rápida) o de una comparación con otros sistemas similares.
Se obtienen datos reales e irrefutables sobre lo que sucede en su Web o intranet gracias a estas herramientas de
medición:
* Test Heurístico - www.mexitaldesign.com/heuristico.html
* Test de Usuarios - www.mexitaldesign.com/usuario.html
* Laboratorios de Usabilidad - www.laboratoriousabilidad.com
* Minería Web - www.mexitaldesign.com/usuario.html
http://www.upassoc.org/
The Usability Professionals’ Association

8. Mexital I+D®
Arquitectura Organización Fundamental de
de la Información
3 Contenidos
Ésta disciplina estudia, analiza, planifica y fundamenta la organización, disposición y estructuración de espacios de
información, además selecciona y presenta los datos contenidos en los sistemas de información interactivos.
El World Wide Web y el Information Architecture Institute, definen Arquitectura de la Información como:
* 1. El diseño estructural en entornos de información compartida.
* 2. El arte y la ciencia de organizar y rotular sitios Web, intranets, comunidades en línea y software para promover
la usabilidad y encontrabilidad.
* 3. Una comunidad emergente orientada a aplicar los principios del diseño y la arquitectura en el entorno digital.
Trata indistintamente el diseño de sitios e interfaces de dispositivos móviles y gadgets como un iPod, CDs
interactivos, videoclips digitales, relojes, cajeros automático, juegos electrónicos, etc. Su objetivo es facilitar al
máximo las tareas que ejecutan los usuarios, los procesos de comprensión y asimilación de la información que se
les presenta, de acuerdo a los objetivos planteados en la fundamentación del proyecto.
Los recursos mas usados en AI son:
* Card Sorting
* Lingüística y Redacción Creativa
* Mapas de Navegación e Interacción
* Wireframes
http://www.iainstitute.org/
The Information Architecture Institute

9. Mexital I+D®
Diseño
de Interfaz
Diseño Corporativo Original
de Usuario
4 al servicio de la comunicación
En el caso de Sitios Web la interfaz construye el feeling del cliente. Desde el momento que el usuario entra al sitio,
comienza a interactuar con el producto y por lo tanto, comienza su experiencia.
Ahora, piense en todas las aplicaciones y los sitios que ha usado recientemente. ¿Cuántas veces no encuentra lo
que busca o no sabe cómo hacer lo que quiere? Esa situación resulta de una mala interfaz, que a su vez genera un
problema de usabilidad.
Las interfaces de Sitios Web juegan un papel más importante aún que el que han tenido hasta el momento, en
aplicaciones tradicionales debido a la disparidad de usuarios, lenguajes, aplicaciones y la velocidad con que todos
estos factores están cambiando.
Una buena Interfaz permite destinar los esfuerzos del usuario a una lectura y comprensión más rápida y eficiente
del contenido.
* Define y aplica los conceptos de Diseño y Diagramación.
* Define la cromática y tipografías.
* Diseña la iconografía y le da sentido y ubicuidad al accionar de las personas en un medio digital.
* Construye las Experiencias y entrega las claves para obtener un aprecio estético.
International Institute for Information Design (IIID)

10. Mexital I+D®
Diseño Front Producción e Implementación
5 Web Semántica y Estándares
Conceptualmente es el trabajo de transformar el Diseño Visual en código, para que se vea en los
distintos navegadores y dispositivos. Formalmente es Diseño de código.
Se debe diseñar para los distintos buscadores poniendo atencion a los stándares de creación.
Indexar correctamente los sitios para el reconocimiento de idioma, zona geográfica y horario.
Una buena experiencia en código permite identificar los errores y código basura. Todo esto en
relación a entender y aplicar estándares, Web semántica y código que sea válido para el W3C.
Los ingenieros y programadores a través del código XHTML trabajan para que los Diseños sean
aplicados a cualquier plataforma (WebSphere IBM, Oracle Portal, Microsoft Portal) de manera
eficaz y sin estrés para su equipo de Ingeniería.
* XHTML
* CSS2
* JavaScript
* Ajax
* PHP

11. Mexital I+D®
Metodología DCU
Diseño Centrado en el Usuario
Así funciona la metodología DCU, en base a pruebas y organización fundamental para asegurar el éxito de
su sitio Web.
Aplicamos Asesoría de estrategia, Estudios de Usabilidad, Web Semántica, Diseño Gráfico
Corporativo y Publicitario junto con Programación por Ingenieros áltamente calificados que cierran
el proceso productivo.
Nunca antes su sitio Web fue pensado de esta manera. Déjese guiar por la Ingeniería+Diseño.

12. Mexital I+D®
Fuentes
Jakob Nielsen
José Cabrera
Juan Carlos Camus
Jorge Barahona
Basilio Cáceres
Herbert Spencer
Instituciones
Instituto Español de Comercio Exterior (ICEX)
The Usability Professionals’ Association
The Information Architecture Institute
International Institute for Information Design (IIID)
UsaLab Universidad Tecnológica de la Mixteca Oaxaca, México
Gracias por su Atención
Desarrollado por Mexital I+D® para FullHosting© 2007
I+D