Proyecto 2º.

Fase 2:
Plataforma web de artem
Ninoska morilla fuentes, 2º B
 INTRODUCCIÓN    Sobre Artem 

1. Introducción
•  Sobre Artem
1. TEATRO DE RECIENTE CREACIÓN EN GRANADA CAPITAL
2. Briefing
•  Proceso de indagación 2. IMAGEN FRESCA E INNOVADORA CERCANA AL PÚBLICO JOVEN
•  Conclusiones

•  Propuesta
3. libro de estilos
•  Mapa Web • Sala de Exposiciones - Teatro
•  Distribución de espacios - Teatro Infantil
•  Uso del color • Gestión de espacio escénico - Música
- Danza
•  Sistema de navegación 3. SERVICIOS
- Lírica
•  Tecnologías y lenguajes
• Funciones didácticas - Otras actividades
•  Diseño de la interacción

•  Estrategia tipográfica
• Ciclos monográficos
•  Recursos gráficos e interactivos
4. Conclusiones
 BRIEFING    PROCESO DE INDAGACIÓN 

1. PROYECTO: DESARROLLO DE LA PLATAFORMA WEB DE ARTEM

1. Introducción
•  Sobre Artem
2. Briefing cuestiones iniciales
•  Proceso de indagación

•  Conclusiones 1. ¿ Suelen tener los teatros sitio Web?

•  Propuesta
2. ¿ Lo tienen los teatros de la competencia?
3. libro de estilos
•  Mapa Web 3. ¿ Qué tipo de web tienen?
•  Distribución de espacios 4. ¿ Qué tecnologías emplean?
•  Uso del color

•  Sistema de navegación
•  Tecnologías y lenguajes
•  Diseño de la interacción
•  Estrategia tipográfica
5. ¿ Cómo gestionan la información ?
6. ¿ Por qué necesita Artem un sitio Web ?
7. ¿ qué tipo de Web necesita?

•  Recursos gráficos e interactivos

7. ¿ Cual será el público objetivo de la Web?
4. Conclusiones
 BRIEFING    PROCESO DE INDAGACIÓN 

Empezamos la indagación en Andalucía, pero primero Granada...

1. Introducción
•  Sobre Artem
2. Briefing primeras respuestas
•  Proceso de indagación

•  Conclusiones 1. No todos los teatros tienen sitio web, en toda Andalucía, sólo
•  Propuesta hemos encontrado cuatro
3. libro de estilos
•  Mapa Web
2. La competencia • T. M. Isabel la Católica        No tiene
•  Distribución de espacios
más directa Web informativa de
•  Uso del color

•  Sistema de navegación • C.C. Manuel de Falla           poca actualización y

•  Tecnologías y lenguajes
muy oscura
•  Diseño de la interacción
• Teatro Alhambra Diseño muy estático,
•  Estrategia tipográfica
poco atractivo excepto
•  Recursos gráficos e interactivos por las imágenes
4. Conclusiones
 BRIEFING    PROCESO DE INDAGACIÓN 

1. Introducción
•  Sobre Artem
2. Briefing
•  Proceso de indagación

•  Conclusiones

•  Propuesta
3. libro de estilos
•  Mapa Web

•  Distribución de espacios

•  Uso del color

Centro Cultural Manuel de Falla
•  Sistema de navegación

•  Tecnologías y lenguajes

•  Diseño de la interacción

•  Estrategia tipográfica

•  Recursos gráficos e interactivos

4. Conclusiones Teatro Alhambra
 BRIEFING    PROCESO DE INDAGACIÓN 

... necesitamos más respuestas... ¿qué hay en el resto de Andalucía?

1. Introducción
•  Sobre Artem
2. Briefing
•  Proceso de indagación

•  Conclusiones

•  Propuesta
3. libro de estilos
•  Mapa Web

•  Distribución de espacios

•  Uso del color • Gestiona muchisima infor-

•  Sistema de navegación mación, muy bien organizada
•  Tecnologías y lenguajes • Navegación muy intuitiva
•  Diseño de la interacción • Uso del color de forma fun-
•  Estrategia tipográfica cional para diferenciar entre
•  Recursos gráficos e interactivos los distintos generos
4. Conclusiones
 BRIEFING    PROCESO DE INDAGACIÓN 

1. Introducción
•  Sobre Artem
2. Briefing
•  Proceso de indagación

•  Conclusiones

•  Propuesta
3. libro de estilos
•  Mapa Web • Uso de clave alta
•  Distribución de espacios
• Aspecto más joven y fresco
•  Uso del color
• Uso del color de forma funcional
•  Sistema de navegación
para diferenciar entre los
•  Tecnologías y lenguajes
distintos generos
•  Diseño de la interacción
• Uso muy conmedido del color
•  Estrategia tipográfica
• Gestiona solamente su agenda de
•  Recursos gráficos e interactivos
espectáculos
4. Conclusiones
 BRIEFING    PROCESO DE INDAGACIÓN 

1. Introducción
•  Sobre Artem
2. Briefing
•  Proceso de indagación

•  Conclusiones

•  Propuesta
3. libro de estilos
•  Mapa Web • Uso de clave baja
•  Distribución de espacios • Poco cuidado del diseño de los
•  Uso del color textos y de las imágenes.
•  Sistema de navegación • Uso del color de forma funcional
•  Tecnologías y lenguajes para diferenciar entre los
•  Diseño de la interacción distintos generos
•  Estrategia tipográfica • Muy oscura con todos los textos
•  Recursos gráficos e interactivos sobre fondo negro o gris
4. Conclusiones
 BRIEFING    PROCESO DE INDAGACIÓN 

1. Introducción
•  Sobre Artem
2. Briefing
•  Proceso de indagación

•  Conclusiones

•  Propuesta
3. libro de estilos • Uso de clave baja
•  Mapa Web • Diseño muy cuidado
•  Distribución de espacios • Es un teatro clasico, y tiene ese
•  Uso del color aspecto
•  Sistema de navegación • Uso de rojos y grises en los fon-
•  Tecnologías y lenguajes dos, de nuevo...
•  Diseño de la interacción • Gestiona muy bien mucha infor-
•  Estrategia tipográfica mación
•  Recursos gráficos e interactivos • Navegación muy intuitiva
4. Conclusiones
 BRIEFING    PROCESO DE INDAGACIÓN 

pero con esto no es suficiente...

1. Introducción
•  Sobre Artem • Buscamos y analizamos teatros del resto de España incluso
2. Briefing de fuera, en busca de un “Toque diferente”
•  Proceso de indagación
• Nos ayudan en cuanto a la gestión de contenidos
•  Conclusiones

•  Propuesta • Pero, salvo alguna excepción, todos tienen estructuras de

3. libro de estilos navegación similares y con poca inversión en diseño.
•  Mapa Web
• Salvo alguna animación en flash en el home, mostrando algunos
•  Distribución de espacios
espectáculos de actualidad, no siguen estrategias persuasivas.
•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes

•  Diseño de la interacción

•  Estrategia tipográfica
... de esta segunda remesa, nos quedamos como referencia con el
•  Recursos gráficos e interactivos Teatro Circo Price
4. Conclusiones
 BRIEFING    PROCESO DE INDAGACIÓN 

1. Introducción
•  Sobre Artem
2. Briefing
•  Proceso de indagación

•  Conclusiones

•  Propuesta
3. libro de estilos
•  Mapa Web

•  Distribución de espacios

•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes
• Tiene un aspecto más moderno y desenfadado
•  Diseño de la interacción
• Incorpora algunos elementos de diseño atractivos e interesantes
•  Estrategia tipográfica
• El diseño se ve cuidado aunque tiene cosas mejorables en cuanto a estructura
•  Recursos gráficos e interactivos
• Sigue una estrategia un poco más persuasiva
4. Conclusiones
 BRIEFING    PROCESO DE INDAGACIÓN 

¿...y qué hay de los centros culturales?

1. Introducción
•  Sobre Artem • Nos centramos en dos de ellos, La Casa Encendida,
2. Briefing Cetro Párraga y Matadero Madrid
•  Proceso de indagación

•  Conclusiones
• También gestionan grandes volúmenes de información
•  Propuesta
3. libro de estilos • Aunque carece de recursos de diseño, la apariencia que refleja la web de
•  Mapa Web
Matadero Madrid es más moderna (emplea grandes titulares e imágenes
para presentar sus eventos)
•  Distribución de espacios

•  Uso del color • Gestionan agenda de eventos de gran variedad

•  Sistema de navegación
• Nos sirven sobretodo por la gestión de la información y la navegación
•  Tecnologías y lenguajes

•  Diseño de la interacción

•  Estrategia tipográfica

•  Recursos gráficos e interactivos

4. Conclusiones
 BRIEFING    PROCESO DE INDAGACIÓN 

1. Introducción
•  Sobre Artem
2. Briefing
•  Proceso de indagación

•  Conclusiones

•  Propuesta
3. libro de estilos
•  Mapa Web

•  Distribución de espacios

•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes

•  Diseño de la interacción

•  Estrategia tipográfica

•  Recursos gráficos e interactivos

4. Conclusiones
 BRIEFING    CONCLUSIONES 

1. Introducción Conclusiones DEL ANÁLISIS

•  Sobre Artem
2. Briefing • Uso habitual tonos rojos y fondos grises
•  Proceso de indagación • Uso del color como estrategia para diferenciar entre los distintos géneros
•  Conclusiones • Navegación clara y muy sencilla (en la mayoría de ellos)
•  Propuesta • No emplean metáforas visuales
3. libro de estilos • Páginas de mucho contenido
•  Mapa Web • Muy ordenadas
•  Distribución de espacios • Todas presentan una estructura similar en la que el usuario navega facilmente
•  Uso del color • El calendario es común en todas ellas
•  Sistema de navegación • Predominio de una clave media baja
•  Tecnologías y lenguajes • Uso de clave alta en las páginas de teatros más modernos, enfocados a un público
•  Diseño de la interacción más joven o en centros culturales.
•  Estrategia tipográfica • Los diseños en las web de teatros suelen mostrar una imagen muy clásica o muy
•  Recursos gráficos e interactivos
limpia en la que se emplean escasos recursos gráficos o corporativos.
4. Conclusiones
 Conclusiones
1. Introducción
•  Sobre Artem secciones
2. Briefing
•  Proceso de indagación

•  Conclusiones inicio el teatro/ venta calendario boletin electro- teatro para socios sala de contacto programación revista enlaces mapa navegación equipo aviso formación sala expo-
información localidades nico/rss niños prensa de interés web humano legal siciones

•  Propuesta
alhambra

3. libro de estilos
teatro
cervantes ma

•  Mapa Web
teatro
echegaray

•  Distribución
gran teatro
córdoba
de espacios

•  Uso del color

teatro de la
maestranza

•  Sistema de
teatro lope
de vega
navegación

•  Tecnologías y
teatro juan
bravo
lenguajes

•  Diseño de la interacción
escalante
c. t.

•  Estrategia tipográfica
artem

•  Recursos gráficos e interactivos Secciones o servicios que tiene la web.

Secciones o servicios que “sí”interesan a artem.
4. Conclusiones Secciones o servicios que “no” interesan a artem.
 BRIEFING    PROPUESTA     SOBRE LA WEB DE ARTEM 

1. Introducción
1. OBJETIVOS
•  Sobre Artem DE LA WEB • Fidelización
2. Briefing
• Captación de nuevos públicos
•  Proceso de indagación
• Escaparate para la empresa y sus servicios
•  Conclusiones

•  Propuesta
• Conocer a su público
3. libro de estilos
•  Mapa Web
2. PÚBLICO • Aficionados al teatro
•  Distribución de espacios
OBJETIVO • Escolares (profesores y padres)
•  Uso del color

•  Sistema de navegación
• Público infantil (padres)
•  Tecnologías y lenguajes
• Aficionados al Arte
•  Diseño de la interacción • Profesionales del sector
•  Estrategia tipográfica

•  Recursos gráficos e interactivos

4. Conclusiones
 BRIEFING    PROPUESTA    ¿Qué necesita el público objetivo? 

1. Introducción ESCOLARES (PADRES Y PROFESORES)

•  Sobre Artem
2. Briefing
•  Proceso de indagación 1. Información sobre la PROGRAMACIÓN DIDÁCTICA
•  Conclusiones

•  Propuesta
¿Qué funciones hay
3. libro de estilos Cómo organizar
actualmente?
•  Mapa Web
la visita
•  Distribución de espacios Comprar
•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes
+ Información (consultas)
•  Diseño de la interacción
2. Contactar con Artem
•  Estrategia tipográfica
Organizar
•  Recursos gráficos e interactivos
la visita
4. Conclusiones
 BRIEFING    PROPUESTA    ¿Qué necesita el público objetivo?

1. Introducción AFICIONADOS AL TEATRO Y A LAS ARTES

•  Sobre Artem
ESCÉNICAS EN GENERAL
2. Briefing
•  Proceso de indagación

•  Conclusiones 1. Información sobre la programación del teatro

•  Propuesta
3. libro de estilos Aforo y butacas
•  Mapa Web 2. Comprar entradas Dónde comprarlas
•  Distribución de espacios Abonos y descuentos
•  Uso del color

•  Sistema de navegación Consulta

•  Tecnologías y lenguajes
Sujerencia
•  Diseño de la interacción 3. Contactar con Artem
•  Estrategia tipográfica Incidencia
•  Recursos gráficos e interactivos
¡ HOLA !
4. Conclusiones
 BRIEFING    PROPUESTA    ¿Qué necesita el público objetivo? 

1. Introducción PÚBLICO INFANTIL (PADRES)

•  Sobre Artem
2. Briefing
•  Proceso de indagación 1. Información sobre la programación INFANTIL
•  Conclusiones

•  Propuesta
¿Dónde comprarlas?
3. libro de estilos
2. Comprar entradas
•  Mapa Web
Abonos y descuentos
•  Distribución de espacios

•  Uso del color

•  Sistema de navegación Consulta

•  Tecnologías y lenguajes
Sujerencia
•  Diseño de la interacción 3. Contactar con Artem
•  Estrategia tipográfica
Incidencia
•  Recursos gráficos e interactivos ¡ HOLA !
4. Conclusiones
 BRIEFING    PROPUESTA    ¿Qué necesita el público objetivo? 

1. Introducción AFICIONADOS AL ARTE

•  Sobre Artem
2. Briefing
•  Proceso de indagación
1. Información sobre la programación DE LA SALA DE EXPOSICIONES
•  Conclusiones

•  Propuesta
3. libro de estilos
•  Mapa Web
Exposición Precio
•  Distribución de espacios actual
•  Uso del color Horarios ¿Dónde está
•  Sistema de navegación Artem?
•  Tecnologías y lenguajes

•  Diseño de la interacción

•  Estrategia tipográfica
2. Contactar con Artem
•  Recursos gráficos e interactivos
4. Conclusiones
 BRIEFING    PROPUESTA    ¿Qué necesita el público objetivo? 

1. Introducción profesionales
•  Sobre Artem ARTES ESCÉNCAS
2. Briefing
•  Proceso de indagación

•  Conclusiones
Aforo
•  Propuesta
3. libro de estilos 1. Información sobre Artem Datos Técnicos
•  Mapa Web ¿Dónde está artem?
•  Distribución de espacios

•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes
Interesados en
•  Diseño de la interacción 2. Contactar con Artem actuar en Artem
•  Estrategia tipográfica

•  Recursos gráficos e interactivos

4. Conclusiones
 BRIEFING    PROPUESTA    ¿Qué necesita el público objetivo? 

1. Introducción profesionales
•  Sobre Artem ARTE
2. Briefing
•  Proceso de indagación Sala de exposiciones
•  Conclusiones
1. Información sobre Artem Datos Técnicos de la sala
•  Propuesta
3. libro de estilos ¿Dónde está artem?
•  Mapa Web

•  Distribución de espacios

•  Uso del color

•  Sistema de navegación Interesados en

•  Tecnologías y lenguajes 2. Contactar con Artem exponer
•  Diseño de la interacción

•  Estrategia tipográfica

•  Recursos gráficos e interactivos

4. Conclusiones
 BRIEFING    PROPUESTA 

1. Introducción
3. POSICIONAMIENTO
•  Sobre Artem
2. Briefing • Empresa joven, fresca e innovadora
•  Proceso de indagación • Intenta acercar las artes escénicas a público
•  Conclusiones
más joven. - Programación infantil
•  Propuesta
- Funciones didácticas
3. libro de estilos
- Espectáculos contemporáneos
•  Mapa Web

•  Distribución de espacios

•  Uso del color Aficcionados

• Sin dejar de cuidar a su público más fiel al teatro
•  Sistema de navegación

•  Tecnologías y lenguajes
• Cuida la imagen que transmite en todas sus
•  Diseño de la interacción
acciones de comunicación
•  Estrategia tipográfica • Activa
•  Recursos gráficos e interactivos
4. Conclusiones
 BRIEFING    PROPUESTA 

1. Introducción 4. PUNTO • Gestión de gran volumen de información

•  Sobre Artem FUERTE DE
2. Briefing • Una imagen más moderna, desenfadada, y
LA WEB persuasiva(portada), más cercana a la de los
•  Proceso de indagación

•  Conclusiones
centros culturales y teatros más modernos
•  Propuesta
que a los teatros más clásicos, sin alejarse de la
3. libro de estilos
estructura de información común de las Web
de teatros
•  Mapa Web
Los usuarios están acostumbrados a una
•  Distribución de espacios estructura concreta mantenerla les facilita
•  Uso del color
la navegación
•  Sistema de navegación

•  Tecnologías y lenguajes • Ofrecerá a los usuarios información muy

•  Diseño de la interacción completa sobre todos sus servicios.
•  Estrategia tipográfica

•  Recursos gráficos e interactivos

• Actualización frecuente de contenidos
4. Conclusiones
 LIBRO DE ESTILOS    MAPA WEB

información servicios entradas contacto prensa

1. Introducción
•  Sobre Artem artem programación información general contacta con nosotros ZONA DESCARGAS
¿dónde estamos? Teatro Butacas ¿Quieres actuar? notas de prensa
2. Briefing
datos técnicos Teatro Infantil ¿Quieres exponer? convocatorias
•  Proceso de indagación Música abonos
aforo descuentos
•  Conclusiones Danza
galería
Otros
•  Propuesta
3. libro de estilos monográficos
•  Mapa Web didácticas
•  Distribución de espacios sala de exposiciones
•  Uso del color Sala de Exposiciones
•  Sistema de navegación
Exposición actual

•  Tecnologías y lenguajes
  Secciones Principales (primer nivel)
•  Diseño de la interacción
  Subsecciones (segundo nivel)
•  Estrategia tipográfica   Secciones de tercer nivel
  Contenidos muy concretos: espectáculos,
•  Recursos gráficos e interactivos
exposiciones o notas de prensa concretas.
4. Conclusiones
 LIBRO DE ESTILOS    DISTRIBUCIÓN DE ESPACIOS

•Distribución de Espacios.

1. Introducción 1. PROPORCIONES Proporciones

Tipología de WEB
Retículas y módulos
•  Sobre Artem
Anccho fijo 980px Fondo e interfaz
Bocetos GUI
2. Briefing
Scroll Idicadores para subir
•  Proceso de indagación

•  Conclusiones

•  Propuesta 2. TIPOLOGÍA DE WEB

3. libro de estilos
•  Mapa Web • Corporativa Información de la empresa y sus servicios
•  Distribución de espacios
• Agenda Calendario de espectáculos
•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes Automatización de

•  Diseño de la interacción
•  Estrategia tipográfica
•  Recursos gráficos e interactivos
4. Conclusiones
Debería ser dinámica
las actualizaciones
• Actualizaciones frecuentes
• Conciliación entre diseño y gestión de información
 LIBRO DE ESTILOS    DISTRIBUCIÓN DE ESPACIOS

1. Introducción 3. RETICULAS Y MÓDULOS 4. FONDO

•  Sobre Artem • Columnas: 18 x 44px • Principalmente Negro
2. Briefing • Márgenes: 9px • Liso con alguna ilustración
•  Proceso de indagación
• Medianiles: 10px • Cambios en el color de fondo en algunas
•  Conclusiones
secciones como en la infantil: azul
•  Propuesta
3. libro de estilos • Cabecera: Ilustraciones sencillas
•  Mapa Web
Cambiarán en algunas
•  Distribución de espacios
secciones (color, ilustración)
•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes 5. INTERFAZ

•  Diseño de la interacción
Tanto los contenidos como la navegación irán
•  Estrategia tipográfica
colocadas en el interior de cajas colgantes unas
•  Recursos gráficos e interactivos
4. Conclusiones de otras, simulando carteles.
 LIBRO DE ESTILOS    DISTRIBUCIÓN DE ESPACIOS

1. Introducción
5. INTERFAZ
•  Sobre Artem Tanto los contenidos como la navegación irán colocadas en el interior de cajas
2. Briefing colgantes unas de otras, simulando carteles.
•  Proceso de indagación

•  Conclusiones

•  Propuesta
3. libro de estilos
•  Mapa Web

•  Distribución de espacios

•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes

•  Diseño de la interacción

•  Estrategia tipográfica

•  Recursos gráficos e interactivos

4. Conclusiones
 LIBRO DE ESTILOS    USO DEL COLOR

1. Introducción 1. USO GENERAL

•  Sobre Artem Se va a jugar con el contraste de las cajas blancas sobre el fondo negro
2. Briefing Uso conmedido del color
•  Proceso de indagación

•  Conclusiones

•  Propuesta
3. libro de estilos 2. COLOR IDENTITARIO
•  Mapa Web Se jugará con los colores corporativos, el naranja, el negro y sus distintos matices.
•  Distribución de espacios
Se emplearán en titulares, cuerpo de texto y pictogramas
•  Uso del color
R: 255 R: 0 R: 51
•  Sistema de navegación
G: 90 G: 0 G: 51
•  Tecnologías y lenguajes
B:0 B:0 B: 51
•  Diseño de la interacción

•  Estrategia tipográfica

•  Recursos gráficos e interactivos

4. Conclusiones
 LIBRO DE ESTILOS    USO DEL COLOR

1. Introducción
3. USO FUNCIONAL
•  Sobre Artem • Como apoyo a la navegación se usarán enlaces en colores negro y/o gris
2. Briefing que cambiarán su color a naranja cuando el usuario interactúe con el sitio,
•  Proceso de indagación
al pasar el ratón sobre ellos, o para señalar en la sección en la que se
•  Conclusiones
encuentra
•  Propuesta
3. libro de estilos • También se jugará con el color para diferenciar entre los distintos géneros
•  Mapa Web de espectáculos. Tanto para marcar sus enlaces como para los distintos
•  Distribución de espacios titulares o marcos de sus imágenes.
•  Uso del color • Para jerarquizar titulos
•  Sistema de navegación
TEATRO
•  Tecnologías y lenguajes TEATRO DANZA MÚSICA OTROS
INFANTIL
•  Diseño de la interacción
R: 190 R: 14 R: 95 R: 0 R: 242
•  Estrategia tipográfica G: 10 G: 48 G: 12 G: 148 G: 148
•  Recursos gráficos e interactivos B: 38 B:131 B: 90 B: 48 B: 0
4. Conclusiones
 LIBRO DE ESTILOS    SISTEMA DE NAVEGACIÓN

1. Introducción 1. MENÚS Y SUBMENÚS

•  Sobre Artem • Top menu: • Menú lateral (izq.): Mostrará las secciones
2. Briefing 2º y 3º nivel, según la sección donde
•  Proceso de indagación

•  Conclusiones
Sección nvl. 1
•  Propuesta
3. libro de estilos
Submenú desplegable Sección nvl. 2
•  Mapa Web
Sección nvl. 3
•  Distribución de espacios

•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes

•  Diseño de la interacción

•  Estrategia tipográfica

•  Recursos gráficos e interactivos

Pictograma de
4. Conclusiones
la sección nvl. 1
 LIBRO DE ESTILOS    SISTEMA DE NAVEGACIÓN

• Menú lateral (der.): estemos.

1. Introducción
•  Sobre Artem
2. Briefing Calendario de
•  Proceso de indagación eventos
•  Conclusiones

•  Propuesta
Trayectos a la programación
3. libro de estilos
general filtrada por géneros
•  Mapa Web

•  Distribución de espacios
RSS
•  Uso del color Acceso a Navegación
•  Sistema de navegación servicios Mapa web
•  Tecnologías y lenguajes Facebook
•  Diseño de la interacción

•  Estrategia tipográfica Enlace a la

•  Recursos gráficos e interactivos revista
4. Conclusiones
 LIBRO DE ESTILOS    SISTEMA DE NAVEGACIÓN

1. Introducción
2. NAVEGACIONES ALTERNATIVAS
•  Sobre Artem
• Enlaces hipertexto
2. Briefing • Puntos fuertes
•  Proceso de indagación • Procesos rutinarios
•  Conclusiones • Trayectos (caminos directos) • Servicios más visitados
•  Propuesta
• Aquello sobre lo que artem quiera llamar
3. libro de estilos
la atención del usuario
•  Mapa Web

•  Distribución de espacios
• Menu de pestañas auxilar
•  Uso del color

•  Sistema de navegación
• Trayectos
•  Tecnologías y lenguajes
• Visualización de videos
•  Diseño de la interacción
• Visualización de imágenes
•  Estrategia tipográfica

•  Recursos gráficos e interactivos

• Enlaces
4. Conclusiones
 Música
PRECIO
PRECIO COMPRAR
COMPRAR Danza
LIBRO DE ESTILOS    SISTEMA
OtrosDE NAVEGACIÓN
TRES
MUNDO Y FINAL 8 8AA21
21 Teatro
dede
Mutis
RonProducciones
Lalá EUROS
EUROS Teatro Infantil
1. Introducción 3. ayudas
PRECIO aCOMPRAR
la navegación Música
Danza
Otros NAVEGACIÓN
•  Sobre Artem
TRES
2. Briefing 8 A 21
de Mutis
•  Proceso Producciones
de indagación EUROS • MAPA WEB MAPA WEB
•  Conclusiones PRECIO COMPRAR
•  Propuesta • NAVEGACIÓN RSS FACEBOOK
NAVEGACIÓN
3.PIEDRAS EN LOS BOLSILLOS
libro de estilos 8 A 21
de Marie Jones EUROS MAPA WEB
•  Mapa Web
• CAMBIOS DE COLOR DE LOS RÓTULOS Y/O PICTOGRAMAS
•  Distribución de espacios PRECIO
PRECIO COMPRAR
COMPRAR
•  Uso del color
SigueRSS
nuestros ciclos con
FACEBOOK
MUNDO Y FINAL BOLSILLOS
PIEDRAS EN LOS 8 8AA21
21 NAVeGAcIÓN
•  Sistema de navegación
dedeRon LaláJones
Marie EUROS
EUROS NAVeGAcIÓN
•  Tecnologías y lenguajes

•  Diseño de la interacción PRECIO

PRECIO COMPRAR
COMPRAR
Sigue nuestros ciclos con
•  Estrategia tipográfica • Llaman la atención del usuario
MUNDO Y FINAL
• TRES
Recursos gráficos e interactivos 88AA21
21 • INDICADORES
de Ron Lalá EUROS • Facilitan la navegación
4.de Mutis Producciones
Conclusiones EUROS
 LIBRO DE ESTILOS    TECNOLOGÍAS Y LENGUAJES

1. Introducción 1. HTML Y CSS (principalmente)

•  Sobre Artem
2. Briefing
•  Proceso de indagación
2. FLASH
•  Conclusiones
• Mostrar imágenes y videos
•  Propuesta
3. libro de estilos • Publicidad de los espectáculos en promoción
•  Mapa Web
• Sencillas animaciones
•  Distribución de espacios

•  Uso del color

•  Sistema de navegación 3. LIBRERÍA JQUERY DE JAVASCRIPT

•  Tecnologías y lenguajes
• Efectos
•  Diseño de la interacción
Calendarío
•  Estrategia tipográfica • Para algunas aplicaciones
•  Recursos gráficos e interactivos
Galerías de imágenes dinámicas
4. Conclusiones
 LIBRO DE ESTILOS    DISEÑO DE LA INTERACCIÓN

1. PROTOCOLOS Y RUTINAS DE ACCESO

1. Introducción
•  Sobre Artem
A LOS CONTENIDOS
2. Briefing
•  Proceso de indagación

•  Conclusiones

•  Propuesta
3. libro de estilos
•  Mapa Web

•  Distribución de espacios

•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes

•  Diseño de la interacción

•  Estrategia tipográfica

•  Recursos gráficos e interactivos

4. Conclusiones
 LIBRO DE ESTILOS    DISEÑO DE LA INTERACCIÓN

Logo = Inicio
1. Introducción
Inicio
•  Sobre Artem
2. Briefing
•  Proceso de indagación
información servicios entradas contacto prensa
•  Conclusiones

•  Propuesta
3. libro de estilos
•  Mapa Web

notas de prensa
contacta con nosotros

¿Quieres actuar?

¿quieres exponer?

zona de descargas

convocatorias
descuentos
galería
Artem

dónde estamos

datos técnicos

aforo

programación

exposiciones

funciones didácticas

monográficos

Comprar entradas

butacas

abonos
•  Distribución de espacios

•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes

•  Diseño de la interacción

•  Estrategia tipográfica

Actual
La sala Imágenes
•  Recursos gráficos e interactivos Espectáculos
Exposiciónes
4. Conclusiones Contenidos específicos
 LIBRO DE ESTILOS    ESTRATEGIA TIPOGRÁFICA

1. Introducción
1. TIPOS NATIVOS
•  Sobre Artem • trebuchet bold
2. Briefing
•  Proceso de indagación • Titulos (17pt)
•  Conclusiones • Subtítulos (15pt)
•  Propuesta • Rótulos de los enlaces(no especificados en
3. libro de estilos tipos rasterizadas)
•  Mapa Web

•  Distribución de espacios

•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes

•  Diseño de la interacción

•  Estrategia tipográfica

•  Recursos gráficos e interactivos

4. Conclusiones
 LIBRO DE ESTILOS    ESTRATEGIA TIPOGRÁFICA

1. Introducción
1. TIPOS NATIVOS
•  Sobre Artem • Verdana
2. Briefing
•  Proceso de indagación
• Cuerpo de texto (11px; interlineado 16px)
•  Conclusiones • Títulos de tercer nivel de jerarquía
•  Propuesta • Rotulos de los menús de pestañas
3. libro de estilos
•  Mapa Web

•  Distribución de espacios

•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes

•  Diseño de la interacción

•  Estrategia tipográfica

•  Recursos gráficos e interactivos

4. Conclusiones
 LIBRO DE ESTILOS    ESTRATEGIA TIPOGRÁFICA

1. Introducción 2. TIPOS RASTERIZADOS

•  Sobre Artem
• Trade Gthic Lt Std bold condensed
2. Briefing
•  Proceso de indagación • Rótulos Topmenu (20pt)
•  Conclusiones

•  Propuesta
3. libro de estilos
•  Mapa Web
• Enlaces de las promociones en el
•  Distribución de espacios
Home(17 pt)
•  Uso del color

•  Sistema de navegación

•  Tecnologías y lenguajes • Titulares de las promociones en el

•  Diseño de la interacción Home y submenú lateral (23pt)
•  Estrategia tipográfica

•  Recursos gráficos e interactivos

4. Conclusiones
 LIBRO DE ESTILOS    RECURSOS GRÁFICOS E INTERACTIVOS

1. Introducción 1. ELEMENTOS CORPORATIVOS

•  Sobre Artem
2. Briefing
•  Proceso de indagación

•  Conclusiones

•  Propuesta
3. libro de estilos
•  Mapa Web

•  Distribución de espacios

•  Uso del color

JuNIO

•  Sistema de navegación

•  Tecnologías y lenguajes

•  Diseño de la interacción ArteM

•  Estrategia tipográfica AFOrO
¿DÓNDe eStAMOS?
•  Recursos gráficos e interactivos GALerÍA
4. Conclusiones
 LIBRO DE ESTILOS    RECURSOS GRÁFICOS E INTERACTIVOS

1. Introducción
2. PICTOGRAMAS Y METÁFORAS VISUALES
•  Sobre Artem
2. Briefing
•  Proceso de indagación
3.1.
•  Conclusiones

•  Propuesta
3. libro de estilos 3.2.
•  Mapa Web

•  Distribución de espacios

•  Uso del color

•  Sistema de navegación
3.3.
•  Tecnologías y lenguajes

•  Diseño de la interacción
QUILLA
TA
•  Estrategia tipográfica

•  Recursos gráficos e interactivos

4. Conclusiones
3.4.
 CONCLUSIONES

• DISEÑAR UN SITIO WEB NO ES IGUAL QUE CREAR UN SITIO WEB 

1. Introducción
•  Sobre Artem • La creación de un sitio web de un teatro es una tarea muy compleja, se gestiona
2. Briefing mucha información que debe estar muy bien organizada, y ser accesible para gran
•  Proceso de indagación variedad de usuarios, de manera, hay que intentar equilibrar este punto con el dise-
•  Conclusiones ño, para crear una web accesible y que los distintos usuarios puedan entender.
•  Propuesta
3. libro de estilos
• Me ha llevado mucho tiempo encontrar el sistema de navegación adecuado e inte-
•  Mapa Web
grarlo con el diseño.
•  Distribución de espacios • Lo que ves en otras Web (por muy fácil que parezca), no puedes tenerlo en tu Web.
•  Uso del color

•  Sistema de navegación • Con mis conocimientos de web, que en este punto son más de los que yo esperaba,
•  Tecnologías y lenguajes
las decisiones de diseño se ha visto constantemente limitadas.
•  Diseño de la interacción
• He empleado mucho tiempo en investigar y aprender cómo programar o crear
•  Estrategia tipográfica
ciertos recursos para emplearlos en la web que me han dejado poco tiempo para el
•  Recursos gráficos e interactivos
diseño y para el montaje de la página en Dreamweaver.
4. Conclusiones
 CONCLUSIONES

1. Introducción
• A pesar de las dificultades, estoy satisfecha con el proyecto que he llevado a cabo,
aunque pienso que es mejorable y que aun queda mucho por hacer.
•  Sobre Artem
2. Briefing • Todos queremos crear la web que sea diferente, y en mi opinión la plataforma web de
•  Proceso de indagación Artem es distinta a todas las web de teatro que he encontrado, aunque no se si el di-
•  Conclusiones seño gustará a todos sus públicos.
•  Propuesta
3. libro de estilos • Los recursos gráficos que creamos son muy importantes a la hora de crear cualquier
•  Mapa Web
tipo de sitio web, si no los tienes, tienes una web corriente, vacía y sin personalidad.
•  Distribución de espacios
Yo he creado algunos que habéis visto, pero creo que a este sitio le faltan llamadas de
•  Uso del color
atención “llamativas” que comuniquen al usuario y le inviten a interactuar y tengo que
trabajar en ello.
•  Sistema de navegación

•  Tecnologías y lenguajes
•  Diseño de la interacción
•  Estrategia tipográfica
•  Recursos gráficos e interactivos
4. Conclusiones
• Queda poco tiempo y mucho trabajo, seguiré trabajando como hasta ahora para inten-
tar entregarla a tiempo, con una única restricción, pase lo que pase voy a entregar
una chapuza.