Un currela del diseño audiovisual

Autor/es: Martínez Priego, José Mª. jmpriego@gmail.com. Tejero Ariño, Javier. jtarino@alumni.unav.es
Fecha: 30.XI.05
Título del sitio web escogido: Apple España
URL del sitio: http://www.apple.com/es/

1. Establece el propósito general del sitio
Apple es un desarrollador de hardware y software alternativo a Microsoft. Con su sitio pretende mostrar y vender sus productor incorporando dosis de entretenimiento, utilidades y recursos para sus usuarios. No deja de lado, además, el potencial persuasivo de Internet para convencer a los usuarios de sus competidores para que se pasen a sus tecnologías.

2. Define su target principal
Por su estructura y diseño podemos decir que la web de Apple está dirigida al grueso más joven de los profesionales que utilizan la informática como herramienta de trabajo. Con este propósito recurren a una sensación de modernidad y control tecnológico que sirve de gancho a este público. Además, los último periféricos desarrollados por Apple se dirigen a un público más joven (iPod) por lo que tienen áreas de entretenimiento y servicios más “ligeros” para este tipo de públicos. A pesar de que la página está dirigida a público, mayoritariamente joven, el site no excluye a ningún grupo de usuarios.

3. Enuncia la estructura principal de contenidos (primer nivel de navegación)
El menú principal aparece en la parte superior de la pantalla. Está dividido en pestañas que enlazan a sus principales unidades de negocio. Es decir, Información corporativa general, tiendas, servicios de iPod y venta de música, información sobre sus productos Mac (hardware, periféricos y software), área interactiva para Quicktime, Soporte y atención al cliente y por último su sistema operativo MacOSX. Este primer nivel de navegación posee un segundo nivel en todas las pestañas con contenidos específicos a distinto público.

4. Valora la eficacia de su representación en la página inicial
El menú, al estar en la parte superior, es muy visible y esto facilita su identificación. Las etiquetas que nombran cada una de las secciones de dicho menú son muy claras, pues están dividas por las principales áreas de interés que posee la entidad. El mayor problema lo encontramos ante la sección principal (home) ya que utiliza la metáfora de la manzana, que no todos los usuarios pueden entender.
5. Verifica la existencia de acceso desde la página inicial a las estructuras de zonas del segundo nivel de navegación
Desde la web de Apple no se puede acceder a un segundo nivel de navegación de una sección principal no activada. Es decir, el segundo nivel de navegación solo será visible según se entra en cada una de las secciones que representan el nivel superior de navegación.

6. Valora en los nodos del segundo nivel el modo de representación de la estructura central y el de la estructura de zona
Una vez que hemos accedido a una página de segundo nivel se nos indica claramente donde estamos. La pestaña de primer nivel se mantiene marcada, al igual que la de segundo nivel. Cada una de estás páginas tiene un formato diferente. Se constituyen micropáginas temáticas individuales con una única identidad común el menú de navegación principal y secundario.

7. Identifica y valora la funcionalidad del sistema de ayuda utilizado
Apple cuenta con un sistema de ayuda consistente en un motor de búsqueda, un mapa del sitio web y una sección de contacto por distintas vías. El problema se presenta cuando estamos en una página interior. El cuadro de búsqueda solo está disponible desde la página principal, además, en un lugar poco destacado lo que dificulta su localización. El mapa de la web es una lista enorme de enlaces clasificados por categorías un tanto generales. Es muy difícil de utilizar para encontrar un lugar concreto.

8. Valora en una muestra de nodos:
- la identificación del sitio web y de la zona (title y encabezamiento del nodo)
Hay coherencia en los elementos title de la página. Aunque el debate está abierto en los foros sobre estas cuestiones, Apple se ha decantado por la fórmula más común, IDENTIFICACIÓN DE LA COMPAÑÍA y NOMBRE DE SECCIÓN. Así está indicado en la muestra de nodos elegidos.
- la indicación de autoría, actualización, reserva de derechos y datos de contacto (pie del nodo)
Todas las páginas del sitio poseen en el pie una indicación de autoría (Copyright © 2005 Apple Computer, Inc. Todos los derechos reservados), condiciones de uso y política de privacidad

9. Verifica las posibilidades de navegación del sitio alternativas al menú principal (índices, mapas, buscadores, enlaces internos de hipertexto, menú de usuarios, visitas guiadas, etc.)
Como ya hemos indicado existe la posibilidad de navegar a través de un engorroso mapa de navegación que está disponible en todas las páginas de sitio. También tenemos la posibilidad de utilizar una caja de búsqueda que solo está disponible desde la página principal. Además, está dicho también, está colocada en un lugar poco destacado y sin un diseño que llame la atención sobre su posición.

10. Comprueba la visibilidad del sitio para los buscadores
Ante la búsqueda de sus productos principales en los buscadores más utilizados de la red encontramos los siguientes resultados. Palabras clave: iPod, MacOS X y iTunes (no se contemplan los resultados patrocinados).
- Google: las tres búsquedas dan como primer resultado la sección correspondiente dentro de Apple.
- Alltehweb: tenemos el mismo resultado.
- Ask Jeeves: tenemos el mismo resultado.

11. Valora la accesibilidad del sitio (tamaño de las páginas y de los archivos asociados, requerimiento de plug-ins y/o versiones específicas de navegador, uso de descripciones para imágenes y archivos de audio y vídeo, etc.)
Para ver correctamente la página principal no necesitamos ningún requisito especial. Está diseñada en un tamaño estándar para pantallas de 600x800. Dos problemas se presentan, el diseño a través de imágenes con texto es bastante extenso por lo que los visores de texto para Internet tendrían alguna dificultad que se suprime con el uso de texto alternativo en las imágenes. Otra cuestión es que para ver el scroll de noticias destacadas necesitamos una versión rudimentaria de JavaScript.

12. Valora la usabilidad del sitio (decálogo de Nielsen)
Ante el decálogo de Nielsen solo cabe destacar algunos puntos. La web permite navegar en cualquier dirección y en cualquier sentido por lo que la apariencia de control del usuario es muy amplia. Del mismo modo la web no tiene un complejo entramado, por ejemplo ante una compra de un producto, que asuste al usuario. Al contrario, el funcionamiento es transparente.

La sencilla estructura y unas etiquetas claras para nombrar las secciones del sitio permite un claro recuerdo ante futuras visitas. Del mismo modo su diseño claro ayuda a que cualquier usuario, novel o no, pueda navegar fácilmente.

En cuanto a economía de información, no siempre es posible. Según el tipo de servicio que se consulta la economía es posible o no. Por ejemplo, ante secciones ligeras como iPod, la naturaleza de dicha información permite un juego mucho más gráfico y atractivo con pocas palabras. En cambio, a veces son necesarias largas explicaciones técnicas que difícilmente se pueden resolver. De todos modos, se procura utilizar listas como salida a un uso más escueto de la palabra.

Por último, en cuanto al desarrollo de la página cumpliendo los estándares, la web de Apple no cumple los estándares indicados por la World Wide Web Consortium para XHTML 1.0 por lo que la accesibilidad de dicha página se puede poner en duda. Pasa lo mismo con los estándares de las hojas de estilo, aunque en menor medida, ya que el resultado del test solo indica un error grave.

Autor: Martínez Priego, José Mª, jmpriego@gmail.com:
Fecha: 21.XI.05
Sitio web escogido: BBVA
http://www.bbva.es/TLBS/tlbs/jsp/esp/pusted/prodserv/index.jsp

1. Soporte
El proyecto se presenta completamente acoplado al modelo de comunicación que presenta Internet. En su página principal organiza toda su información disponible en la página. Utiliza un menú en el que se organizan los elementos fundamentales y que permiten una orientación intuitiva hacia el servicio que buscamos. En su cuerpo la página principal muestra información relevante tanto para el cliente como el nuevo usuario y algunas informaciones-servicio. En las páginas interiores se muestra la información pedida y la posibilidad de que todas ellas sean contratadas o supervisadas a través de la web. El soporte es un completísimo punto de información, de contratación y gestión. Un auténtico banco on-line.

2. Formatos
El formato utilizado es el texto fundamentalmente. Las promociones e información comercial está representada con imágenes. Creo que es la única forma clara de informar sobre servicios que requieren atención. Lo único que se sale de esta base es el mapa de localización de sedes bancarias físicas. Para ello se utiliza una imagen en la que puedes elegir tu provincia directamente pulsando en el mapa. Se utilizan además imágenes estáticas para representar las cotizaciones. Un defecto de este punto es que se debería crear una aplicación que permitiera una imagen en movimiento con la información en tiempo real.

3. Hipertexto
Los nodos presentan un gran números de enlaces que permiten la navegación no lineal que permite al usuario adentrarse en los conceptos que le interesan a través de los enlaces. Además, el uso de enlaces está perfectamente definido por el sistema para que cada servicio o producto tenga una serie de opciones que permiten realizar nuevas acciones o entran en zonas específicas que tratan ese asunto concreto.

4. Navegación
La navegación es intuitiva a primera vista. Su menú se distingue claramente de lo que es la información específica dentro de cada página. El sistema de navegación que propone la web del BBVA consiste en definir, en un primer momento, qué clase de usuario es el que está accediendo (particular, empresa, instituciones, etc.). En un segundo nivel desarrolla una tipología de servicios según el perfil y, a continuación, se especifican los servicios. Del mismo modo cada uno de los servicios y secciones tienen unas opciones fijas que se repiten y ayudan a que la navegación sea repetitiva y sencilla para el usuario. La única dificultad que le veo a la navegación es que algunos de los nombres que se le dan a los enlaces no son intuitivos para personas que no hayan tenido antes contacto con una entidad financiera.

5. Metáforas
La única metáfora que está presente en la página principal es una lupa para ejecutar la función de búsqueda. Añadir más metáforas sería un error en una página de este tipo porque la complejidad de conceptos provocaría confusión.

6. Mapas
El mapa que se desarrolla en la sede electrónica del BBVA consiste, simplemente, en mostrar el mismo menú de navegación pero completamente extendido y en forma de lista. A pesar de este mapa no se pueden acceder a servicios que estén más allá de un segundo nivel de navegación lo que provoca ciertos problemas para usuarios que no quieran navegar por páginas intermedias, o bien, no entiendan el lenguaje, publicitario a veces, con el que se denomina a determinadas secciones.

7. Ayudas
La web tiene dos formas de proporcionar ayuda. La primera consiste en la sección “Ayuda”. Realmente no consiste en una “ayuda” en sí misma sino que es una pobre relación de preguntas frecuentes que deja mucho que desear y que no responde a lo que son los servicios en sí. La otra sección relacionada es “Atención al cliente”. Aquí sí podemos recibir una respuesta un poco más concreta a nuestras dificultades, aunque no en tiempo real. Ofrecen dos formularios de contacto, un teléfono de atención al cliente, una dirección de e-mail y una relación completa de todas sus oficinas con su información de contacto.

8. Interactividad
Si nos centramos únicamente en la web con información corporativa sobre la entidad, sin entrar en las plataformas de banca virtual, BBVA no ofrece grandes recursos interactivos. Tiene la consulta de on-line de información bursátil y los formularios de búsqueda y contacto. En lo que se refiere a la interactividad entre los usuarios de la página, no hay un solo recurso que lo permita.

El hipertexto es la solución a la necesidad de compartir información especializada mediante máquinas. Los orígenes se remontan al artículo de Vannevar Bush As we may think publicado en la revista The Atlantic Monthly, en Julio de 1945.

Lo que le preocupaba a Bush era la discrepancia entre el creciente almacén del saber humano y las inadecuadas herramientas para acceder a él. "Los métodos que utilizamos para orientarnos en el laberinto hacia el asunto que nos interesa", escribió, "son los mismos que utilizábamos en tiempos de los barcos de vela."

Charles Deermer: What is Hypertext?

Traducción de Susana Pajares

Bush trató de solucionar el problema con la creación de una máquina hipotética llamada MEMEX. Una herramienta de Gestión del Conocimiento microfilmado.

Dos décadas después, Ted Nelson manifestara sus ideas al respecto, inventando términos los términos hipertexto e hipermedia para referirse a escritos no secuenciales y que coordinaran la presentación de cualquier tipo de información.

Con «hipertexto», me refiero a una escritura no secuencial, a un texto que bifurca, que permite que el lector elija y que se lea mejor en una pantalla interactiva. De acuerdo con la noción popular, se trata de una serie de bloques de texto conectados entre sí por nexos, que forman diferentes itinerarios para el usuario.

Definición del hipertexto

Andries Van Dam, investigador de la Universidad de Brown, desarrolla en 1967 el HES con el objetivo de optimizar la escritura de documentos grandes y de explorar el concepto de hipertexto. Son los primeros hipertextos operativos que comercializa a la NASA que utilizó como sistema de almacenamiento de la documentación de las misiones del Apolo.

Douglas Engelbart materializa sus ideasen NLS (1968) y, posteriormente, en los sistemas Augment , basados en una base de datos jerárquica de fragmentos de texto, a la que se accedía mediante filtros selectivos. NLS se considera el primer sistema informático hipertextual.

Engelbart desarrolló varios elementos básicos de la interfaz humana de las computadoras actuales, como pantallas con imágenes en bits , ventanas múltiples, software multiusuario , y la interfaz gráfica de usuario y también fue el creador del ratón.

En 1978 de Andrew Lippnam y el Aspen Movie Map. Este proyecto consistió en la reconstrucción fotográfica de la ciudad de Aspen. En 1985 Janet Walker creo un manual en hipertexto para las estaciones de trabajo de Simbolics. Primera aplicación comercial del hipertexto.

El hipertexto, en estos primeros años, aparecía como la solución definitiva a todos los problemas de la educación y del tratamiento de la información. Norman Meyrowitz, uno de los primeros responsables del proyecto Intermedia en la Brown University, aseguro en

Pittsburgh

que el panorama era por entonces de total confusión: todos hablaban de hipertexto, hipermedia, multimedialidad e interactividad pero nadie sabía realmente a qué cosa se refería. A fin de cuentas, se preguntaba Meyrowitz, qué es el hipertexto? “Para algunos de nosotros es un programa gráfico tipo HyperCard .

Clicks modernos

Pero el hipertexto no fue una herramienta materialmente útil para todos hasta que en 1989 el Centro Europeo de Investigación Nuclear de Ginebra crease la World Wide Web

hypertext was conceived in 1945, born in the 1960s, and slowly nurtured in the 1970s, and finally entered the real world in the 1980s with an especially rapid growth after 1985, culminating in a fully established field during 1989. Jakob Nielsen, 1990.

A modo de resumen: HISTORIA CRONOLOGICA DE HIPERTEXTOS E HIPERMEDIAS

Autor/es (apellido, nombre, correo-e):
Martínez Priego, José Mª jmpriego@gmail.com
Tejero Ariño, Javier jtarino@alumni.unav.es
Fecha: 27/10/05

Primero: Control
Sitio web de ejemplo: Proyecto camaleón
http://www.camaleoncss.com
Comentario: El control permite que el usuario tenga el control en el aspecto en el que se presenta la información. El ejemplo que mostramos no solo lo permite, el usuario puede elegir la plantilla completa, sino que trata de convencer de que en Internet contenido y diseño (distribución de esa información) van por separado.

Segundo: Feedback
Sitio web de ejemplo: Sony Style Lounge
http://www.sonystyle.com.mx/lounge/#
Comentario: Sony muestra una casa ideal equipada con sus productos. El hogar virtual permite que el usuario navegue, nunca mejor dicho, por la casa para que descubra con detalle cada uno de los elementos que Sony incorpora a nuestros hogares. Además de hacer publicidad encubierta en estas líneas mostramos un ejemplo claro de Feedback. El usuario recibe una respuesta de las acciones que realiza durante la navegación.

Tercero: Productividad
Sitio web de ejemplo: Guía Campsa
http://www.guiacampsa.com/
Comentario: La productividad consiste en la creación de contenido con una finalidad práctica. Guía Campsa permite planificar viajes con contenido personalizado. Esta información “estática” recorrido, rutas… se complementa con otra información dinámica como puede ser la información metereológica, gastos generales durante el viaje, etc.

Cuarto: Creatividad
Sitio web de ejemplo: Create a Character
http://images.southparkstudios.com/games/create/index.html
Comentario: La creatividad en la interactividad permite crear contenido creativo o artístico. Es el caso del ejemplo que presentamos que permite al usuario crear su propio usuario de South Park. No tiene utilidad alguna, únicamente procura estimular la imaginación y hace pasar un buen rato al usuario en la red.

Quinto: Adaptabilidad
Sitio web de ejemplo: Bloglines
http://www.bloglines.com
Comentario: La adaptabilidad consiste en permitir que el usuario controle la información de la que quiere disponer. Actualmente los especialistas en contenidos online están incidiendo mucho en este aspecto. Nuestro ejemplo, Bloglines ofrece al usuario un sistema con el que puede seguir las actualizaciones de de sus páginas preferidas.

Sexto: Comunicación
Sitio web de ejemplo: Mi pasado
http://www.mipasado.com
Comentario: Lo fundamental es la capacidad de establecer relaciones interactivas entre usuarios. Mi pasado es un buen ejemplo de ello. Cada persona se registra dentro de su centro de formación y puede buscar a antiguos compañeros con los que mantener conversaciones privadas, grupales, etc.

Como digo por ahí escribo a menudo en SimDalom.com. Esta es una nueva aventura en la que me embarco. Trataremos de mostrar el mundo en imágenes.

A pesar de lo que publiquemos normalmente esta bitácora es un campo de tiro para las prácticas de la asignatura de Diseño Audiovisual de la Facultad de Coimunicación de la Universidad de Navarra. Así que nos os extraéis si veis cosas que no tengan mucha relación con la temática de este sitio.