Vergel 439
Título | Vergel 439 |
---|---|
Tipo de Proyecto | Proyecto de Taller |
Palabras Clave | diseño web, wordpress, incendio, Valparaíso |
Período | 2014-2014 |
Asignatura | Taller de Diseño Gráfico 6ª Etapa, Taller de Diseño Gráfico 7ª Etapa, |
Del Curso | 4º DG 2014, |
Carreras | Diseño Gráfico"Diseño Gráfico" is not in the list (Arquitectura, Diseño, Magíster, Otra) of allowed values for the "Carreras Relacionadas" property., Interacción"Interacción" is not in the list (Arquitectura, Diseño, Magíster, Otra) of allowed values for the "Carreras Relacionadas" property. |
Profesor | Herbert Spencer, Katherine Exss |
Estudio de casos de usuario
Mapa de actores
Iconografia de los actores
Luego de analizar temporalmente todos los actores que participaron en esta catastrofe identificamos algunos que fueron los mas nombrados y principales. Para poder identificar de mejor manera los distintos actores se pensó en hacer iconos de 3 colores distintos para diferenciarlos, a continuación se muestran los 3 grandes grupos y los iconos de cada actor
Voluntarios
Gobierno
Externos
Sustentabilidad del proyecto
Fondos consursables para Vergel 439
Los siguientes fondos fueron seleccionados después de un levantamiento de información, dejando solo los fondos que se podría llegar a postular para financiar el proyecto, indicando a quienes va destinado y cuando es el monto al cual se puede postular.
Fondos pertenecientes al FONDART
- FONDART Regional: Desarrollo Cultural Regional:
Asociatividad Artística Cultural: Ofrece financiamiento total o parcial para proyectos que incentiven el trabajo colaborativo y asociativo, impulsando el desarrollo artístico y/o cultural a nivel regional.
Monto: $ 5.000.000
- Ventanilla Abierta:
Línea Apoyo Intercambio y Difusión Cultural: Esta línea de concurso tiene como objetivo contribuir a la difusión y circulación de artistas y mediadores culturales chilenos en espacios de intercambio artísticos y culturales relevantes en el país, con motivo de una invitación, selección, clasificación, compromiso, participación o inscripción en eventos, certámenes, seminarios, congresos, espacios de residencias artísticas, y actividades afines, que contribuyan al fomento profesional de las Artes y la Cultura.
Monto: $ 5.000.000
Organizaciones Culturales: Esta Línea de concurso tiene por objetivo entregar financiamiento parcial para organizaciones culturales que contribuyan al desarrollo artístico y cultural del país.
Monto: $ 150.000.000 ($50.000 por año, asociado a una institución)
Fondos pertenecientes a la PUCV
- Confía: Fondo concursable de la Dirección de Asuntos Estudiantiles y la Vicerrectoría Académica, dedicado a los estudiantes de pre grado de la PUCV que tengan interés en desarrollar ideas relacionadas con la promoción del arte y la cultura a través de actividades de extensión académica (seminarios, charlas, conferencias, entre otros)
Monto: No se especifica
- Acción social: Fondo concursable de la Dirección de Asuntos Estudiantiles y la Vicerrectoría Académica, dedicado a los estudiantes de pre grado de la PUCV que tengan interés en desarrollar ideas relacionadas con la ayuda social, donde el eje central sea la responsabilidad social.
Monto: No se especifica
Fondos pertenecientes al sector Privado
- Centro Cultural del Banco Interamericano del Desarrollo: Los objetivos del programa son:
· Reconocer y estimular las actividades de capacitación de centros de desarrollo cultural que comuniquen y difundan experiencias institucionales o comunales dignas de ser aprovechadas local o regionalmente.
· Favorecer la preservación y restauración del patrimonio histórico cultural.
· Ayudar a la formación de gestores culturales, la recuperación de tradiciones y el desarrollo de manifestaciones artísticas.
Monto: Entre US$3.000 hasta un máximo de US$7.000 dólares americanos.
- Suelten las lucas: Lo que busca Suelten Las Lucas es la cooperación colectiva para recaudar financiación a través de donaciones en dinero, de personas naturales y jurídicas que quieran ver realizado un proyecto cultural. Es transformar la economía hacia el bien común.
Monto: No se especifica
- Unesco: Fondo Internacional para la Diversidad Cultura:
El Fondo Internacional para la Diversidad Cultural es una manera de apoyar la aplicación de la Convención y fomentar el surgimiento de un sector cultural dinámico en los países en desarrollo.
Monto: No se especifica
Contenidos
Arquitectura de información
La estructura del sitio se subdivide en los siguentes temas:
- Contenido de inicio
- Concurso ideas
- Participa
- Regístrate
- Últimas ideas
- Últimos relatos
- Prensa relacionada
- Concurso ideas
- Menú superior
- Vergel439
- Concurso
- Bases
- Participa
- Relatos
- Ideas
- Mapa
- Mapa Valparaíso
- Estudios
- Mapa de actores
- Estudios
- Prensa
- Prensa nacional
- Prensa internacional
- Iniciar sesión/registro
- Regístrate
- Iniciar sesión
- Footer
- contacto
- colaboradores
- Sitios de colaboradores
- Redes sociales
Partituras de interacción
Redacción de textos
Archivo:Esquemavergel1.pdf Comentarios de Usuarios a razón de los textos presentes en el sitio
Archivo
Prensa
Objetivo
El principal objetivo de esta sección es informar al usuario acerca de los hechos que han ocurrido desde el 12 de abril pero a través de las noticias.
Se mantiene al usuario informado acerca de las más recientes usando como medio el inicio de la página web.
Categorías
Se realizan difertes categorías para la realización de un filtro para cada noticia; de manera de poder etiquetarlas para su búsqueda.
- Nacionalidad: nacional / internacional (país)
- Medio: impreso / online
- Fuente: sitio o diario
- Fecha: día de publicación
- Autor: quien la escribió / publicó
- Tema: campañas de ayuda/ informativa / reportajes o relatos/ entrevistas/ política
- URL: dirección web (hecha link)
Etiquetas
Las noticias luego de pasar por una selección fueron subidas a Wordpress, donde fue necesario subirlas y clarificarlas para leer de manera ordenada. Las etiquetas consisten en el nombrar una serie elementos dentro de cada categoría.
NACIONALIDADES
- Nacional (52)
- Internacional (52)
MEDIO
- Online (104)
- Impreso (0)
`FUENTES
- 24-horas (9)
- 24h-montrea (2)
- ahora-noticias (1)
- ajeno (1)
- armada-de-chile (1)
- autogestion (1)
- bbc-news (2)
- biobio (1)
- chicago-tribune (2)
- clarin (2)
- cnn (2)
- cooperativa (1)
- de-verdieping-trouw(1)
- der-standard (1)
- diario-registrado (1)
- die-welt (1)
- el-correo (1)
- el-desconcierto (1)
- el-espectador (1)
- el-matutino (2)
- el-mercurio-de-calama(1)
- el-mostrador (1)
- el-mundo (1)
- el-pais (2)
- el-tiempo (2)
- emol (7)
- france-info (1)
- il-fatto (1)
- indian-express (1)
- istoe-dinhero (1)
- la-jordana (1)
- la-prensa (1)
- la-segunda (1)
- la-tercera (6)
- l'avenir (1)
- le-monde (2)
- le-nouvel-observateur(3)
- liberation (3)
- minuto-uno (1)
- nrc (1)
- onemi (2)
- pagina-12 (1)
- plataforma-urbana (1)
- publico (1)
- publimetro (1)
- puranoticia (5)
- redvalparaiso (1)
- resumen-irc (1)
- sindical (1)
- south-china-morning-post(1)
- spiegel (1)
- telam (3)
- terra (1)
- the-australian (1)
- the-globe-and-mail (1)
- the-guardian (1)
- the-telegraph (2)
- tribune-de-geneve (1)
- ucv-radio (4)
- usa-today (1)
- usm (1)
- zeit (1)
TEMA
- Reportajes o Relatos(51)
- Entrevistas (1)
- Informaciones (52)
WEB
- Wordpress
En cada noticia fue necesario color una base como PLATAFORMA de formatos de Wordpress para que pudiese tener un orden de lista desordenada.
- Título de la Noticia
- Estructura dentro de la noticia
<strong>Bajada de la noticia</strong> <ul class="ficha-prensa"> <li><span class="label">Nacionalidad:</span> Nacional</li> <li><span class="label">Medio:</span> Online</li> <li><span class="label">Fuente:</span> Emol</li> <li><span class="label">Fecha:</span> 13/05/2014</li> <li><span class="label">Autor:</span> -</li> <li><span class="label">Tema:</span> Relatos o Reportajes</li> <li><span class="label">URL:</span> <a href="URL" title="url" target="_blank">URL</a></li> </ul>
- HTML
La estructura de ficha debe tener un formato HTML que permita definir un estilo posteriormente. pueden ser elementos de una lista (ul.ficha) y dentro de cada
<li> un <span class='label'> (para la etiqueta)
<html> <link type="text/css" rel="stylesheet" href="css/aaa.css"> <link href='http://fonts.googleapis.com/css?family=Open+Sans: 400,300,600,700,400italic' rel='stylesheet' type='text/css'> <link href='http://fonts.googleapis.com/css?family=Merriweather: 400,300,400italic,700' rel='stylesheet' type='text/css'> <meta charset="utf-8"> <head> <title></title> </head> <body> <h1> Título de la noticia</h1> <h2><p>fecha</p><p>autor</p></h2> <h3>Bajada de Título</h3> <p>texto noticia</p> <ul class="ficha-prensa"> <li> <span class='label'>Nacionalidad:</span> Nacional</li> <li> <span class='label'>Medio:</span> Online</li> <li> <span class='label'>Fuente:</span> 24 Horas</li> <li> <span class='label'>Fecha:</span> Martes 29/04/2014</li> <li> <span class='label'>Autor:</span> -</li> <li> <span class='label'>Tema:</span> Informaciones</li> <li> <span class='label'>URL:</span> <a href="http:////URL<" title="vybujnm" target="_blank"> http://URL</a></li> </ul> </body> </html>
- CSS
Ésta estructura corresponde al estilo que se le da al HTML anterior.
ul.ficha-prensa { background-color: #eee; padding: 20px; font-size: 12px; font-family: 'Open Sans', sans-serif; font-style: normal; list-style: disc; list-style-position: center; border-radius: 4px; box-shadow: 0 0 1px rgba(0, 0, 0, .1) inset; line-height: 200%; } ul.ficha-prensa li{ list-style-type: none; } ul.ficha-prensa li span.label{ display: inline-block; width: 90px; text-align: right; max-height: 5px; font-weight: bolder; } ul.ficha-prensa li a{ color: #C00; }
Estudios
Según la RAE se entiendo como un estudio una obra en que un autor estudia y dilucida una cuestión; en este caso es aplicado a Valparaíso y su aún reciente catástrofe. Se considera pertinente la utilización de los antecedentes previos que tengan que ver con el incendio de Valparaíso y claramente los posteriores de la materia. Buscando principalmente darle cabida a los trabajos que tratan de entregar posibles soluciones a los problemas que se han ido manifestando tanto con el incidente en si mismo como con los problemas anteriores al incendio.
Estudios publicados
- Luis Álvarez en Tolerancia Cerro, Amenaza Colosal por Pastor Mellado[1]
- Carta Abierta a la Ciudadanía por Carlos Jorge Avedaño Cass [2]
Estudios pertinentes por publicar en sitio
Proyectos que se presenten en la exposión del Parque cultural de Valparaíso en el mes de Junio.Estos se clasifican en estudios realizados y los proyectos por realizar.
Estudios externos a la exposición que se relacionen con Valparaíso, para lo cual se extendera una invitación para compartir proyectos directamente en el sitio.
Proyectos e[ad] PUCV
Mapa
Incorporar en el sitio el mapa del levantamiento de información para la ayuda post incendio, especificando instalaciones utilizadas como centros de acopio, de albergue, de ayuda a animales, centros médicos, además de puntos de encuentro de cuadrillas de trabajo, medios de transporte y la ubicación de la casa ruina que será utilizada como espacio sociocultural.
Modo de trabajo
Investigar plataformas para generar mapas interactivos:
Edición de mapa
1º Separación de capas
Se extrae información de Google Maps Engine (mapa de Levantamiento Valparaíso incendio), a través de la exportación de archivos en formato kml, el cual contiene datos geográficos y sus características. Estos se encontraban divididos en cuatro grupos:
- Todo el mapa
- Centros de salud y atención médica
- Centros de acopio y albergue
- Zonas afectadas
Teniendo el archivo se importa en un nuevo proyecto de mapbox online en donde se van separando cada capa de información en un mapa diferente para posteriormente exportarlos al formato kml nuevamente.
- Acopio
- Albergue
- Cuadrilla
- Junta vecinal
- Catastro
- Centros médicos
- Ayuda animales
- Transporte
- Vergel 439
2º Creación de capas en Tilemill
Una vez obtenidos los archivos kml, estos se incorporan como una capa en el programa Tilemill (herramienta de escritorio para crear mapas interactivos basado en CartoCSS), generando inmediatamente un estilo en formato mss para los puntos marcados dando un color y tamaño predeterminado. Para reemplazar lo puntos por los íconos realizados, dentro de el estilo se ingresa la ubicación de la imagen junto con las características para la visualización.
Map { } #vergel4391 { marker-file:url("C:\Users\Administrador\Documents\Marker mapa final\vergel439.svg"); marker-width: 16px; marker-placement: interior; marker-allow-overlap:true; }
Para visualizar la información se ingresa a la plantilla en donde se escribe en código html dentro de la casilla de "posarse sobre el punto" y en la de "hacer click sobre el punto".
<!DOCTYPE html> <html> <head> </head> <body> <style> #container {display: block; width:280px;} h1 {font-family: 'Merriweather', 'Georgia'; font-size: 16px; text-align:center;} img {width:24px; z-index:1;} #header {height:28px; background-color:rgba(157, 31, 40, 0.8); border-radius:3px; z-index:0;} #icon {width:26px; height:26px; padding: 2px; float:center; margin:auto;} #title {padding-top:4px;} </style> <div id="container"> <div id="header"> <div id="icon"> <img src="http://www.clker.com/cliparts/b/3/2/1/14000190441065044319blanco_vergel439.svg"> </img> </div> </div> <div id="title"> <h1>{{{Name}}}</h1> </div> </div> </body> </html>
Este código contiene una imagen en svg sobre un header de color, la cual tiene que ser subida a la web para poder llamarla. [3]
Ya realizado esto se exporta en formato mbtiles cada una de las capas
3º Incorporar capas a Mapbox online
Se suben los archivos mbtiles en la sección "Data" de mapbox generando una capa única para cada grupo de datos. Esta se denomina con el nombre de usuario y una sucesión de números y letras
Ej: cindysanhueza.x5j2hvsr
4º Unión de capas en mapa interactivo generado con código Html
En un archivo html se comienza colocando la cascada de estilo y JavaScript de mapbox para poder llamar al mapa y éste no pierda sus propiedades.
<!DOCTYPE html> <html> <head> <meta charset=utf-8 /> <title></title> <script src='http://api.tiles.mapbox.com/mapbox.js/v1.6.0/mapbox.js'></script> <link href='http://api.tiles.mapbox.com/mapbox.js/v1.6.0/mapbox.css' rel='stylesheet' />
A continuación se agrega el estilo de los botones que cumplirán la función de manejar el aparecer de las capas.
<style> body { margin:0; padding:0; } #map { position:absolute; top:0; bottom:0; width:100%; } </style> </head> <body> <style> #map-ui { position: absolute; top: 75px; left: 10px; list-style: none; margin: 0; padding: 0; z-index: 100; } #map-ui a { font: normal 13px/18px 'Helvetica Neue', Helvetica, sans-serif; background: #FFF; color: #3C4E5A; display: block; margin: 0; padding: 0; border: 1px solid #BBB; border-bottom-width: 0; min-width: 138px; padding: 10px; text-decoration: none; } #map-ui a:hover { background: #ECF5FA; } #map-ui li:last-child a { border-bottom-width: 1px; -webkit-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; } #map-ui li:first-child a { -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; } #map-ui a.active { background: #3887BE; border-color: #3887BE; border-top-color: #FFF; color: #FFF; } </style>
Para generar el mapa se coloca el código del que va a ser el mapa base, junto con las coordenadas del punto de enfoque inicial. Posteriormente se llama a las capas de información ubicadas en mapbox.
<ul id='map-ui'></ul> <div id='map'></div> <script type='text/javascript'> var map = L.mapbox.map('map', 'j-ulzurrun.i608i6d4').setView([-33.062, -71.613], 13); var ui = document.getElementById('map-ui'); var vergel439 = L.mapbox.tileLayer('cindysanhueza.x5j2hvsr'); var albergues = L.mapbox.tileLayer('cindysanhueza.yzs7oukh'); var acopio = L.mapbox.tileLayer('cindysanhueza.nfngxo1c'); var catastro = L.mapbox.tileLayer('cindysanhueza.xl16c1ti'); var juntas = L.mapbox.tileLayer('cindysanhueza.zwgi4bji'); var cuadrillas = L.mapbox.tileLayer('cindysanhueza.0onyss2k'); var salud = L.mapbox.tileLayer('cindysanhueza.sxft76tq'); var animales = L.mapbox.tileLayer('cindysanhueza.51suxixd'); var transporte = L.mapbox.tileLayer('cindysanhueza.e4ke2xwk');
Se escribe el nombre de cada botón junto a la capa
addLayer(vergel439, L.mapbox.gridLayer('cindysanhueza.x5j2hvsr'),'Vergel 439', 1); addLayer(albergues, L.mapbox.gridLayer('cindysanhueza.yzs7oukh'),'Albergues', 2); addLayer(acopio, L.mapbox.gridLayer('cindysanhueza.nfngxo1c'),'Acopio', 3); addLayer(catastro, L.mapbox.gridLayer('cindysanhueza.xl16c1ti'),'Catastro y Documentos', 4); addLayer(juntas, L.mapbox.gridLayer('cindysanhueza.zwgi4bji'),'Juntas Vecinales', 5); addLayer(cuadrillas, L.mapbox.gridLayer('cindysanhueza.0onyss2k'),'Cuadrillas', 6); addLayer(salud, L.mapbox.gridLayer('cindysanhueza.sxft76tq'),'Centros Médicos', 7); addLayer(animales, L.mapbox.gridLayer('cindysanhueza.51suxixd'),'Ayuda Animal', 8); addLayer(transporte, L.mapbox.gridLayer('cindysanhueza.e4ke2xwk'),'Transporte', 9);
Finalmente se describe la función de los botones para ejercer el mecanismo de visualizar y ocultar cada una de las capas.
function addLayer(layer, gridlayer, name, zIndex) { layer .setZIndex(zIndex) .addTo(map); gridlayer .addTo(map); // add the gridControl to the active gridlayer var gridControl = L.mapbox.gridControl(gridlayer, {follow: false}).addTo(map); // Create a simple layer switcher that toggles layers on and off. var item = document.createElement('li'); var link = document.createElement('a'); link.href = '#'; link.className = 'active'; link.innerHTML = name; link.onclick = function(e) { e.preventDefault(); e.stopPropagation(); if (map.hasLayer(layer)) { map.removeLayer(layer); map.removeLayer(gridlayer); this.className = ''; } else { map.addLayer(layer); map.addLayer(gridlayer); this.className = 'active'; } }; item.appendChild(link); ui.appendChild(item); } </script> </body> </html>
Primera propuesta
Primero se importa la información del mapa "Levantamiento Valparaíso Incendio" trabajado por profesores y alumnos de la escuela en la aplicación Google Maps Engine al editor online de Mapbox, el cual permite customizar los colores de los atributos del mapa (calles, áreas, territorio, markers, poligonos, etc), además permite colocar un ícono de Maki Project a los markers para poder distinguirlos. El editor online de Mapbox genera el código para poder embeber el mapa creado en el sitio. Ver aquí
Segunda propuesta
Incorpora los nuevos íconos, el nombre de cada lugar y genera una mayor interacción con el usuario al incluir la visualización de cada capa por separado. Ver aquí.
Iconografía
Los iconos para al mapa se encuentran en la misma ídea que el logotipo: tan simple como sea posible para identificar rápidamente lo que es, y el diseño de estilo flat design. La primera identificación es posible por el color. La segunda, gracias a los iconos.
Wireframes
Wireframes primera etapa
wireframes pc
wireframes movil
vertical
- Menú vertical (15).png
Menú
horizontal
- Menú horizontal (16).png
Menú
Wireframes segunda etapa
wireframes pc
wireframes movil
wireframe vertical
wireframe horizontal
Wireframes propuesta
wireframe pc
wireframe movil
wireframe vertical
wireframe horizontal
Diseño
Logo
Influencia
Eduardo Chillida
Si bien es conocido especialmente en su faceta como escultor, comenzó a experimentar con las diferentes técnicas del grabado a partir de 1959, en las cuales se puede apreciar la construcción de la luz a través del negro, que juegan de manera variante para crear figuras y vacíos que construyen un espacio mediante la abstracción.
Primera propuesta
no demoler
Se decide mantener palabras claves que aparecen en la carta abierta escrita por el profesor Luis Alvarez en donde dice los vecinos quieren demoler todo "rastro", las ruinas "no se demuelen". y en la que pide explícitamente que rayen no demoler en los muros, además que es básicamente la finalidad del concurso, mantener y resguardar las huellas que quedan a través de la experiencia.
439
Del mismo modo se decide que la numeración de la casa 439 es relevante, ya que a pesar de que el incendio haya arrasado con todo, incluso las señaléticas del lugar, es algo intangible que permanece, la numeración indica la propiedad privada que ahora pasa a ser pública, es algo que no desaparece.
Segunda propuesta
Recuperando Valpo
Esta idea nació luego de una lluvia de ideas en donde se escogieron ciertas palabras que se reiteraban tanto en la carta de Luis Alvarez, como en las bases del concurso que escribió Gregorio Garretón, y algunas que engloban a otras como: memorial, vestigio, ruinas, preservar, conservar, recuperar. En otra categoría se encuentran aquellas que hacen alusión a lo sucedido como: catástrofe, incendio, siniestro. La tercera categoría hace alusión al contexto ¿dónde ocurrió?: cerro, la cruz, Valparaíso, Valpo y finalmente ¿qué es? ¿a quién va dirigido?: voluntarios, gente, concurso, ideas.
Finalmente se escogió Recuperando valpo, como un eslogan ya que el término recuperar proviene del idioma latín, en donde re significa reiteración y capere significa tomar. El acto de recuperar supone volver a tomar, o utilizar algo que ya había sido desechado o que hacía tiempo había perdido su uso. Además hace alusión a una catástrofe de manera implícita. Valpo se escogió ya que crea contexto sin excluir lugar ni personas y es la forma de decir más cercana y conocida por los porteños.
Tercera propuesta
Memoria Porteña
Esta propuesta recae en tres elementos, un círculo de color rojo opaco, que recae en lo vivo del fuego y de la memoria de esta tragedia, mientras que el segundo elemento es la contra forma de la casa de Luis Álvarez, sin embargo, no se busca representar a ésta, sino, que se toma ésta como concepto de ruina.La tercera corresponde a los textos."Memoria Porteña", estas buscan incorporace dentro de la circurferencia,o esquinandose, o bien, integrandose a la forma de la casa.
"Memoria Porteña" es un nombre que hace referencia de una manera cercana a la gente de Valparaíso. A través del término "memoria" queremos hacer viva una experiencia que contiene un largo recorrido y que hoy en idea sigue motivando a muchas personas a la construcción de un relatoo en conjunto el cual hoy nos motiva a trabajar en esto.
Cuarta propuesta
vergel 439
Intentando hacer un logo con rasgos mas notorios y sin tantos detalles y rescatando la influencia de Chillida, se crean formas y contraformas con la tipografía, para que ésta se integre de mejor manera al logo. Se continúa utilizando la imagen de la casa, pero se mantiene la forma más significativa.
Las primeras variaciones del logo fueron desechadas ya que no se lee correctamente la marca y 439 toma un mayor protagonismo
Quinta Propuesta
La casa quedó en ruinas, al igual que muchas que la rodeaban, sin embargo ésta tiene dos particularidades que se intentan rescatar a través del logo:
- su altura
- su ventana circular
esta imagen o signo se puede ver desde muchos lugares, y es reconocible a simple vista.
Propuesta final
Color
se pensó utilizar colores traídos desde el lugar donde se ubica las ruinas, sin embargo estos colores eran muy apagados para la página web; color ladrillo, gris ceniza además tenían una gran vibración. Es por esta razón que se usó el rojo # B81823 con el negro, que funcionan bien en la web y tienen tonalidades similares a las escogidas en un comienzo. El rosado #E84E59 nació de la variación del rojo, para crear una combinación monocromática.
Tipografía
se utilizan dos familias tipográficas, una con serif y otra palo seco, para que haya un mayor distingo y por que el sitio tiene una gran cantidad de textos
- Merriweather
- open sans
Interfaz
Primer Estado
- Vergel 439 galería primera propuesta.jpg
Galería de Imágenes.
Estado Actual
Desktop
- Contenido del sitio
- Navegación del Header
- Navegación del Footer
Tablet
- Contenido del Sitio
- Navegación de Header
Smartphone
- Contenido del Sitio
- Navegación de Header
Propuesta Nueva Interfaz
- Propuesta 3 interfaz vergel 439-01.png
Home.
Construcción front
Tema
Plugins
Plugins de WordPress utilizados para añadir diferentes funcionalidades al sitio:
- Advanced Custom Fields
- Akismet
- Contact Form 7
- Disqus Comment System
- Lightbox Plus ColorBox
- Profile Builder
- PureTheme Slide Social Tabs
- Regenerate Thumbnails
- WordPress Importer
- WP-PageNavi
- WP Twitter
- WP User Frontend
- WTI Like Post
- Really simple facebook twitter share button
- MapBox
Parche de traducción al español para el plugin Profile Builder:
Un problema detectado en el plugin utilizado para la creación de cuentas de usuario por fornt-end fue que no contaba con la opción de modificar los campos de formulario ni los mensajes del proceso en el panel de admninistración de wordpress, por lo tanto, fue necesario modificar cada uno de estos campos manualmente desde los archivos PHP, y respaldarlos, creando así este parche, como una medida contra la pérdida de esta traducción producida al sobreescribirse los archivos PHP cada vez que se actualiza el plugin, y para facilitar este proceso a toda persona que desee una versión en español de Profile Builder.
Mapa de divs
Difusión
Mecánicas del concurso
Bases del concurso
1. Introducción
Producto del trágico siniestro que afectó a la ciudad de Valparaíso el pasado 12 de abril de 2014, el académico Luis Álvarez Aránguiz, y su familia, damnificados en estos sucesos, han decidido disponer de las “ruinas” de su vivienda ubicada en el Vergel 439 del Cerro La Cruz de Valparaíso, para desarrollar un “Concurso Ideas y Relatos” que convoque ideas orientadas a crear un espacio socio-cultural que rememore este acontecimiento. Este Concurso busca ideas para la generación de este lugar que pretende crear la Memoria del Incendio, así como también, el registro de la experiencia de todos quienes voluntariamente apoyaron en los cerros, los días posteriores a la Tragedia.
2. Antecedentes
Son las ruinas de la mayor “tragedia urbana” de Valparaíso, ciudad que vive de la desgracia para refundarse constantemente, con la particularidad de la ciudad Puerto; que se funda y re-funda con el testimonio, que es comunitario y abierto para todos. El propósito de este lugar, es crear una memoria para la ciudad, para quienes la habitan hoy y en un futuro. Será el recuerdo de lo frágil que es el hombre frente a realidades urbanas adversas, asimétricas y excluidas.
3. Convocatoria
Este primer paso para la construcción de la Memoria del Incendio en El Vergel 439, se presenta a modo de Concurso de Ideas y Relatos, que busca registrar la experiencia vivida por cada una de las personas; los que apoyaron en los Cerros de Valparaíso como voluntarios; las familias damnificadas; y los testimonios varios de los espectadores a lo largo de la Región.
La participación busca rescatar la esencia de la experiencia personal vivida en las distintas labores realizadas. La suma, convergencia y divergencia de estas experiencias e ideas harán surgir los siguientes pasos para la construcción del lugar de la Memoria del Incendio. Esta convocatoria es abierta y se extiende a todos quienes quieran participar. Las ruinas de la casa están abiertas a quien quiera visitarlas a modo de guía para la elaboración de las propuestas.
4. Formato de entrega
El formato de entrega es libre, y deberá ajustarse al formulario web disponible en este sitio. Se podrá postular con el medio de expresión que más parezca al postulante (relato escrito, fotografìa, audio, video, dibujo, etc).
La propuesta se podrá clasificar en dos categorías;
(a) un relato de la experiencia antes mencionada (incorpora el registro).
(b) una idea acerca de qué debiera ser y/o cómo se debiera desarrollar en el tiempo, una Memoria-Ruina del Incendio.
Todas las postulaciones se recibirán por medio este sitio web y se podrá enviar la cantidad de propuestas que el participante desee.
5. Plazos
La convocatoria abre su periodo de recepción de propuestas el día jueves 15 de mayo de 2014 y finaliza el día 15 de junio de 2014 a las 23.59 horas.
6. Distinciones y autorías
Este Concurso de Ideas busca la generación de un fundamento y soporte para la posterior realización de un Concurso Profesional para el desarrollo del Proyecto y Construcción del lugar de la Memoria del Incendio en el Vergel 439, al mismo tiempo que se centra en la creación de un registro de las experiencias humanas y sociales vividas los días posteriores al incendio. Todo esto, será parte de una publicación posterior.
Los autores de la(s) idea(s) que resulten seleccionadas, serán invitados a participar en la generación de los siguientes pasos para la materialización del lugar de la Memoria del Incendio.
Existirá un jurado que evalúe las propuestas. Los integrantes de este jurado serán publicados próximamente.
Se entregarán premios a las postulaciones que resulten ganadoras, así como también las postulaciones que obtengan más valoraciones positivas dentro del sitio. Estos premios serán publicados próximamente.
Pasos para participar
Los que deseen participar en esta iniciativa deben:
1. Entrar al sitio www.vergel439.cl
2. Registrarse ingresando sus datos
- Nombre
- Apellido
- Biografía (opcional)
- Contraseña
3. Llenar ficha de postulación
- Título
- Categoría
- Tu historia
- Etiquetas
Redes sociales
Para llegar de manera mas rápida a las personas y poder dar a conocer a iniciativa, se crearon cuentas en los 2 sitios mas populares en lo que a medios digitales se refiere, estos son Facebook y Twitter.
Al principio se decidió crear una cuenta (un perfil) de facebook pero debido a que este no aceptaba el nombre Vergel como uno real, se creo una página de facebook la cual es administrada por varios alumnos del taller.
[ https://twitter.com/Vergel439 Cuenta en Twitter]
Cabe destacar que ambos sitios están relacionados con el sitio, estos automáticamente publican cualquier nuevo articulo aportado.
Ambas cuentas fueron creadas con una cuenta en gmail. elvergel439@gmail.com
Imagen
Se decidió acompañar al logo con una imagen que de a conocer la procedencia de este, haciendo visible la punta característica del techo, familiarizando a las persona con lugar.
Prensa
Afiche
Se realizan 2 propuestas para ser difundidas de manera impresa y digitalmente.
En ambos se decide trabajar con escala de grises debido al gran contraste que se genera en el blanco de las páginas, además que trabajar a un color reduciría los costos de impresión.
- Son utilizadas las mismas tipografías que se encuentran en el sitio web.
Afiche 1
Afiche 2
Afiche Estudios