“Cómo crear la web de una
Cómo realizar una web dirigida a los ciudadanos, fácil de usar, útil y clara.
Dolors [email protected]
“Cómo crear la web de una Administración Pública”
www.xperienceconsulting.com
Internet y la tecnología se han incorporado a nuestra vida cotidiana.
Las nuevas tecnologías han ganado terreno tanto en nuestros hogares como en nuestro trabajo.
2
nuestro trabajo.
Esto ha significado en muchas ocasiones un aumento de la eficiencia y una reducción de los costes para muchas organizaciones.
www.xperienceconsulting.com
Las administraciones públicas no se quedan al margen.
Se han ido adaptando a esta evolución
3
Se han ido adaptando a esta evolución realizando un gran esfuerzo para acercarse al ciudadano y darle un mejor servicio .
www.xperienceconsulting.com
Ninguna administración
quiere perder el ritmo.
4
Hay que desarrollar nuevas estrategias digitales
de forma sostenible y eficiente
www.xperienceconsulting.com
Es muy poco el tiempo y muchos los cambios que se deben afrontar.
Hay que tomar decisiones en breves períodos de tiempo sobre:
• Nuevos modelos de gestión de
5
• Nuevos modelos de gestión de contenidos
• Nuevas plataformas
• Nuevos desarrollos
• Nuevos sistemas de autentificación
• Y un largo etc ...
www.xperienceconsulting.com
Aparecen nuevos canales de comunicación con el ciudadano
Pasamos del papel al ordenador
6
comunicación con el ciudadano
Nuevas formas de identificación
www.xperienceconsulting.com
Hay que replantearse nuevos modelos de atención ciudadana
El ciudadano esta cada vez más informado, es más
7
El ciudadano esta cada vez más informado, es más exigente y más participativo.
Y la Administración debe dar respuesta aumentando la calidad del servicio que presta
www.xperienceconsulting.com
El ciudadano está evolucionandoy cada vez más el usuario,
con conocimientos
8
con conocimientos básicos de internet,la introduce en su vida cotidiana.
www.xperienceconsulting.com
Este ciudadano necesita encontrar de forma fácil, rápida y clara lo que busca.
9
Este ciudadano necesita que le
facilitemos la vida con la tecnología.
No se la compliquemos !!!
www.xperienceconsulting.com
“Plantear escenariosde uso realespara poder centrarnosen las necesidadesde los usuarios”
1. Ponerse en el lugar de un ciudadano.
10
2. Existen diferentes públicos a quienes
va dirigida la web.
3. Sin tener claro para quién se diseña la
web, es difícil desarrollar un diseño
centrado en el usuario
www.xperienceconsulting.com
“Técnica del personas”
Las Personas son descripciones detalladas de los usuarios de un sitio
web (o aplicación) y sus metas. Proporciona una persona real para la que
crear el producto, es un paso más allá de pensar en el usuario.
Creamos un personaje, teniendo en cuenta las entrevistas personales
realizadas y le damos características, un objetivo, y vemos que ocurriría
dentro del sitio web.
11
www.xperienceconsulting.com
“Simplificar procesos genera confianza en el ciudadano y lo motiva a utilizar nuestra web”
1. Diseñar según el modelo mental de
los usuarios.
12
los usuarios.
2. No utilizar terminología
excesivamente técnica.
3. La web no debe estar organizada
según la estructura de la
organización interna de la
Administración.
www.xperienceconsulting.com
“Técnica del cardsorting”
Es un ejercicio en el que el usuario agrupa y clasifica un conjunto de
conceptos en diferentes grupos creados por él o por el moderador del
ejercicio.
Objetivo: Estudiar la forma como los usuarios organizan la información,
agrupan esos conceptos y crean asociaciones entre ellos.
Sofisticado
13
www.xperienceconsulting.com
“Técnica del cardsorting”
Beneficios del “card sorting”:
• Identificar los criterios de agrupación de los usuarios reales: Esto nos
permite agrupar la información según el usuario y no según la empresa.
• Validar la categorización que hemos realizado.
14
• Identificar términos adecuados para nombrar a las categorías.
• Confirmar el lugar dónde un usuario buscaría un determinado tipo de
información antes de clasificarla en una categoría determinada
www.xperienceconsulting.com
“Diferentes usuarios, diferentes objetivos”
1. Debemos ordenar los contenidos y
jerarquizarlos según su importancia y
15
jerarquizarlos según su importancia y
los objetivos de nuestros usuarios.
2. Se deben distinguir de forma clara en un
golpe de vista.
www.xperienceconsulting.com
“Plantear una Arquitectura de la Información más sencilla y coherente, realizando una ordenación óptima de los contenidos del portal.”
Árbol de contenidos
16
Priorizar contenidos:
1. Conciliar los objetivos prioritarios del
ciudadano y de la administración (primer
nivel)
2. Objetivos importantes (segundo nivel)
Árbol de contenidos
www.xperienceconsulting.com
“Arquitectura de la información”
1. La arquitectura de información (AI)
es la organización de la información
en la web, categorización,
jerarquización, etiquetado, etc.
17
2. Lo más importante debe ser más
visible. La información crucial debe
estar en un primer nivel.
www.xperienceconsulting.com
“Arquitectura de la información”
Creación de prototiposLos prototipos son una herramienta característica de la Arquitectura de Información
que se utiliza como referencia para estructurar, organizar y jerarquizar la información
de cada página, facilitando la navegación a los usuarios y el trabajo de Diseño Gráfico.
En ningún caso un prototipo es una solución final para aplicar al portal web.
18
Área personal
Entrar
NIF
Clave personal
012
Servicio de Atención ciudadana
Trabajar en Asturias
Formación Profesional
Buscar colegio Ir a la Universidad
Soy profesor
Hacer oposiciones Ser autónomo
Estar en paro
Empleo y discapacidadHacer prácticas
Salud
Invertir en Asturias
Temas
Vivienda
Empleo
Salud
Asuntos Sociales
Deportes
Cultura
Educación
Turismo
Seguridad Pública
Transportes
MAYORES
Para ti
NIÑOS JÓVENES MUJERES
DISCAPACITADOS EMIGRANTES
Actualidad
Presidente
Equipo de Gobierno
Estudiar en Asturias
Infraestructura
Investigación
más temas >>
Gobierno del Principado
Visitar Asturias
Que visitar Comer y beber
Rutas
Donde dormirComo llegar
Vivir en Asturias
Familia
Comprar o alquilar una casa
Hacer obras en casa
He olvidado mi clave personal
Último Boletín
Consultar el BOPA
Buscar en el BOPA
Direcciones y teléfonos
INFRAESTRUCTURASObras y equipamientos nuevos en la ciudad21/05/2005
Feve invierte 2,7 millones en obras en el Principado21/05/2005
TRABAJOPioneros en la creación de empleo21/05/2005
Nueva planta de fabricación21/05/2005
Noticias cedidas por RTPA
Destacamos
Nace una web para apoyar a los
emprendedores
Agenda
Identificarme con certificado digital
Datos sobre Asturias
más opciones >>
Logo SAC
Buscar empleo
Empresas
Pedir una beca
Hacer deporte
Investigar
Contratatar con la administración
Crear una empresa
Ayudas públicas
RTPA la Radiotelevisión de los
asturianos
más información>>
Imagen promoción rotatoria
llama
Gobierno
Obtener una clave personal SAC
Ayudas y subvenciones
Información tributaria
Trámites y Servicios
Puedes hacer más de 172 trámites on line
Consultar las notas académicas
Todos los trámites que puedes hacer desde la web
Hacer tu reserva para visitar el Parque de Muniellos
Ayudas PAC 2005 y licencias de pastos
Obtener una licencia de pesca o de caza
Becas
Tramita desde casa
Todos nuestros servicios
Otros servicios destacados:
más opciones >>
más opciones >>
más opciones >>
© Copyright 2006 Gobierno del Principado de AsturiasAviso Legal | Contacto | Accesibilidad
www.xperienceconsulting.com
Con la ayuda de los prototipos podemos evaluar gran cantidad de características del
modelo final sin necesidad de esperar a la fase final del desarrollo, con lo que esto
supone en ahorro de trabajo, correcciones y tiempo.
Temas
>> TemasEstas en:
Información sobre acogimiento familiar, discapacidad, voluntariado, emigración
Asuntos Sociales Deportes
Información sobre normativa, instalaciones y actividades deportivas en el Principado de Asturias.
Cultura
Información de actividades culturales, organizaciones culturales, museos...
Inicio
19
Educación y formación Empleo
Vivienda
Ocio y Turismo Salud y servicios sanitariosInvestigación y tecnología
Información útil para comprar , alquilar o rehabilitar una vivienda. Políticas autonómicas en materia de vivienda, viviendas protegidas, ayudas...
Información sobre empleo público, ofertas de empleo, riesgos laborales, subvenciones, autonómos, curso de formación ocupacional, discapacidad y empleo...
Recursos sanitarios, hospitales, farmacias, medicamentos, trámites administrativos, tarjeta sanitaria, prevención, saluda laboral....
Oferta educativa, información sobre estudios, titulaciones, informes de empleabilidad...
Información turística, que ver, dónde dormir, tradiciones...
emigración...
Información sobre investigación , desarrollo tecnológico e innovación.Ayudas y actividades...
Otros temas
Agricultura y Montes
Transportes
Infraestructuras y equipamiento
en el Principado de Asturias
Información transportes
Información sobre infraestructuras, carreteras y equipamientos...
Artesanía y Comercio
Consumo
Economía y finanzas
Seguridad Pública
Función Pública
Ganadería
Industria y Energía
Pesca
Relaciones exteriores
Medio ambiente y territorio
Información sobre seguridad pública
www.xperienceconsulting.com
La página de inicio de mostrar claramente y en un primer vistazo lo que permite. Si
el usuario no sabe que puede hacer difícilmente pensara en la posibilidad de hacerlo.
“Página de inicio”
20
www.xperienceconsulting.com
Toda la información importante
debe estar a menos de 3 clicks
los usuarios son muy impacientes
navegando y es
probable que si en la home no
“Página de inicio”
21
probable que si en la home no
encuentran se vayan de la web.
Crear enlaces directos a las
operaciones más demandadas
y cotidianas.
www.xperienceconsulting.com
Se rediseñó el Portal orientándolo al ciudadano y sus necesidades.
Se utiliza un lenguaje sencillo y un diseño cálido. Se pretende acercar la Administración al
ciudadano y romper con su imagen fría y distante. Se le trata de tú y se huye del lenguaje
administrativo que le puede resultar confuso.
“Fomentar un Diseño Centrado en el Usuario, estableciendo un equilibrio entre los diferentes elementos que componen el entorno del portal ”
22
administrativo que le puede resultar confuso.
Se organizó la información en una jerarquía clara y de fácil entendimiento para el
ciudadano.
Se aplicaron políticas de navegación comunes, además de aumentar el espacio para sus
contenidos. Se optó por una navegación a través de los contenidos. Utilizando elementos de
ayudan al usuario como el rastro de migas que actúa de forma orientativa de donde estas y
como has llegado.
Se planteó también una síntesis en cuanto a la información, limitando el peso de los contenidos
en los primeros niveles para facilitar una navegación rápida.
www.xperienceconsulting.com
“Consideraciones generales”
1. Navegadores
2. Diseñar para Sistemas operativos populares
3. Diseñar para velocidad de conexión más común
4. Diseñar para resoluciones de pantalla más comunes
5. Accesibilidad . Seguir las pautas WAI (Web Accesibility
23
5. Accesibilidad . Seguir las pautas WAI (Web Accesibility
Initiative)
www.xperienceconsulting.com
“Terminología clara”
1. Es importante entender que diferentes
usuarios pueden leer la misma
información.
24
información.
2. Un lenguaje natural eliminará las
dudas.
www.xperienceconsulting.com
“Dónde estoy, a dónde voy”
1. Gestionar correctamente los elementos de
orientación títulos. “si he clicado aquí que
se llame igual”
2. Informar si se sale de la web, si se abre un
PDF etc
25
3. No utilizar nombres diferentes para el mismo
contenido.
4. Rastro de migas
Inicio > Categoría 1 > Categoría 2 >
www.xperienceconsulting.com
“Consistencia en la navegación”
1. Se debe seguir un criterio único y consistente de los elementos de
navegación a lo largo de toda la Interfaz (posición, funcionalidad y
diseño, tratamiento de los colores de los enlaces).
2. Se recomienda también que este criterio sea homogéneo en TODOS
los servicios.
26
3. De esta forma se facilita el aprendizaje del usuario y la percepción en
todo momento del site.
www.xperienceconsulting.com
“Navegación hacia delante” Los contenidos se han organizado en
áreas divididas en campos de
información.
Con tres caminos principales de
entrada a la información que giran
entorno a:
1. Situaciones en la vida, cómo
opción principal
2. Temas
3. Perfiles o colectivos
1
27
3. Perfiles o colectivos
A partir de estos caminos se le ofrece al
usuario toda la información relacionada
con el contenido seleccionado, como
pueden ser Ayudas, servicios, noticias,
enlaces de interés etc... Y el acceso a
toda esta información en su globalidad.
23
www.xperienceconsulting.com
“Navegación hacia atrás”
La navegación hacia atrás se produce principalmente a través del botón del navegador
“Atrás”.Este botón es el más utilizado por los usuarios al navegar.
Otra forma de navegación hacia atrás la constituye el logo del Portal del Gobierno del
Principado de Asturias, situado en la parte superior izquierda de la cabecera, que
estará enlazado a la página de inicio en todas las páginas interiores.
El Rastro de migas también permite al usuario navegar hacia atrás conociendo el
28
El Rastro de migas también permite al usuario navegar hacia atrás conociendo el
camino que ha seguido.
www.xperienceconsulting.com
“Los textos”
1. Alineados al izquierda
2. El interlineado
3. Tamaño letra
4. Color y contraste con el fondo
5. Utilizar Fuentes familiares a los usuarios
6. Utilizar el espacio blanco de forma moderada
7. Los textos en imágenes no son indexados por buscadores
29
7. Los textos en imágenes no son indexados por buscadores
.
www.xperienceconsulting.com
“Buscadores”
Interfaz estándar.
Se trata de una norma básica y genérica de Usabilidad, y en los buscadores no es
ninguna excepción. Lo más estándar es un campo de texto con un botón al lado que
diga "Buscar" . Los internautas ya conocen muy bien este tipo de Interfaz y se
sienten cómodos con él.
El poner más campos o dar más opciones únicamente puede llevar a confusión, y
tan sólo debe hacerse en la página de búsqueda avanzada.
Campo de texto suficientemente ancho.
30
Campo de texto suficientemente ancho.
Refuerza visualmente el hecho de que se puede introducir más de una palabra.
Permite ver la sentencia de búsqueda completa (a no ser que sea muy larga).
Esto resulta útil, por ejemplo, para revisar faltas de ortografía, además de dar
seguridad a algunos usuarios.
www.xperienceconsulting.com
Nuestro objetivo es alcanzar…
31
www.xperienceconsulting.com
Un paso más allá:
Útil
UsableDeseable
la experiencia de usuario…
32
Valioso
Fácil de encontrar
Creíble
Accesible
www.xperienceconsulting.com
Contrastar datos: análisis cualitativo – análisis cuantitativo
Es un estudio cualitativo
33
Invitamos a un grupo reducido de usuarios (entre 8 y 15).
Les hacemos hacer unas tareas navegando por nuestra web y les observamos y les
grabamos para su análisis posterior.
Estudiamos su comportamiento e interacción con la interfaz digital.
www.xperienceconsulting.com
Eyetracking
34
www.xperienceconsulting.com
Contrastar datos: análisis cualitativo – análisis cuantitativo
Analizar una muestra grande de usuarios para obtener datos estadísticos
Investigación online sobre una amplia
muestra de usuarios (desde 50 hasta
1000).
Usuarios geográficamente dispersos.
Participan desde su contexto de uso
35
Participan desde su contexto de uso
natural. Su casa, su trabajo.
Capacidad de cuantificar:
• el nivel de usabilidad
• los patrones de comportamiento
• las intenciones de los usuarios online
• por qué abandonan
www.xperienceconsulting.com
Análisis True intent
Este estudio está destinado a conocer mejor
al usuario visitante de una página web. Se
obtiene información relacionada con los
objetivos de su visita
Se utilizando usuarios que han entrado de
manera espontánea a la web
36
1. ¿Qué vienen a hacer los usuarios a mi web?
2. ¿Consiguen realizar la tarea a la que
venían?
3. En el caso de tener ¿qué problemas han
tenido?
4. ¿Qué percepción tienen tras utilizar la web?
www.xperienceconsulting.com
37
www.xperienceconsulting.com
Muchas gracias por su atención
Dolors Pou
Directora de la Oficina de Barcelonade Xperience Consulting
38
Miembros de
[email protected]+34 652 489 979
BarcelonaAvda. Diagonal, 419 -3B
08008 Barcelona+34.93.414.75.54
MadridC/ Gran Vía, 62 – 7º izqda.
28013 Madrid+34.91.542.62.52
Silicon Valley440 N. Wolfe Rd.
Sunnyvale, CA 94085 (USA) +1.408.524.7445