You are on page 1of 43

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
•  Sistema de navegación 3. SERVICIOS - Danza
- Otras actividades
•  Tecnologías y lenguajes
• Programación didáctica
•  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
5. ¿ Cómo gestionan la información ?
•  Tecnologías y lenguajes 6. ¿ Por qué necesita Artem un sitio Web ?
•  Diseño de la interacción 7. ¿ qué tipo de Web necesita?
•  Estrategia tipográfica

•  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 cinco
3. libro de estilos
•  Mapa Web
2. La competencia • T. M. Isabel la Católica        No tiene
•  Distribución de espacios
más directa
•  Uso del color
Web informativa de
•  Sistema de navegación • C.C. Manuel de Falla           poca actualización
•  Tecnologías y lenguajes

•  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 

Teatro Alhambra
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    PROCESO DE INDAGACIÓN 

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


1. Introducción
•  Sobre Artem Teatro cervantes de málaga
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 • Gestiona muchisima información, muy bien organizada


•  Recursos gráficos e interactivos • Navegación muy intuitiva
4. Conclusiones • Uso del color de forma funcional para diferenciar entre los distintos generos
BRIEFING    PROCESO DE INDAGACIÓN 

1. Introducción
•  Sobre Artem Teatro exchgaray
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
gran teatro de cordoba
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 

Teatro de la maestranza de sevilla


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
• Uso de clave baja
•  Diseño de la interacción
• Diseño muy cuidado
•  Estrategia tipográfica
• Es un teatro clasico
•  Recursos gráficos e interactivos
• Uso de rojos y grises en los fondos, de nuevo...
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 e inclu-
2. Briefing so 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

•  Diseño de la interacción
• Tiene un aspecto más moderno y desenfadado
•  Estrategia tipográfica
• Diseño cuidado, incorpora algunos recursos atractivos e interesantes
•  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 y organismos culturales?


1. Introducción
•  Sobre Artem • Nos centramos en tres 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 no emplean gran cantidad de recursos de diseño, la apariencia
•  Mapa Web
que reflejan es más moderna
•  Distribución de espacios • Gestionan agenda con eventos de gran variedad
•  Uso del color
• Nos sirven sobretodo por la gestión de la información y la navegación
•  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    PROCESO DE INDAGACIÓN 

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

•  Conclusiones

•  Propuesta matadero madrid


3. libro de estilos
•  Mapa Web
matadero madrid
•  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 (web de teatros)
•  Proceso de indagación • Uso funcional del color 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 fácilmente
•  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 y en centros u organismos 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 socios sala de contacto programación revista enlaces mapa navegación equipo aviso formación sala expo-
información localidades nico/rss infantil 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 • Fidelización
•  Sobre Artem DE LA WEB • Captación de nuevos públicos
2. Briefing
•  Proceso de indagación
• Escaparate para la empresa y sus servicios
•  Conclusiones • Conocer a su público
•  Propuesta • Ampliar la imagen de marca
3. libro de estilos
•  Mapa Web
2. PÚBLICO • Escolares (profesores y padres)
•  Distribución de espacios
OBJETIVO • Aficionados al teatro
•  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
entradas
•  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
- Imamagen mmoderna y desenfadada
•  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 Web actualizada
•  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 persuasiva (home),
LA WEB más cercana a la de los centros u organismos culturales y
•  Proceso de indagación

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

•  Sistema de navegación • Ofrecerá a los usuarios información muy completa y de


•  Tecnologías y lenguajes calidad sobre todos sus servicios.
•  Diseño de la interacción

•  Estrategia tipográfica
• Actualización frecuente de contenidos
•  Recursos gráficos e interactivos
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

•  Diseño de la interacción

•  Estrategia tipográfica

•  Recursos gráficos e interactivos


4. Conclusiones
LIBRO DE ESTILOS    DISTRIBUCIÓN DE ESPACIOS

1. Introducción 1. PROPORCIONES
•  Sobre Artem
Anccho fijo 980px
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


Debería ser dinámica
•  Diseño de la interacción las actualizaciones
•  Estrategia tipográfica • Actualizaciones frecuentes
•  Recursos gráficos e interactivos
4. Conclusiones
Conciliación entre diseño (desarollo de imagen de marca) 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
• Medianiles: 10px • Con alguna ilustración
•  Proceso de indagación
• 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

•  Diseño de la interacción

•  Estrategia tipográfica

•  Recursos gráficos e interactivos


4. Conclusiones
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 u
2. Briefing otro color plano en alguna sección en concreto.
•  Proceso de indagación
• Uso conmedido del color
•  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, al
•  Proceso de indagación
pasar el ratón sobre ellos, o para marcar la sección en la que se encuentra
•  Conclusiones
• También se jugará con el color para diferenciar entre los distintos géneros
•  Propuesta
3. libro de estilos de espectáculos. Tanto para marcar sus enlaces como para los distintos
•  Mapa Web titulares o marcos de sus imágenes.
•  Distribución de espacios • Para jerarquizar titulos
•  Uso del color

•  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    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 mucha
2. Briefing información que debe estar muy bien organizada, y ser accesible para gran variedad de
•  Proceso de indagación
usuarios, de manera, hay que intentar equilibrar este punto con el diseño, para crear una
•  Conclusiones
web accesible y que los distintos usuarios puedan entender.
•  Propuesta • Me ha llevado mucho tiempo encontrar el sistema de navegación adecuado e integrarlo
3. libro de estilos con el diseño.
•  Mapa Web

•  Distribución de espacios
• Lo que ves en otras Web (por muy fácil que te parezca), a menudo no puedes tenerlo en
la tulla.
•  Uso del color

•  Sistema de navegación • Con mis conocimientos de Web, que en este punto son más de los que yo esperaba, las
•  Tecnologías y lenguajes 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 ciertos
•  Estrategia tipográfica
recursos para emplearlos en la web que me han dejado poco tiempo para el diseño y
•  Recursos gráficos e interactivos
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,
•  Sobre Artem aunque pienso que es mejorable y que aun queda mucho por hacer.
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 cual-
•  Mapa Web quier tipo de sitio Web (no es necesaria una feria de recursos) , pero si no los tienes,
•  Distribución de espacios tienes una web corriente, vacía y sin personalidad. Yo he creado algunos que habéis
•  Uso del color visto, pero creo que faltan algunas llamadas de atención “potentes” que comuniquen al
•  Sistema de navegación usuario y le inviten a interactuar. Tengo que trabajar en ello.
•  Tecnologías y lenguajes
• Queda poco tiempo y mucha tarea, seguiré trabajando como hasta ahora para intentar
•  Diseño de la interacción
entregarla a tiempo sin hacer una chapuza.
•  Estrategia tipográfica

•  Recursos gráficos e interactivos


4. Conclusiones

You might also like