Caso de estudio: HBO

De Casiopea



TítuloCaso de estudio: HBO
Período2013-2013
AsignaturaConstrucción de Diseño Gráfico 4
Del CursoConstrucción 4º DG 2013
CarrerasDiseño Gráfico
Alumno(s)Karla Vargas
ProfesorKatherine Exss
PDFArchivo:Presentacion HBO .pdf
URLhttp://www.hbomax.tv/

Datos Generales

HBO (acrónimo de Home Box Office) es una cadena de canales de televisión por cable y satélite. Se encuentra presente en alrededor de 150 países. HBO International posee variados canales hermanos en Latinoamérica tales como HBO 2, HBO Plus, HBO Family, HBO Signature, HBO On demand, MAX, Cinemax y MaxPrime.

En estados unidos existen los canales hermanos HBO2, HBO Comedy, HBO Family, HBO Latino, HBO Signature, HBO Zone, HBO The Works. Para Asia existen los canales HBO Asia, HBO South Asia, HBO Family, HBO Hits, HBO Signature, Cinemax Asia.

En Europa central cuenta con los canals HBO y Cinemax. Paralelamente HBO cuenta con sus servicios HBO On Demand y HBO GO.

Arquitectura Visual de Marca

Los distintos canales de HBO se estructuran como parte de un todo a través de las múltiples variaciones en el patrón básico del logotipo de HBO como gran cadena.

Es interesante constatar como dos canales que entregan el mismo concepto de programación varían en su logo por pertenecer a continentes diferentes. Tal es el caso de HBO Family para Asia y América. El público no difiere en términos etarios sino demográficos. Lo mismo sucede con Cinemax.

Familia de logotipos de HBO

Macroentorno Web

Debido a la amplia cantidad de canales que HBO ofrece, como cadena y en distintos países del mundo, esta funciona con variados sitios cuyos criterios de información y organización difieren. En primer lugar existen tres grupos continentales donde se agrupa uno varios sitios web. En lo que respecta a América Latina y Asia el sitio matriz permite en sí mismo y su interfaz el acceso a la información de todos los canales ofrecidos dentro de aquel grupo continental.

Caso Latinoamérica

Vista de dos secciones del sitio de HBO latinoamericano. La primera vista corresponde al canal HBO y la segunda a Cinemax

Vistas del sitio http://www.hbomax.tv/ perteneciente a la región de Latinoamérica. A través de una barra de navegación el usuario puede acceder a la información de los distintos canales.

Caso Asia Norte

El caso Asia Norte. Vista de dos partes del sitio. La primera vista corresponde a HBO. La segunda vista corresponde a HBO Signature

Muy similar es el caso de Asia Norte. http://www.hboasia.com. Se aprecia a grandes rasgos la misma ordenanza lógica con la barra para navegar por los diversos canales a la cabeza.

Caso Asia Sur

El caso Asia Sur. Vista de dos partes del sitio. La primera vista corresponde a HBO. La segunda vista corresponde a HBO Defined

El caso de HBO Asia Sur mantiene varias similitudes con su contraparte Asia Norte. http://www.hbosouthasia.com/ La navegación de los canales principales, no obstante se desplaza hasta el footer. Esto se debe seguramente a que se trata de solo dos canales anexos.

Caso Noteamérica

Vista del sitio matriz de HBO en estados unidos. Vista primera: home. Vista segunda: Ventana principal de “About HBO”. Tercera vista: HBO international

El Caso más irregular es el de Norteamérica http://www.hbo.com/#/index.html/. Este es concedido como el sitio web Matriz de HBO a nivel mundial no obstante es defectuoso en cuando a accesibilidad al resto de la cadena de canales. En un tercer nivel del sitio http://www.hbo.com/#/about/faqs/international.html se presentan los vínculos a cada uno de los sitios web de las áreas continentales correspondientes. Sin embargo la manera en que se presentan pasa prácticamente desapercibida.

En términos de estructura visual y en contenidos también difiere notoriamente de sus pares asiáticos y latinos.

HBO Latino, HBO Family y Cinemax, todos del territorio estadounidense, se configuran de forma absolutamente independiente. No existe entre estos sitios un elemento de navegación que los vincule. Tampoco obedecen entre sí a las mismas leyes de estructura. Son incluso, en algunos casos, radicalmente diferentes.

Vista comparativa del estilo de HBO family versión norteamericana y HBO family versión latinoamericana

El caso más radical es el de HBO family en relación con HBO. Resulta mucha más radical apreciar la resolución de lo mismo pero en la versión Latinoamericana.

Home del sitio norteamericano de Cinemax

El sitio de Cinemax cuenta con su propia solución de diseño y está absolutamente desprovisto de cualquier elemento que lo identifique como parte de la red de canales de HBO.

Caso Europa

El caso europeo difiere también en forma notoria con el resto de los casos. Esta diferencia no solo radica en la forma sino que también en el contenido. Mientras que el resto de los sitios de HBO en el mundo se empeñan en mostrar la programación, HBO Europe está centrado en información institucional de carácter general. Es por ejemplo el único sitio donde se relata la historia de HBO como empresa.

Contenidos prácticamente invisibles en los otros sitios, tales como la misión o la infraestructura técnica, se encuentran en el home. Tampoco se especifica la programación de forma extensa, se habla de ella en términos generales. Con contenidos únicos como “why viewers choose HBO” entre otros da la impresión de HBO es neófito en el mercado europeo y quiere más que nada darse a conocer de momento.

Home del sitio europeo de HBO
Sección "Why viewers choose HBO" en el sitio de HBO europeo

Caso particular de estudio (HBO Latinoamérica)

Como es posible apreciar, HBO es una cadena que cuenta con numerosos casos en la web llenos de particularidades.

A continuación el estudio se centra en el caso del sitio de HBO en Latinoamérica. Se escoge este caso porque posee más contenidos y en definitiva más complejidad. El sitio de HBO Latinoamérica se caracteriza por englobar la programación e información de doce canales de la cadena.

Cuenta además con otros contenidos interesantes de analizar como formularios, contenidos interactivos y fichas descriptivas de series y películas.

Estructura de los contenidos

mapa de los contenidos principales del sitio correspondientes a las dos barras de navegación.

Niveles jerárquicos de contenido

Barras de navegación principales

El sitio web cuenta con dos barras de navegación principales. Cada barra de navegación posee un criterio específico según el cual el usuario puede navegar. Esta el menú de navegación por canales que incorpora nueve canales de la cadena y existe además un menú de acciones generales transversal a todos los canales.==

Elementos en segundo nivel

En un segundo nivel después del home están los sitios contenidos en las dos barras de navegación principal. Cada canal constituye un sub-sitio y lo mismo sucede con las secciones propuestas en la barra de navegación general.

Esquema explicativo de las dos tipologías principales de sub-sitios que surgen de las barras de navegación

Existe un subnivel creado para aquellas series o películas destacadas. Se trata de una ficha personalizada de la cual se puede acceder mediante el home.

Acceso de sub-sitio con una ficha de la serie destacada a través del home

Elementos en tercer nivel

En el caso del menú por canales todos poseen la opción de acceder a un tercer nivel donde se ve la programación en detalle.

Archivo:Sub sitio programación family .jpg
Cada sub-sitio de canal posee a su vez una sección donde revisar la programación

Otro subnivel a considerar son las fichas de series. Acceder a ellas es posible a través de las páginas de los canales, en las secciones donde se muestra contenido destacado. Otro modo de acceder a dicho contenido es en las opciones películas y series del menú principal.

Sub-sitio ficha de contenidos accedido a través del home

También está el subnivel correspondiente a una noticia al cual se accede seleccionando una noticia en particular de la sección general “noticias”.

Fragmentos de listado y detalle de una noticia

Estructura espacial

A continuación se analizan y contrastan los distintos casos de organización de contenidos dentro del sitio. Se identifican los contenidos en secciones variables y secciones estáticas.

Se denomina elementos estáticos a todos aquellos elementos de navegación o tipos de información que se encuentran presentes en todas las páginas ya sean estos tablas, barras, recuadros etc. Dichos elementos pueden quizás cambian sus aspecto o colores pero siguen en el mismo lugar y cumpliendo las mismas funciones.

Elementos variables son por el contrario aquellos que caracterizan a aquella sección de particular. Puede tratarse de un recuadro de formulario un recuadro de texto o un listado se series destacadas entre otros.

Global

Elementos Estáticos en todas las páginas

Los elementos estáticos en todas las páginas son los del header. En el header se ubican ambas barras de navegación, un login, un motor de búsqueda y un selector de país.

Archivo:Elementos estáticos en todos.jpg
Imagen donde se aprecian tres tipos de secciones diferentes encabezadas por una serie de elementos que se mantienen presentes a lo largo de todo el sitio.

Sitios tipo canales

Elementos estáticos en las páginas de canales

En los sitios que corresponden a los canales se añaden otros elementos estáticos propios de esta tipología de contenido. Entre ellos cabe destacar que se encuentra el footer que el caso anterior no es un elemento siempre igual.

Archivo:Elementos variables y estáticos canales.jpg
Comparativa de dos sitios de canales diferentes donde se identifican los elementos comunes y los variables en bloques.
Archivo:Detalle elementos estáticos de canales.jpg
Esquema descriptivo de los elementos que forman parte del header.
Excepciones

HBO GO si bien esta dentro de la barra de canales no es precisamente un canal. Es por ello que sus contenidos difieren de los otros canales siendo esta la única excepción. En HBO OD, que es un canal cuya programación no es fija, no incluye las secciones relacionadas con programación reciente.

Cambios de estilo según canal

Como se menciona anteriormente los elementos estáticos se bien existen en todos los canales sufren a veces cambios de estilo. A continuación se revisan algunos ejemplos.

Ejemplo 1

En el siguiente ejemplo se aprecian dos elementos. Uno es la leyenda que describe el contenido destacado como imagen principal. A su lado se ven los botones que sirven para manejar el cambio de las imágenes. Debajo se ve la barra de redes sociales y de menú de programación.

La tipografía se mantiene pero el color puede cambiar. Los botones se mantienen iguales mientras que el color de la barra inferior se modifica. Por su parte el recuadro donde se ubica la leyenda de la imagen se mantiene en transparencia.

Hay una inconsistencia en este caso ya que los rótulos inicio y programación se presentan en algunos casos en minúsculas sin razón aparente.

Archivo:Pomparación de estilos de menú.jpg
Comparativa de tres barras correspondiente a distintos canales
Ejemplo 2

Esta sección cambia sus colores y su tipografía.

Recuadros de programación actual vistos en tres canales diferentes

Elementos variables en las secciones de canales

A continuación se revisan algunos ejemplos para observar cómo se constituye el contenido principal o variable en cada canal. Dentro de estos cambios se identifican dos motivos posibles, por exigencias del contenido y por negligencia en el diseño.

El primer ejemplo evidencia que no en todos los sitios están los mismos elementos. Hay algunos que se mantienen, otros que desaparecen y otros que son propios de tan solo un sitio en particular. “función family” es por ejemplo una sección que tan solo existe en HBO family.

Así mismo no todos los sitios incluyen destacados. En general no existe una norma de contenidos mínimos y tampoco una norma en su presentación.

En este ejemplo se aprecia que no en todos los sitios se presentan los mismos elementos
Comparativa de los elementos presentes en el cuerpo de tres sitios de canales

Analizando por ejemplo la forma en que se exponen los destacados en tres sitios diferentes queda claro que existe menos norma en los casos anteriormente vistos. En el primer ejemplo no existe siquiera un rótulo que identifique el contenido como destacado. Se trata de una inconsistencia claramente. En los dos siguientes la forma de titular difiere en todo sentido.

Con respecto a los elementos dentro del recuadro todos se tratan de películas o series sin embargo se presentan de manera completamente distinta. En el ejemplo segundo, por ejemplo, tiene imágenes circulares con un filtro naranjo. El ejemplo tercero es el púnico que tiene descripciones en cada ítem.

Tampoco muestran similitud en el numero de columnas o proporción dentro del sitio, en definitiva se trata de un criterio no planificado.

Grilla

Pese a todo, la disposición de los elementos se funda en una métrica común.

Métrica sobre la cual se basan los contenidos tanto estáticos como variables

Programación por canal

Como se menciona en el punto “niveles jerárquicos”, cada canal (salvo excepciones ya nombradas) posee un sub-sitio que entrega la programación. A continuación se analizan los elementos presentes en este tipo de contenido.

Elementos estáticos programación

La ventana de programación está supeditada no solo al sitio general sino que al sub-sitio (sitio del canal respectivo). Por ello mantiene toda la cabecera del sitio del canal.

Este se trata, sin embargo, de un caso mucho más regular que la sección anteriormente vista. Aquí no existen elementos aparentemente aleatorios. Todas programaciones contienen los mismos tipos de contenidos y en el mismo orden.

Archivo:Detalle elementos estáticos de programación.jpg
Esquema comparativo de los elementos de tres programaciones

Cambios de estilo según canal

Los contenidos modifican sus colores y en algunos casos la tipografía.

Calendarios en tres canales
Archivo:Compración programación.jpg
Estilos de listados de programación

Grilla

La estructura de bloques principales de la programación difiere de inicio del sitio del canal. El contenido pasa de tres columnas iguales a dos dispares.

Estructura básica de los sitios de programación

Fichas de programas destacados

Las series o películas destacadas poseen una sección personalizada donde se exponen datos a modo de ficha.

Elementos estáticos y variables

No existen concretamente elementos estáticos dentro de las fichas. Existen una lista de elementos posibles dependiendo del contenido tales como sinopsis, ficha técnica, videos, imágenes, temporadas y/o episodios (en caso de ser serie) y personajes. Estos elementos se presentan en la estructura de doble columna en la medida en que están presentes. Por ello no se puede decir que son precisamente estáticos.

Dentro de estos elementos hay algunos que se mantienen en la mayoría de los casos. La imagen de cabecera y el cuadro de próximas transmisiones.

Esquema que muestra la variabilidad de los elementos presentes en las fichas

Cambios de estilo e inconsistencias

Al igual que en el caso de el contenido de los sitios de canales en las fichas suelen presentarse ciertos contenidos de manera muy diferida en términos de estilo y a veces hasta inconsistente.

Archivo:Comparación fichas tecnicas.jpg
Recuadros donde se muestra la ficha técnica en tres sitios
Archivo:Comparación videos.jpg
Barras de videos en distintos sitios

Revisando los siguientes ejemplos vemos incongruencias no solo de estilo, sino que también de etiquetado, de iconografía, de organización, de márgenes, etc.

Grilla

Estructura de doble columna propia de los sitios tipo ficha

Conclusiones

Un meta-sitio es un entorno web que comprende muchas veces realidades dispares. Pese a ello es necesario que el diseñador haga uso de recursos lógicos, estructurales y estéticos para dar al contenido heterogéneo consistencia. Dar consistencia significa poner los recursos observados al servicio de una identidad colectiva. Identidad colectiva que debe no obstante albergar en sí misma la diversidad.

Es en tal dilema que entra el juego de lo estático y lo variable. Son aquellos rasgos que unen o diferencian los que construyen la coherencia y la distinción en el sitio.

Se observó como aquellos rasgos diferenciadores pueden ser reflejo de una decisión de diseño. O como por el contrario, pueden ser objeto de confusión y ambigüedad.

El caso de HBO en definitiva presentó defectos y virtudes. A nivel macro, falta mucha coherencia todavía para decir que existe una identidad o criterio global con respecto a la organización.