equipamentos/index.html
2017-12-01 05:51:24 -05:00

337 lines
21 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Datos Visuales SIP-EC</title>
<!-- CSS -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet">
<!-- jQuery Content Delivery Network -->
<script src="https://code.jquery.com/jquery.js"></script>
<script src="https://cdn.wordart.com/wordart.min.js" async defer></script>
<!-- Java Script cdn -->
<script src="js/d3.js" charset="utf-8"></script>
<script src="js/d3.layout.cloud.js"></script>
<script src="js/d3.wordcloud.js"></script>
<script src="js/bitacorasmt.json"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<link href="css/datos_visuales.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Carter+One" rel="stylesheet">
</head>
<body data-spy="scroll" data-target=".navbar" data-offset="50">
<!-- Static navbar -->
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="#home"><span class="glyphicon glyphicon-home" aria-hidden="true"></span></a></li>
<li><a href="#datos">Datos Abiertos</a></li>
<li><a href="#activaciones">Activaciones</a></li>
<li><a href="#microtalleres">Microtalleres</a></li>
<li><a href="#recursos">Recursos</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</nav>
<!--/sección Inicio o Home -->
<section class="container-fluid" id="home">
<div class="container">
<img src="svg/infografia_inicial.png" class="img-responsive" alt="Infográfico inicial">
<div class="row">
<div class="col-sm-4">
<div class="row">
<div class="col-sm-10 col-sm-offset-2 text-center"><h3>Activamos</h3><p>Promovemos la Transparencia para propiciar el establecimiento de una cultura de acceso a la información pública y de reutilización de los datos abiertos.</p><span class="glyphicon glyphicon-search " aria-hidden="true"></span></div>
</div>
</div>
<div class="col-sm-4 text-center">
<div class="row">
<div class="col-sm-10 col-sm-offset-1 text-center"><h3>Creamos Memoria</h3><p>Impulsamos la conservación de memoria y el seguimiento de los procesos, desarrollando mayores y mejores mecanismos que prioricen el interés colectivo.</p><span class="glyphicon glyphicon-user" aria-hidden="true"></span></div>
</div>
</div>
<div class="col-sm-4 text-center">
<div class="row">
<div class="col-sm-10 text-center"><h3>Vinculamos</h3><p>Fortalecemos la participación ciudadana efectiva y fomentamos la acción colectiva, consolidando así procesos de mayor impacto, más representativos y vinculantes.</p><span class="glyphicon glyphicon-stats" aria-hidden="true"></span></div>
</div>
</div>
</div>
</div><!--/row-->
<p class="linea-texto">
<span>Consolidado Equipamentos Culturales</span>
</p>
<div class="container">
<div class="row">
<!--/convenciones colores casa de cultura-->
<div class="col-sm-6">
<img class="img-responsive logo"src="https://casasdecultura.bibliolabs.cc/milfs/images/secure/?file=600/a12167d2f257539b33cd2ca3ac619f20.png" alt="logo-SIP-Equipamentos-Culturales">
<p>* Los datos contenidos en las siguientes visualizaciones, son resultado de la
información colectada, entregada, consolidada y procesada
a través del SIP.</p>
</div>
<!--/convenciones colores casa de cultura-->
<div class="col-sm-6">
<p>Con el SIP buscamos mediante un modelo de manejo de <strong>Datos Abiertos</strong>, colectar datos de forma ágil para dar accesibilidad a todos los vinculados e interesados en los procesos de los equipamentos; se puede ver como un sistema para la creación de formularios que realmente se convierten en aplicaciones web y móbil que al manejar el ingreso de datos de manera semántica permite su posterior interpretación y procesamiento para generar gráficas, estadísticas, visualizaciones, adelantar reportes e informes, medir tendencias, comprender impacto, hacer seguimiento.</p>
<p>
Nuestra estrategia para la capturar de toda la información que generan los Equipamentos y almacenarla de manera estructurada, que permita articular cientos de hojas electrónicas y documentos desorganizados en un sistema de datos mediante un subsistema de importación que permite subir datos almacenados en un archivo CSV.</p>
<div class="row">
<div class="col-8 col-sm-6">
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#FCB53E;" />
Lo sentimos, su navegador no soporta svg en línea
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#009CDE;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span> Ávila</span></br>
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#0096B3;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span>Alcázares</span></br>
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#733A8E;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span>Las Estancias</span></br>
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#CD0081;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span>Manrique</span></br>
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#E56D00;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span>Pedregal</span></br>
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#00803A;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span>Popular</span></br>
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#949494;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span>Teatro Lido</span></br>
</div>
<div class="col-4 col-sm-6">
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#FCB53E;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span>UVA Sol de Oriente</span></br>
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#2ECDDA;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span>El Poblado</span></br>
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#ED1C24 ;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span>Los Colores</span></br>
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#FCEE21 ;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span>Teatro al Aire Libre Pedregal</span></br>
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#D9E021;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span>UVA Nuevo Occidente</span></br>
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#C69C6D;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span>UVA Sin Fronteras</span></br>
<svg width="80" height="50">
<rect x="50" y="20" width="80" height="50" style="fill:#FF7BAC;" />
Lo sentimos, su navegador no soporta svg en línea
</svg>
<span>UVA El Paraiso</span>
</div>
</div>
</div>
</div>
</div>
</section>
<section class="container-fluid" id="datos">
<div class="container">
<p class="linea-texto">
<span>Estrategia de Datos Abiertos</span>
</p>
<div class="col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 col-lg-8 col-lg-offset-2 text-center">
<p class="lead">El SIP busca la consolidación del Sistema de Monitoreo,Seguimiento Evaluación y Control SMEyC en una plataforma centralizada que permite la gestión de informes que al mismo tiempo facilita la entrega de instrumentos como la planilla resumen de actividades, sub, y demás instrumentos del sistema de calidad y a su vez entrega material versatil para las evaluaciones de escritorio a través de ficha de seguimiento, grupo focal y análisis de contenidos. </p>
</div>
<!-- Desplegables con formularios linkeados -->
<div class="row">
<div class="container">
<div class="row col-sm-12 text-center ">
<div class="col-xs-6 col-sm-3">
<button type="button" class="btn btn-lg btn-info" data-toggle="collapse" data-target="#propuesta">Proponemos <span class="glyphicon glyphicon-menu-down"></span></button>
<div id="propuesta" class="active collapse in">
<button type="button" class="btn btn-lg btn-warning btn-circle">1</button>
<p>Todo comienza con la propuesta.</p>
<h4>Objetivo: </h4>
<p>
Captar el valor, la motivación y capacidad de impacto de la propuesta
</p>
</div>
</div>
<div class="col-xs-6 col-sm-3">
<button type="button" class="btn btn-lg btn-info" data-toggle="collapse" data-target="#agenda">Agendamos <span class="glyphicon glyphicon-menu-down"></span></button>
<div id="agenda" class="active collapse in">
<button type="button" class="btn btn-lg btn-warning btn-circle">2</button>
<p>Con la aprobación se programa el evento</p>
<h4>Objetivo: </h4>
<p>
Calendario de eventos para divulgación y promoción en redes
</p>
</div>
</div>
<div class="col-xs-6 col-sm-3">
<button type="button" class="btn btn-lg btn-info btn-servicios" data-toggle="collapse" data-target="#registro">Registramos <span class="glyphicon glyphicon-menu-down"></span></button>
<div id="registro" class="active collapse in">
<button type="button" class="btn btn-lg btn-warning btn-circle">3</button>
<p>Con la realización del evento se crea el valor
</p>
<h4>Objetivo: </h4>
<p>
Consolidar el valor del evento a través de la bitácora
</p>
</div>
</div>
<div class="col-xs-6 col-sm-3">
<button type="button" class="btn btn-lg btn-info btn-servicios" data-toggle="collapse" data-target="#evaluar">Evaluamos <span class="glyphicon glyphicon-menu-down"></span></button>
<div id="evaluar" class="active collapse in">
<button type="button" class="btn btn-lg btn-warning btn-circle">4</button>
<p>El valor es recibido y la percepción se valida</p>
<h4>Objetivo: </h4>
<p>
Captar la percepción de los usuarios y participantes como insumo para agregar más valor
</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<!--Sección Activaciones -->
<section class="container-fluid" id="activaciones">
<div class="col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 col-lg-8 col-lg-offset-2 text-center">
<p class="linea-texto">
<span>Visualicemos las Activaciones</span>
</p>
<p class="lead">Conozcamos cómo van las activaciones, herramienta indispensable de la gestión cultural de los equipamentos, identificate, observa, compara y concluye, lo más importante es encontrar elementos que nos permitan informarnos para tomar mejores acciones y mejores decisiones </p>
<!-- <h1>Word Cloud</h1> -->
<div id='nubeactivaciones'></div>
<div style="width: 100%; height: 80%;" data-wordart-src="https://cdn.wordart.com/json/h1zzzt36dt3f" ></div>
<!--Subtítulo Objetivos - Publicos - Disciplinas -->
<p class="subtitulo">
<span>Objetivos, Público & Disciplina</span>
</p>
<div>
<p>Lo que queremos lograr mediante qué actividades y para qué público. Esta gráfica nos acompaña a comprender cómo se relacionan los públicos con las disciplinas culturales y como impacta esto los objetivos que queremos alcanzar. Ubícate y detalla cada hilo de conexión, indaga y saca tus conclusiones que te acompañen a proponer, transformar y mejorar</p>
<img src="svg/Activaciones-Objetivos-Disciplinas.svg" style="display:inline-block;"class="img-responsive" alt="Relación de Público y Presupuesto Microtalleres">
</div>
<!--Subtítulo -->
<p class="subtitulo">
<span>Presupuesto</span>
</p>
<div>
<p>Cada periódo invertimos mucha energía en desarrollar las activaciones; en esta gráfica puedes ver como se relaciona la inversión de presupuesto, con la cantidad de actividades realizadas por cada equipamento y el público potencial alcanzado </p>
<img src="svg/PresupuestoParticipantesActivaciones.svg" style="display:inline-block;"class="img-responsive" alt="Relación de Público y Presupuesto Microtalleres">
</div>
</div>
</section >
<!--Sección Microtalleres -->
<section class="container-fluid" id="microtalleres">
<div class="col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 col-lg-8 col-lg-offset-2 text-center">
<p class="linea-texto">
<span>Así van los Microtalleres</span>
</p>
<p class="lead">Con los Microtalleres vinculamos saberes de la comunidad, aprendizajes espóntaneos y preparados. Conoce la lectura del portal de Open Data del SIP de los Equipamentos y como ha sido el trabajo en torno a los Microtalleres</p>
<!-- <h1>Word Cloud</h1> -->
<div id='nubemicrotalleres'></div>
<div style="width: 100%; height: 80%;" data-wordart-src="https://cdn.wordart.com/json/8wqa464050pr" ></div>
<!--Subtítulo Presupuesto -->
<p class="subtitulo">
<span>Presupuesto</span>
</p>
<div class="row">
<div class="col-md-7">
<p>Cantidad de Microtalleres por Equipamento en relación al presupuesto y la cantidad de beneficiarios potenciales.</p>
<img src="svg/Total-Presupuesto-microtalleres.svg" class="img-responsive" alt="Relación de Público y Presupuesto Microtalleres">
</div>
<div class="col-md-5">
<img src="svg/Presupuesto-Circulos_microtalleres.svg" class="img-responsive" alt="Relación de Público y Presupuesto Microtalleres">
</div>
</div>
<!--SubSección Género -->
<p class="subtitulo">
<span>Género</span>
</p>
<img style="display: inline-block !important;"src="svg/Hombres-Mujeres_microtalleres.svg" class="img-responsive float-right" alt="Relación de Público y Presupuesto Microtalleres">
<!--Sub Sección Público Objetivo & Categorías -->
<p class="subtitulo">
<span>Público Objetivo & Categorías </span>
</p>
<img style="display: inline-block !important;"src="svg/Publicos-Disciplinas_microtalleres.svg" class="img-responsive float-right" alt="Relación de Público y Presupuesto Microtalleres">
</div>
</section>
<!--Sección Recursos -->
<section class="container-fluid" id="recursos">
<div class="col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2 col-lg-8 col-lg-offset-2 text-center">
<p class="linea-texto">
<span>Recursos</span>
</p>
<p class="lead">En esta sección encontrarás recursos resultado del proceso de recolección, análisis, minería y procesamiento de documentos para la extracción de datos que hacen posible estas visualizaciones. Así como los documentos relacionados con la estrategia que se propone para consolidar el SIP en los equipamentos culturales y con la comunidad.</p>
<div class="text-left">
<h3>Minería de datos desde los formatos de apoyo</h3>
<p><a href="https://docs.google.com/spreadsheets/d/16zt9qzrbJaHJf5VbCIE3a4kzw3rO4erpsWz3KC7wL4A/edit?usp=sharing" class="text-danger" target="_blank">Consolidado de datos</a></p>
<p><a href="https://docs.google.com/spreadsheets/d/1PE4XdRzhZMj5xT6vPG_q-SpiLtItQvPYdMN4LSUGAQo/edit?usp=sharing" class="text-danger" target="_blank">Set de datos insumo de las gráficas</a></p>
<h3>Presentaciones en PDF, estratégia de implementación y adopción</h3>
<p><a href="https://archive.org/download/1PresentacionDeResultados/1Presentacion_de_Resultados.pdf" target="_blank" class="text-success">Presentación final</a></p>
<p><a href="https://archive.org/download/EquipamentosCulturas/Equipamentos_Culturas.pdf" class="text-success">Presentación inicial</a></p>
<h3>Documentos de apoyo</h3>
</div>
</div>
</section>
<!-- <div style="width: 100%; height: 80%;">
<div id='wordcloud'></div>
<script>
d3.wordcloud()
.size([900, 600])
.fill(d3.scale.ordinal().range(["#2099a7", "#a4cc39", "#e5842c", "#b80d6b"]))
.words(words)
.onwordclick(function(d, i) {
if (d.href) { window.location = d.href; }
})
.start();
</script>
</div>
</div> -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="../../dist/js/bootstrap.min.js"></script>
<script src="../../assets/js/docs.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
<script src="scripts.js"></script>
</body>
</html>