Multimedia 6

Arquitectura de la Información Proyecto Estadio Nacional.

2008-11-20T18:31:00.000-08:00

Inventario, Blueprint, Wireframes y Mockups para el sitio web del Estadio Nacional.

Get your own - Open publication

Proceso Visual, Parte Individual.

2008-11-10T14:52:00.000-08:00

Guión Gráfico y registro visual del Proyecto Estadio Nacional. Entrega individual.

Get your own - Open publication

Proceso Visual Estadio Nacional

2008-10-31T08:50:00.000-07:00

Registro visual, referencial y tipográfico del Estadio Nacional. Trabajo restringido por la razones que ya se informaron.

http://issuu.com/sleiva/docs/proceso_visual_estadio_nacional

Proyecto Hipermedia Estadio Nacional.

2008-10-22T19:45:00.000-07:00

Presentación del proyecto hipermedia sobre el Estadio Nacional, corregido y colocado en issuu.com.

http://issuu.com/sleiva/docs/proyecto_estadio_nacional

Presentación Proyecto Semestral, 1era Entrega

2008-10-16T16:21:00.000-07:00

Primera entrega de la Presentación del Proyecto Semestral del Estudio Trípode sobre el registro de información histórica, cultural y social del Estadio Nacional. Premisa Deporte, Cultura y Diseño. Publicado como siempre en issuu.com

http://issuu.com/sleiva/docs/presentacion_proyecto_entrega1

Manual de identidad

2008-10-16T16:19:00.000-07:00

Manual de Identidad del Estudio de Diseño Gráfico Trípode, vínculo issuu.com

http://issuu.com/sleiva/docs/manual_identidad

Entrega Test de Usabilidad en issuu.com

2008-10-13T21:56:00.000-07:00

Encargo Test de Usabilidad en issuu.com

http://issuu.com/sleiva/docs/test_usabilidad

Cuestionario Test de Usabilidad pt.2

2008-10-13T21:29:00.000-07:00

9.¿Se hace un uso correcto del espacio visual en las páginas del sitio?
R: El sitio es bastante ordenado y fácil de navegar. Jamás se rompe la estructura base, los párrafos y títulos siempre se mantienen en el mismo lugar, lo mismo sucede con las imágenes, aunque éstas últimas siempre mantengan el mismo formato. La única excepción de la coherencia visual en el sitio es la página de la Galería. Me agradó bastante la forma en que el menú se trasladó a la parte superior de la página para dejar espacio a la muestra de imágenes. Es un gran aporte.

10.¿Cómo es la disposición de los vínculos en todas las páginas del sitio?
R: No sólo la disposición es buena sino que también se encuentran destacados para mayor apreciación.
No molestan y no se encuentran insertos en medio de los párrafos, aunque no existen vínculos en palabras que lleven a otros artículos, y son totalmente predecibles.

11.¿Los vínculos que llevan a lugares dentro de las mismas páginas ayudan o entorpecen la navegación?
R: La mayoría de las veces se agradecen, sobre todo los que permiten "volver arriba". Sin embargo, los que llevan a los temas principales dentro de la página se encuentran flotando, sin previa explicación de lo que son, lo que se soluciona sólo haciendo click sobre ellos. Creo que al inicio del tema principal de la página debería ir una breve explicación sobre aquel "índice" de vínculos.

12.¿Existen enlaces rotos, equivocados o que no lleven a ninguna página?
R: No, ninguno en lo absoluto. Pero la sección de Mapa del Sitio no se encuentra disponible. Encuentro interesante el vínculo que lleva al Blog de bitácora del alumno, le da valor al trabajo y lo proyecta vinculandolo directamente con el trabajo de taller para que no resulte sólo como una simple entrega. Quizás faltó que los vínculos ya visitados mantuvieran un color distinto a los que no han sido abiertos.

13.¿Se ha controlado la longitud de las páginas del sitio?
R: En su mayoría, pero creo que algunas secciones siguen siendo un poco extensas. No estaría mal considerar una fragmentación de la información para distribuirla en dos o más páginas. Eso también ayudaría, como ya mencioné previamente en otras respuestas, a que el contenido se profundizara aún más. Creo que el mismo contenido se limitó exactamente para no extender la longitud de las páginas.

14.¿La sección de Descargas funciona correctamente, en cuanto a si la descarga es efectiva y el archivo es real?
R: Si y es notable. Las descargas funcionan como desde un servidor, el contenido de éstas es real y se agradece que aparte de que vengan comprimidas en .zip se ofrezca dentro de la misma página la descarga de este software.

15.¿Cómo es la experiencia en la visualización de las imágenes de la Galería?
R: Bastante fluída y cómoda. De hecho no muchas galerías en internet están conformadas de esta forma. Me refiero a que generalmente las imágenes son puestas sobre una página en blanco y nada más, pero aquí siempre existe una coherencia visual. Los vínculos ayudan bastante a la experiencia y lo que me llamó más la atención fue que al entrar a la página de alguna imagen la misma página se centra en la fotografía y no en la página desde el encabezado como ocurre normalmente.

16.¿Cómo es la velocidad de carga de las páginas y el sitio en general?
Muy rápida, aunque no sea desde un servidor. Pero parece ser que las páginas son bastante livianas por no tener elementos como animaciones flash o gifs.

Todas las respuestas fueron complementadas con los apuntes tomados a la par con el cuestionario efectuado durante el test y una posterior conversación con el usuario ayudó a concretar y afinar los comentarios para un mayor entendimiento a la hora de redactar este trabajo.

Cuestionario Test de Usabilidad pt.1

2008-10-13T21:20:00.000-07:00

Sitio Web : Más Helvética.
Sitio que recopila información
práctica e histórica sobre la
tipografía Helvética.
Usuario : Carla Salinas Rodríguez
Edad: 23 años.
Ocupación: Estudiante 3er año de
Diseño Industrial
Duoc UC San Carlos de Apoquindo.

1.¿Cuáles son los objetivos del sitio web? ¿Son concretos y bien definidos? ¿Los contenidos y servicios que ofrece se corresponden con esos objetivos?
R: Se denota la intención de proporcionar basta información sobre la tipografía llamada Helvética.
La unidad y selección de contenidos hace que los
objetivos del sitio sean concretos y definidos.
Los contenidos y servicios corresponden absolutamente con los objetivos, sin embargo éstos pudieron haber sido tratados en más profundidad y detalle.

2.¿El sitio se encuentra fácilmente accesible y
navegable?
R: Simple, práctico y agradable. No se encuentran presentes ni saturación ni ruido visual. Los menús están fácilmente ubicables y jerarquizados.
Quizás sea demasiado simple en cuanto a apariencia.

3.¿Existe un orden estructurado en como se presentan los contenidos de una página?
R: Absolutamente. No sólo en párrafos de texto sino que también al rotular los títulos con subtítulos que aluden a la idea principal de los contenidos de cada párrafo. El sitio en general es muy ordenado.

4.¿El texto en párrafos es adecuado para la lectura? En cuanto a tipografía, color, espaciado,
kerning y tamaño de fuente.
R: Texto en párrafo puede resultar un poco pesado. Quizás sea porque la tipografía Arial suele apretarse un poco cuando se utiliza en pantalla. El interlineado es cómodo para la lectura, aunque quizás un poco más no habría estado mal. Buen tamaño y color. Los subtítulos (H2) se pierden un poco debido a su gris claro. Cuesta leer los pie de foto debido al reducido tamaño, aunque se agradece su aporte.
La capitular y el comienzo de línea en versalitas se ve un poco raro y probablemente se vería mejor sin ella.

5.¿Los títulos de los menús son coherentes con los títulos y contenidos principales de las páginas?
R: Títulos coherentes y reales. Se agradecen los pequeños rotulados debajo de los títulos de los contenidos en el menú porque ayudan a la búsqueda de información y crean expectativas.

6.¿Existe un alto contraste entre color de fuente e imágenes con el fondo?
R: Bastante, de hecho gracias al fondo blanco el sitio se ve limpio, pulcro, fácil de leer y visualizar.

7.¿Los párrafos de texto son coherentes con la información asociada?
R: Sí, muy coherentes. No obstante, algunos temas están tratados de manera muy sintetizada y hace falta más profundización de éstos.

8.¿La caja de texto en los párrafos es lo suficientemente ancha?
R: Sí y no produce cansancio en la lectura. Además ayuda mucho que los párrafos no sean muy extensos y estén separados muchas veces por imágenes. Esto hace que la lectura sea más entretenida e interesante.

Entrega de Registro Visual de Ambientes

2008-09-30T06:40:00.000-07:00

Láminas de maquetación visual con los registros gráficos de los distintos ambientes relacionados con las fiestas patrias. Subido a issuu.com.

http://issuu.com/sleiva/docs/laminas_maq_ambiental

Parte 1 del Encargo 4, Proyección Personal

2008-09-15T22:05:00.000-07:00

Información sobre la Descripción del proyecto, Mapa de arquitectura de información, Wireframes y Mockups. Reunido en PDF y subido a issuu.com

http://issuu.com/sleiva/docs/proyeccion_personal

Vínculo Encargo nº3 en Issuuu.com

2008-09-02T07:33:00.000-07:00

http://issuu.com/sleiva/docs/analisis_sitios_web

Encargo 3 Análisis sitios web. Pt. 3 y final

2008-09-01T19:11:00.000-07:00

8. IGN (Imagine Games Network) (http://www.ign.com/)
Descripción: Sitio web norteamericano dedicado a los videojuegos para todas las consolas, cine, comics, deportes, automóviles y entretenimiento en general . Sirve principalmente de fuente noticiosa, desarrollo de análisis y revisiones de videojuegos, fechas de lanzamiento, recursos online y material multimedia.

a) Contenidos

– Coherencia del rotulado:
· Rotulados absolutamente coherentes con los contenidos y con las imágenes asociadas. No existen vínculos rotos, abandonados o con destinos equivocados.
· Los vínculos de los artículos y noticias se hayan sólo en los titulares y las imágenes asociadas.
· Los vínculos están tratados puntualmente y jamás insertos en medio de los párrafos.
· Además de algunas imágenes, dependiendo de su contexto, sólo textos como palabras, frases, titulares e íconos llevan vínculos.
· Los vínculos de hipertexto se prenden al poner el Mouse sobre ellos.
· Todas las imágenes de los artículos llevan vínculo.

- Lógica de navegación:
· La enorme cantidad de secciones hace que cada página también tenga una enorme cantidad de links, necesario debido al tipo de información y su cantidad. Puede resultar abrumante y confuso, pero al mismo tiempo proporciona un acceso total a toda su info desde cualquier página y sección gracias al orden y presencia de los menús en todas las páginas del sitio.
· La jerarquía de información va desde lo general hasta lo particular.
· Su navegación principalmente se hace a través de los encabezados, menús e imágenes. De ahí en adelante son los titulares y finalmente las etiquetas adicionales para los artículos.

-Consistencia del contenido:
· Los vínculos hacia los contenidos son puntuales y precisos.
· Contenidos reales, no simplemente asociados.
· No existen links rotos ni abandonados. El sitio se actualiza cada 12 horas.
· Titulares y resúmenes relacionados directamente con el contenido.
· Posee un banco para búsqueda de títulos, películas y comics por lista y organizados alfabéticamente.
· Las secciones y contenidos nuevos son destacados.

b)Diseño visual

- Estructura visual:
· El manejo de los espacios es notable, a pesar de la cantidad de información en pantalla.
· La presencia de publicidad molesta un poco y hace ver algo apretado al home.
· Existe una jerarquía de temas y secciones bien estructurada.
· El espaciado en los textos es adecuado para la lectura.
· Los colores, por lo general, no causan ninguna dificultad ni ruido en la lectura y visualización de la información y están asociados al tópico dependiendo de la sección.
· Existe un gran contraste entre info de secciones y diferenciación de información, en los rótulos, titulares y el texto en general.
· Maneja de forma adecuada las separaciones entre los tópicos, secciones y paneles.
· Contraste de texto+fondo bien aplicado.
· Orden y jerarquización general que ayuda a la lectura de info.
· Tipografía sans-serif (arial) de buen tamaño pero con poco interlineado.
· Coherencia visual entre homepage e interiores, a pesar de ligeros cambios gráficos en algunas secciones.
· Colores: Depende de las secciones y para los fondos de párrafos el blanco.

Detalles:
· Ranking de los videojuegos, películas y estrellas del momento.
· Descarga de documentos en PDF (guías estratégicas, revista digital, etc.).

9. Design Boom (http://www.designboom.com/eng/)
Descripción: Sitio web norteamericano dedicado casi en su totalidad al diseño industrial y en menor medida al diseño gráfico.

a) Contenidos

– Coherencia del rotulado:
· Rotulados coherentes con los contenidos y con las imágenes asociadas. No existen vínculos rotos, abandonados o con destinos equivocados.
· Los vínculos de los artículos y noticias se hayan sólo en los titulares y las imágenes asociadas.
· Los vínculos están tratados de manera demasiado general, pero nunca insertos en medio de los párrafos.
· Además de algunas imágenes, dependiendo de su contexto, sólo textos como palabras, frases y titulares llevan vínculos.
· Los vínculos de hipertexto se subrayan y cambian de color al poner el Mouse sobre ellos.

- Lógica de navegación:
· La navegación principal es a través del menú superior destacado en negro de donde se desprenden los tópicos relacionados. No obstante, la información destacada, como noticias y novedades, parece abarcar más atención que los menús.
· La jerarquía de información va desde lo general hasta lo particular, casi siempre tratada de manera general.

-Consistencia del contenido:
· Algunos títulos del menú principal son vagos y no dicen mucho.
· Los vínculos interiores hacia los contenidos son puntuales y precisos.
· Contenidos reales, no simplemente asociados. El contenido se actualiza
ocasionalmente.
· No existen links rotos ni abandonados.
· Titulares y resúmenes relacionados directamente con el contenido.

b) Diseño visual

- Estructura visual:
· El manejo de los espacios es decente, a pesar de la cantidad de información en pantalla.
· La jerarquía de temas y secciones no está muy bien estructurada.
· El tamaño de los textos es demasiado pequeño.
· Existe un decente contraste de color, aunque provenga en su mayoría de banners anuncios, imágenes, etc. Estos elementos finalmente son los que le dan vida y atractivo visual al sitio.
· El contraste entre info de secciones y diferenciación de información, en los rótulos, titulares y el texto en general no es bueno, falta manejo de tamaños y destacados.
· Contraste de texto+fondo bien aplicado.
· Tipografía sans-serif (arial) demasiado pequeña pero con buen interlineado.
· Coherencia visual entre homepage e interiores.
· Colores: Negro, amarillo y para los fondos de párrafos el blanco.

10. SII (http://www.sii.cl/)
Descripción: Sitio web del Servicio de Impuestos Internos de Chile.

a) Contenidos

– Coherencia del rotulado:
· Exceso uso de rotulados en el sitio, aunque coherentes con los contenidos y sin vínculos rotos, abandonados o con destinos equivocados.
· Todos los rótulos se encuentran subrayados y presentes en palabras, resúmenes y titulares.
· Los vínculos están tratados de forma puntual.
· Las páginas interiores no conservan la visualización del menú principal, lo que rompe la navegación fluída y ordenada.

- Lógica de navegación:
· La navegación es centralizada a través del menú principal con títulos destacados.
· La jerarquía de información solo se entiende por el destacado de los titulares y el acompañamiento de un ícono
· Su navegación principalmente se hace a través de la enorme cantidad de encabezados y menús.

-Consistencia del contenido:
· Contenidos reales, no simplemente asociados.
· Titulares relacionados con el contenido.
· No tiene Mapa del sitio. Error grave para un sitio que opera con tal información.
· La información está estructurada de manera de vínculos tras vínculos que entorpecen la navegación

b) Diseño visual

- Estructura visual:
· El logo en el home compite con banners ubicados a su costado.
· El manejo de los espacios es pésimo. El texto no está bien trabajado, se produce desorden, confusión y ruido en la lectura.
· Mal manejo tipográfico y de los espaciados (tipografía Bold en párrafos completos, ríos, mal interlineado, etc.).
· Rótulos subrayados para resúmenes completos, y el abuso de esta opción aparente de vínculo.
· Existe una jerarquía de temas pobremente estructurada y confusa.
· Insuficiente contraste entre secciones.
· Maneja pobremente las separaciones entre los tópicos, secciones y paneles.
· Contraste de texto+fondo bien aplicado.
· Tipografía sans-serif con mala legibilidad debido a su disposición.
· No hay coherencia visual entre homepage e interiores.
· Mala selección de colores. No denotan ni connotan nada.
· Colores: Gris, anaranjado y blanco para los fondos.

Encargo 3 Análisis sitios web. Pt. 2

2008-09-01T19:07:00.000-07:00

5. Unesco (http://www.unesco.org/)
Descripción: Sitio web de la Organización de las Naciones Unidas para la Educación, la Ciencia y la Cultura.

a) Contenidos

– Coherencia del rotulado:
· Rotulados coherentes con los contenidos y con las imágenes asociadas. No existen vínculos rotos, abandonados o con destinos equivocados.
· Los vínculos de los artículos y noticias se hayan sólo en los titulares y las imágenes asociadas. También es común encontrar el vínculo completo al artículo a partir de un rótulo adicional. (MÁS)
· Los vínculos están tratados puntualmente y jamás insertos en medio de los párrafos.
· Además de algunas imágenes, dependiendo de su contexto, sólo textos como palabras, frases y titulares llevan vínculos.
· Los vínculos de hipertexto se subrayan al poner el Mouse sobre ellos.

- Lógica de navegación:
· El menú principal se ubica al costado izquierdo. Cada titular con su menú de contenidos. Permite conocer de qué se trata cada tema central mostrando los tópicos relevantes.
· La jerarquía de información va desde lo general hasta lo particular.
· Su navegación principalmente se hace a través de los encabezados, menús e im. De ahí en adelante son los titulares y finalmente las etiquetas adicionales para los artículos.

-Consistencia del contenido:
· Existen secciones que al entrar cambian drásticamente el diseño de información general que maneja el sitio. Desaparecen menús y rótulos relacionados.
· A pesar de seleccionar el sitio para el lenguaje en español, muchas de las noticias destacadas siguen en inglés.
· Algunas secciones principales sólo están disponibles en algunos idiomas, con menor selección de éstos que en el homepage. De hecho, un par de secciones principales sólo se encuentran en inglés.
· Los vínculos hacia los contenidos son puntuales y precisos, pero no respetan la configuración del idioma.
· Ocasionalmente la configuración del idioma se resetea al entrar a alguna sección.
· Contenidos reales, no simplemente asociados.
· No existen links rotos ni abandonados.
· Titulares y resúmenes relacionados directamente con el contenido.

b) Diseño visual

- Estructura visual:
· El manejo de los espacios es decente, pero utiliza demasiado texto y poca imagen.
· Existe una jerarquía de temas y secciones bien estructurada.
· Los colores, por lo general, no causan ninguna dificultad ni ruido en la lectura y visualización de la información.
· Existe un moderado contraste entre secciones y diferenciación de información, en los rótulos, titulares y el texto en general.
· Maneja de forma adecuada las separaciones entre los tópicos, secciones y paneles.
· Contraste de texto+fondo bien aplicado.
· Orden y jerarquización general que ayuda a la lectura
· Tipografía sans-serif (arial). Falta mayor interlineado para mejor legibilidad.
· No existe una coherencia visual sólida entre homepage e interiores. La mayoría secciones principales conservan el aspecto visual pero cambian su color. Sin embargo, esto se excede en algunos casos en donde algunas secciones cambian no sólo el color sino el diseño en general eliminando la coherencia con el home.
· Colores: Azul, verde, rojo, amarillo, púrpura, negro y blanco para los fondos de párrafos.

Detalles:
· El mapa del sitio se estructura en orden alfabético, basándose en los portales del sitio, en vez de ordenarse a manera de vínculos. Es demasiado complejo y confuso.

6. Red Clínica (http://www.redclinica.cl/)
Descripción: Sitio web del Hospital Clínico de la Universidad de Chile.

a) Contenidos

– Coherencia del rotulado:
· Rotulados coherentes con los contenidos y con las imágenes asociadas. No existen vínculos rotos o abandonados.
· Los vínculos de los artículos y noticias se hayan sólo en los titulares y rótulos adicionales (VER MÁS+).
· Los vínculos están tratados puntualmente y nunca insertos en medio de los párrafos.
· Sólo textos como palabras, frases y titulares llevan vínculos.
· Los vínculos de hipertexto se encuentran subrayados.
· Los vínculos pueden ser títulos o resúmenes.
· Ninguna imagen, de las poca que posee, lleva vínculo.

- Lógica de navegación:
· El menú principal es el conector central del sitio y en cada uno de sus títulos despliega sub-menús con la información pertinente. Esto denota una cierta organización y orden que en la práctica funciona bien.
· Al costado izquierdo se hayan los menús de servicios, contactos y archivos. Organizados y tratados de manera separada al contenido principal.
· La jerarquía de información no obedece una jerarquía establecida. La información se divide por áreas de interés. · Su navegación principalmente se hace a través de los encabezados y menú. De ahí en adelante son los titulares y finalmente las etiquetas adicionales para los artículos.

-Consistencia del contenido:
· Los vínculos hacia los contenidos son puntuales y precisos.
· Contenidos reales, no simplemente asociados.
· Contenido muchas veces pobre, sobre todo para tratarse de un sitio de importancia vital y hospitalario.
· La información de sus tópicos con frecuencia es demasiado sintetizada, poco profunda y carente de detalles técnicos.
· No existen links rotos ni abandonados. Sin embargo, algunas secciones no tienen contenido y se presenta una página en blanco, como Video y el Banco de imágenes.
· Titulares y resúmenes relacionados con el contenido tratado.
· Mapa del sitio incompleto y confuso.
· Poco tratado de imágenes y material visual.
· No tiene vínculos a otras instituciones o fuentes relacionadas.

b)Diseño visual

- Estructura visual:
· El sitio no se encuentra centrado.
· El manejo de los espacios es bueno, a pesar de la cantidad de información.
· Existe un posicionamiento de temas y secciones muy bien estructurado.
· El espaciado en los textos es adecuado para la lectura.
· Los colores no causan dificultad en la lectura y visualización de la información.
· Existe un gran contraste entre info de secciones y diferenciación de información, en los rótulos, titulares y el texto en general.
· Maneja de forma adecuada las separaciones entre los tópicos, secciones y paneles.
· Contraste de texto+fondo bien aplicado.
· Tipografía sans-serif (arial) de cuerpo demasiado pequeño para el rubro del sitio.
· Coherencia visual entre homepage e interiores.
· Colores: Azul, verde y blanco para los fondos. Coherentes con su identidad corporativa y su concepto.

Detalles:
· Tiene a disposición un diccionario médico muy completo en términos sin manejar significados altamente científicos para un mayor entendimiento general. No obstante, serían útiles algunos vínculos dentro de su contenido.
· Se encuentra disponible la versión digital de la revista del Hospital vía descarga directa en PDF. Se destaca la opción de descargar la revista por capítulos.

7. Mineduc (http://www.mineduc.cl/)
Descripción: Sitio web del Ministerio de Educación de Chile.

a) Contenidos

– Coherencia del rotulado:
· Rotulados coherentes con los contenidos. No existen vínculos rotos, abandonados o con destinos equivocados.
· Los vínculos de los artículos y noticias se hayan sólo en los titulares y rótulos adicionales (IR A NOTICIA).
· Sólo textos como palabras, frases y titulares llevan vínculos.
· Los vínculos están tratados de forma general sin detalle.
· Sólo los titulares llevan vínculos.
· Algunos vínculos de hipertexto, como el menú principal, se subrayan al poner el Mouse sobre ellos. Otros de contenido interior se encuentran permanentemente subrayados.
· Vínculos a través de íconos (sobre, teléfono, etc.) envían aparentemente a otro sitio con información incoherente con los vínculos iniciales.
· Los vínculos del menú principal no están destacados y son de un cuerpo demasiado pequeño para denotar la función que cumplen.
· Las páginas interiores no conservan la visualización del menú principal, reemplazándolos por tópicos relacionados al artículo en cuestión, lo que rompe la navegación fluída y ordenada.
· Ninguna imagen, de las poca que se encuentran, lleva vínculo ni están rotuladas.
· Vínculos de Inicio, Búsqueda, Contacto y Mapa del Sitio no se ven y pasan desapercibidos (sin destacar, demasiado pequeños y ubicados en la parte inferior de las páginas).

- Lógica de navegación:
· La navegación se hace a través del menú principal al costado izquierdo. Al pinchar cada título despliega sub-títulos para los contenidos.
· Existe cierta jerarquía de información, pero la desaparición del menú principal en páginas interiores causa un grave desorden de ésta información.
· Su navegación principalmente se hace a través de los encabezados y menús.
· Navegación interrumpida por vínculos sin destacar y muy pequeños (incio, contacto, etc.).

-Consistencia del contenido:
· Los vínculos hacia los contenidos son tratados de manera demasiado general.
· Contenidos reales, no simplemente asociados.
· No existen links rotos ni abandonados.
· Titulares relacionados con el contenido.
· Completo Mapa del sitio pero con tópicos sin contenido desplegable, que es la idea de la existencia del Mapa.
· No existe página de galería. Ocasionalmente se agregan algunas imágenes en relación a la noticia.
· Contenido muchas veces pobre, sobre todo para tratarse de un sitio de importancia vital.
· Poco tratado de imágenes y material visual.

b) Diseño visual

- Estructura visual:
· El manejo de los espacios es pobre. Demasiado espacio en blanco y sin utilizar.
· Pésimo manejo tipográfico y de los espaciados (tipografía Bold en párrafos completos, ríos, mal interlineado, etc.)
· Existe una jerarquía de temas pobremente estructurada. Titulos del menú principal de poco tamaño y sin destacar.
· El espaciado en los textos no es adecuado para la lectura.
· Exceso de banners multicolores no son un buen aporte visualmente. Causan ruido y confusión, aparte de abaratar el diseño del sitio.
· No existe contraste entre info de secciones.
· Maneja de pobremente las separaciones entre los tópicos, secciones y paneles.
· Contraste de texto+fondo bien aplicado.
· Tipografía sans-serif (arial) con mala legibilidad y cuerpo demasiado pequeño.
· Coherencia visual entre homepage e interiores. A excepción de la sección 600 Mineduc.
· Colores: Azul y para los fondos de párrafos el blanco.

Encargo 3 Análisis sitios web. Pt. 1

2008-09-01T18:55:00.000-07:00

El encargo consistió en el análisis de 10 sitios web a partir de una pauta entregada con anteriodidad en clases y a través del blog de Taller. El criterio para la selección de los sitios se basó en: sitios de frecuente visita personal y sitios dentro del área de importancia vital (ministerios, bancos, salud, etc.).

He aquí el análisis en bruto (sólo texto y sin sintetizar):

1. GameSpot (http://www.gamespot.com/)
Descripción: Sitio web norteamericano dedicado en su totalidad a los videojuegos para todas las consolas, plataformas y géneros. Sirve de fuente noticiosa, desarrollo de análisis y revisiones de videojuegos, fechas de lanzamiento, recursos online y material multimedia.

a) Contenidos

– Coherencia del rotulado:
· Rotulados absolutamente coherentes con los contenidos y con las imágenes asociadas. No existen vínculos rotos, abandonados o con destinos equivocados.
· Los vínculos de los artículos y noticias se hayan sólo en los titulares y las imágenes asociadas. También es común encontrar el vínculo completo al artículo a partir de un rótulo adicional (REVIEW, READ, WATCH, FULL ARTICLE, SEE MORE).
· Los vínculos están tratados puntualmente y jamás insertos en medio de los párrafos.
· Además de algunas imágenes, dependiendo de su contexto, sólo textos como palabras, frases y titulares llevan vínculos.
· Los vínculos de hipertexto se subrayan al poner el Mouse sobre ellos.

- Lógica de navegación:
· La enorme cantidad de secciones hace que cada página también tenga una enorme cantidad de links, lo que en este caso se hace necesario debido al tipo de información y su cantidad. Puede resultar abrumante y confuso, pero al mismo tiempo proporciona un acceso total a toda su info desde cualquier página y sección.
· La jerarquía de información va desde lo general hasta lo particular.
· Su navegación principalmente se hace a través de los encabezados, menús e im. De ahí en adelante son los titulares y finalmente las etiquetas adicionales para los artículos.

-Consistencia del contenido:
· Los vínculos hacia los contenidos son puntuales y precisos.
· Contenidos reales, no simplemente asociados.
· No existen links rotos ni abandonados. El sitio se actualiza cada 12 horas.
· Titulares y resúmenes relacionados directamente con el contenido.
· No posee un banco para búsqueda de títulos por lista y organizados alfabéticamente.

b) Diseño visual

- Estructura visual:
· El manejo de los espacios es notable, a pesar de la cantidad de información en pantalla.
· Existe una jerarquía de temas y secciones muy bien estructurada.
· El espaciado en los textos es adecuado para la lectura.
· Los colores, por lo general, no causan ninguna dificultad ni ruido en la lectura y visualización de la información. Puede ser que algunos colores no sean los adecuados para el concepto y contenidos que trata el sitio.
· Existe un gran contraste entre info de secciones y diferenciación de información, en los rótulos, titulares y el texto en general.
· Maneja de forma adecuada las separaciones entre los tópicos, secciones y paneles.
· Contraste de texto+fondo bien aplicado.
· Orden y jerarquización general que ayuda a la lectura
· Tipografía sans-serif (arial) con buena legibilidad y espacio interlínea.
· Coherencia visual entre homepage e interiores.
· Colores: Negro, gris, café-rojizo, para los fondos de párrafos el blanco.

Detalles:
· Se puede cambiar el tema (color de fondo).
· Ranking de los videojuegos del momento.

2. FontShop (http://www.fontshop.com/)
Descripción: Sitio web que parece sólo dedicarse a la venta de tipografías online. Sin embargo, también es una gran base de información para el diseño gráfico y tipográfico.

a) Contenidos

– Coherencia del rotulado:
· Rotulados coherentes con los contenidos y con las imágenes asociadas. No existen vínculos rotos, abandonados o con destinos equivocados.
· Títulos de menús precisos y concisos.
· Existen gran cantidad de vínculos en imágenes, generalmente debido a las muestras de tipografías que se hacen en el sitio para que los vínculos sean atractivos y coherentes.
· Los vínculos de los artículos y noticias se hayan en los titulares, resúmenes e imágenes asociadas. También es común encontrar el vínculo completo al artículo y/o producto partir de un rótulo adicional (como el nombre de la tipografía, el diseñador, etc).
· Los vínculos están tratados puntualmente y jamás insertos en medio de los párrafos.
· Además de algunas imágenes, dependiendo de su contexto, sólo textos como palabras, frases y titulares llevan vínculos.
· Algunos vínculos de hipertexto se subrayan al poner el Mouse sobre ellos, mientras que otros cambian de color e incluso algunos títulos no muestran ningún cambio.

- Lógica de navegación:
· El sitio posee muchos menús y se encuentra muy seccionada. Carga con menús laterales (izq. y der.), superiores y extremo laterales. Puede resultar abrumante y confuso, pero al mismo tiempo proporciona un acceso total a toda su info desde cualquier página y sección.
· La jerarquía de información va desde lo general hasta lo particular. De nuevos anuncios a la venta de tipografías
· Su navegación principalmente se hace a través de los encabezados, menús e imágenes, siendo estos últimos de gran importancia ya que muchas veces simulan ser textos. De ahí en adelante son los titulares y finalmente las etiquetas adicionales para los artículos.

b) Diseño visual

- Estructura visual:
· Buen manejo de espacio a pesar de la cantidad de menús.
· Existe una jerarquía de temas y secciones bien estructurada.
· El espaciado en los textos es adecuado para la lectura.
· El cuerpo de los textos es pequeño y se resaltan en gran tamaño sólo las tipografías de muestra para su venta (imágenes).
· Los colores no causan ninguna dificultad ni ruido en la lectura y visualización de la información. El uso del amarillo como identidad visual diferencia a este sitio notablemente de los demás, tendiendo claro éxito en crear una identidad de marca.
· Existe un gran contraste entre secciones y diferenciación de información, en los rótulos, titulares y el texto en general.
· Maneja de forma adecuada las separaciones entre los tópicos, secciones y paneles.
· Contraste de texto+fondo bien aplicado.
· Orden y jerarquización general que ayuda a la lectura
· Tipografía sans-serif en pequeños cuerpos con buena legibilidad y espacio interlínea.
· Notable coherencia visual entre homepage e interiores.
· Colores: Amarillo,negro, gris, para los fondos de párrafos el blanco.

Detalles:
· Ranking de las tipografías más populares.

3. Falabella (http://www.falabella.com/)
Descripción: Sitio web de la tienda Falabella. Posee catálogo y compra en línea, además del manejo de cuentas por tarjeta de débito.

a) Contenidos

– Coherencia del rotulado:
· Los rotulados son coherentes con los contenidos y las imágenes. No existen vínculos rotos, abandonados o con destinos equivocados. Sin embargo, al entrar en algunas secciones estas no conservan un menú completo para acceder a otros catálogos relacionados.
· El botón Atrás del navegador con frecuencia es inútil para volver a la página anterior, teniendo que hacer dos click en éste para volver.
· Los vínculos de los artículos y secciones se hayan sólo en los títulos y los nombres de los productos.
· Los vínculos suelen ser poco precisos y están tratados de manera general llevando a otros menús utilizando demasiadas páginas de acceso.
· Además de algunas imágenes, dependiendo de su contexto, sólo textos como palabras, frases y titulares llevan vínculos.
· Los vínculos de hipertexto no presentan cambios al poner el Mouse sobre ellos.
· Mala descripción de algunos productos destacados o en catálogos, sin siquiera mostrar la marca de éstos.

- Lógica de navegación:
· La enorme cantidad de secciones hace que cada página también tenga una enorme cantidad de links, lo que en este caso se hace necesario debido al tipo de información y su cantidad. Se vuelve bastante confuso al tener 2 menús que dirigen prácticamente a los mismos departamentos.
· La jerarquía de información con frecuencia no es buena y muchos indicadores y paneles de info se repiten causando confusión.
· Su navegación principalmente se hace a través de los encabezados y menús.
· Es difícil predecir la lógica de navegación debido a la saturación de menús y títulos similares.

-Consistencia del contenido:
· La actualización de cuentas y créditos no es diaria, pero su creación y acceso es sencillo y claro.
· En el sitio no se muestran todos los productos y servicios que ofrece la tienda en su lugar físico.
· Las especificaciones de algunos productos es incompleta y confusa, se hacen falta vínculos
· Los vínculos hacia los contenidos con frecuencia no son puntuales ni precisos.
· Contenidos reales o simplemente asociados.
· No existen links rotos ni abandonados.
· Titulares y resúmenes relacionados directamente con el contenido.
· Vínculos de las imágenes algo pobres.

b) Diseño visual

- Estructura visual:
· A pesar de tener colores limpios, el ruido visual que provocan los anuncios y banner de productos destacados y ofertas, sobre tofo en el home, provoca un desorden en la información central.
· El manejo de los espacios es decente en la mayoría de las páginas, a pesar de la cantidad de información en pantalla.
· Exceso de banners que vinculan a secciones que ya están indicadas en el menú principal entorpece la navegación y causa confusión.
· Existe una jerarquía de temas y secciones que no están muy bien estructuradas. Faltan productos y variedad de información.
· El espaciado en los textos es adecuado para la lectura.
· Los colores no causan ninguna dificultad ni ruido en la lectura y visualización de la información.
· Existe contraste entre secciones y diferenciación de información, en los rótulos, titulares y el texto en general.
· Maneja de forma tímida y sobria las separaciones entre los tópicos, secciones y paneles. Es común que algunas puedan pasar desapercibidas.
· Contraste de texto+fondo bien aplicado.
· Tipografía sans-serif (arial) de cuerpo muy pequeño.
· Coherencia visual entre homepage e interiores.
· Colores: Verde y blanco para los fondos.

4. El Mercurio Online (http://www.emol.cl/)
Descripción: Sitio web del diario El Mercurio.

a) Contenidos

– Coherencia del rotulado:
· Rotulados absolutamente coherentes con los contenidos y con las imágenes asociadas. No existen vínculos rotos, abandonados o con destinos equivocados.
· Los vínculos de los artículos y noticias se hayan sólo en los titulares y las imágenes asociadas. También es común encontrar el vínculo completo al artículo a partir de un rótulo adicional.
· Los vínculos están tratados puntualmente y jamás insertos en medio de los párrafos.
· Además de algunas imágenes, dependiendo de su contexto, sólo textos como palabras, frases y titulares llevan vínculos.
· Los vínculos de hipertexto se subrayan y cambian de color al poner el Mouse sobre ellos.

- Lógica de navegación:
· A pesar de la gran cantidad de secciones el menú principal hace que la navegación se efectúe de manera rápida, cómoda y ordenada, gracias a su buena estructuración.
· La jerarquía de información va desde lo general hasta lo particular. Desde las noticias destacadas del día hasta noticias de menor índole.
· Su navegación principalmente se hace a través de los encabezados, menús e imágenes. De ahí en adelante son los titulares y finalmente las etiquetas adicionales para los artículos.
· El menú principal hace de conector entre todas las secciones y páginas del sitio.

-Consistencia del contenido:
· Los vínculos hacia los contenidos son puntuales y precisos.
· Los vínculos hacia las noticias son dirigidos a una página especial y completa para ella en html.
· Contenidos reales y directamente asociados.
· No existen links rotos ni abandonados. El sitio se actualiza a diario.
· Titulares y resúmenes relacionados directamente con el contenido.
· En los paneles de noticias de las secciones principales, hacen falta algunas imágenes para complementar la noticia y no se convierta en un panel de sólo texto.

b) Diseño visual

- Estructura visual:
· El sitio no se encuentra centrado.
· El título principal (marca) no compite con banners publicitarios.
· El manejo de los espacios es notable, a pesar de la cantidad de información en pantalla.
· Existe una jerarquía de temas y secciones muy bien estructurada.
· El espaciado en los textos es adecuado para la lectura.
· Los colores, por lo general, no causan ninguna dificultad ni ruido en la lectura y visualización de la información.
· Existe un gran contraste entre info de secciones y diferenciación de información, en los rótulos, titulares y el texto en general.
· Maneja de forma adecuada las separaciones entre los tópicos, secciones y paneles.
· Contraste de texto+fondo bien aplicado.
· Orden y jerarquización general que ayuda a la lectura
· Tipografía sans-serif de cuerpo regulable en los artículos para los párrafos, con buen interlineado, y con Serif de gran tamaño y de distinto color para los titulares. Esto produce una excelente legibilidad.
· Coherencia visual entre homepage e interiores.
· Colores: Azul, negro y blanco para los fondos.

Detalles:
· Además de las opciones de Imprimir y Enviar por e-mail, se puede regular el tamaño del texto en los párrafos de noticias.

Publicación de Multimedia 6

2008-08-25T18:47:00.000-07:00

Inicio del Blog Multimedia 6 para el alojamiento de proyectos para el Taller de Diseño Gráfico VI del Instituto Profesional Duoc UC.