Arpilleristas en Chile ¿Cómo un entorno digital da cuenta de dinámicas no digitales en comunidades artesanales?

Título	Proyecto de título - Angelica Andueza
Tipo de Proyecto	Proyecto de Titulación
Período	2025-2026
Del Curso	Interacción Material Territorial 2° semestre 2025
Carreras	Diseño
Alumno(s)	Angelica Andueza
Profesor	Daniela Salgado, Leonardo Aravena

Investigación

Investigación y análisis de plataformas de archivos históricos

Considerar que hay plataformas de base de datos (que recopilan archivos externos) y otras que presentan los archivos listos (en el mismo sitio) para descargar.

Archivo Nacional Histórico de Chile (ANH)

Empieza presentando su página y ejemplificando sus densidades de archivos (contextualiza).

Se presentan los siguientes botones:

• Catálogos en línea
• Guías de fondos documentales
• Cuadros sinópticos de fondos
• Instrumentos de descripción en sala
• Sitios personales
• “Nuestro proyecto”
• Colecciones digitales
• Otros mini sitios

Observaciones:

• Presentan un resumen de cada elemento
• Tienen archivos en venta, otros gratis
• No hay seguimiento de diseño en las distintas interfaces
• Tiene opción de escuchar textos!!

Cultura Digital UDP (Universidad Diego Portales)

Este sitio no tiene presentación ni resumen. Tiene una barra de informaciones en el margen superior.

Se divide en 6 grandes categorías:

Fotografías

• Colecciones
• Categorías
• Tags

(Presentan imágenes y sobre éstas una barra con las 3 categorías nombradas anteriormente, con palabras claves, facilitando así la búsqueda de archivos)

Documentos

• Colección de Extractos de Filiación y Antecedentes penales
• Colección Enrique Lim
• Fondo diario La Nación
• La Nación
• Colección Patricio Silva
• Manuscritos
• Planos
• Revistas

(Contextualizan cada archivo con una imagen, nombre y fecha. El cursor al pasar sobre estos hace que la imagen se oscurezca y crezca)

Videos

• Conferencias
• Documentales
• Exposiciones

Son videos de Youtube pero se pueden visualizar desde la misma página (como widget de la WIKI).

La Nación

• Filtros por año y mes (menú desplegable)

Presentan los archivos ordenados por día, con una imagen grande de la portada. Dividen los archivos en 4 columnas.

Publicaciones

(Es lo mismo que “Documentos”)

Podcast

• Presentan todos los podcasts de manera desordenada, no se pueden filtrar ni buscar.

(Se puede escuchar en el mismo sitio web)

Archivo General de la Nación (Memórica)

Página del Archivo Nacional Mexicano

Es una página muy interactiva, apenas se abre presenta un video simple y luego permite buscar información. Haciendo un poco de scroll aparecen las siguientes categorías;

Novedades

Es un carrusel con una gran imagen que resume el título.

• Exposiciones
• Micro sitios
• Colecciones
• Destacado
• Infografía
• Colaboradores
• Sección

Las secciones, al seleccionarlas, abren una página donde presentan más botones. Depende del tema si hay PDF, videos, imágenes, etcétera.

Imperdibles

También es un carrusel pero con botones (imágenes) que aumenta tamaño el del medio. (Se asemejan a las opciones “novedades” pero más específico. Incluye materialidad, para niños, audiovisuales.

Derecho a la memoria

Son tres botones con un fondo, cada imagen tiene su estilo de diseño.

• Memoria en lo femenino
• No olvidamos
• Infografía

Es un sitio web muy moderno que presenta todos los archivos de una manera comprensible y clara.

Antes y después

Se presenta una imagen con su respectivo contexto, y luego una barra vertical que da a conocer el mismo contexto pero en la antigüedad. Con el cursor se puede correr la barra y se ve cómo era el lugar antes y ahora.

Archivo Histórico UC

Es una plataforma que presenta todos los archivos administrativos, sociales, culturales, académicos y estudiantiles.

Presenta una barra superior con distintos botones básicos de un sitio web.

Archivo Histórico

Presenta una explicación y proceso del sitio web

Archivo Fílmico

Abre a un sitio web más moderno (Se nota la intención de ser un sitio práctico, no tan decorado)

Conclusiones

1. Preguntas anteriores a la planeación de la plataforma * ¿Cuál es la finalidad?

• ¿Para quién está hecho?
• ¿Será simple o interactiva?
• ¿La presentación es moderna?
• ¿Presentará archivos escritos solamente?
• ¿Tendrá archivos y enlaces externos?

2. Puntos/observaciones fundamentales

• Presentarse y presentar al proyecto (en el sitio). Resumir qué es, para quién es y dar a conocer a la comunidad.
• Si es posible, agregar la opción de leer texto (es importante para la accesibilidad).
• Los botones que presentan archivos es muy útil contextualizarlos con alguna imagen. Así al usuario le puede interesar más.
• Creo que es importante considerar que es una plataforma para la comunidad, pero también para personas externas.
• Comprender y tener clara la finalidad del sitio.

Código abierto y código cerrado

Abierto: Es un software donde su código es de uso público, todos pueden verlo y modificarlo. Generalmente es de uso gratuito, es colaborativo y puedes adaptarlo a tus necesidades. A veces sucede que programadores descargan el código, lo modifican y crean otra versión de la misma plataforma. (https://thecyberexpress.com/what-is-waterfox/#:~:text=%C2%BFWaterfox%20es%20propiedad%20de%20Mozilla,de%20cualquier%20asociaci%C3%B3n%20con%20Mozilla.)

La licencia de los softwares de código abierto es gratis, no es necesario pagar para utilizarlo (aunque sí dependen de donaciones), pero la plataforma no ofrecerá mejoras ni actualizaciones, eso es trabajo de la comunidad. La seguridad también dependerá de los usuarios, los cuales pueden agregar códigos extra para aportar a ésta.

Ejemplos:

• Blender
• Github
• Firefox

Cerrado: Para utilizar un software de código cerrado se debe pagar la licencia y te ofrecen soporte técnico y actualizaciones durante la vida útil del producto. El nivel de seguridad que el usuario tenga dependerá directamente del proveedor. Ejemplos:

• Microsoft Office (Word, Excel, PowerPoint)
• Adobe
• Autodesk

Categorización de plataformas de participación por parte de los usuarios

• Redes sociales: Tiktok, Instagram, Facebook, Twitter (X), Pinterest.

Los usuarios participan publicando imágenes, videos, comentarios, etcétera.

• Foros públicos: Reddit, Lemmy, Kbin, Hive.

Plataformas donde la gente cuenta historias, discute sobre temas, opina.

• Enciclopedias colaborativas: Wikipedia, Wikihow, Casiopea.

Son plataformas donde los usuarios contribuyen a la creación y edición de contenido.

• Plataformas de streaming y videos: Youtube, Twitch.

Sitios donde la gente publica videos (ya editados o en live).

• Colaboración de software: Github, Gitlab, Bitbucket.

Plataformas donde los usuarios publican códigos de programación para uso público.

• Reseñas y recomendaciones: Tripadvisor, Google maps.

Plataforma donde los usuarios aconsejan sobre destinos (hoteles, restaurantes, negocios).

Categorización de Objetos Semánticos

Utilizado en el contexto de las wikis y sistemas de organización de información es una manera de estructurar y categorizar entidades complejas y extensas. En las wikis, un “objeto semántico” se refiere a una entidad que tiene atributos y relaciones definidas, y que puede ser categorizada dentro de un sistema de taxonomía o de organización. Esto puede incluir desde artículos individuales hasta conceptos más abstractos o entidades que abarcan múltiples aspectos o categorías. Estos objetos semánticos permiten la estructuración y organización efectiva de la información dentro de plataformas colaborativas como Wikipedia, facilitando la navegación y la comprensión de conceptos complejos mediante categorías y relaciones definidas. Según Herbert Spencer (2019), los objetos semánticos dentro de Casiopea son expresados por medio de páginas, las cuales usan plantillas que permiten visualizar los datos. Esta plantilla se configura por medio de un formulario donde se ingresan los datos necesarios para dar “forma”. A su vez, esos datos constituyen propiedades, previamente definidas que determinan las cualidades de un objeto. Por ejemplo, el objeto Tarea y el objeto Travesía poseen ambos la propiedad |Alumno= pero el objeto Tarea no tiene la propiedad |Destino= que es propia de las Travesías. Entonces, las propiedades pueden ser compartidas por otros objetos, permitiendo que se cree una red de datos o “pertenencias” de un objeto dentro de otros. (Fauve Bellenger, 2024).

Definiciones

• Semántica: Disciplina que estudia el significado de las expresiones lingüísticas, sean palabras, sintagmas u oraciones. La semántica no constituye una parte de la gramática paralela a la morfología y a la sintaxis. Su naturaleza se considera, por tanto, transversal, en el sentido de que el estudio de los significados no afecta únicamente a cierto tipo de segmentos, sino a gran número de categorías y de relaciones a lo largo de toda la gramática. (RAE).
• Objeto semántico: Es aquel que modela el significado de los datos de los usuarios. Estos objetos modelan las percepciones de los usuarios con mayor precisión que E-R (El modelo entidad relación (ERD o modelos ER) es una herramienta que permite representar de manera simplificada cómo personas, objetos o conceptos se relacionan entre sí. Se utiliza para exponer cómo se organiza la información en una base de datos).

Tipos de objetos

Objeto simple

Es un objeto que tiene una identidad única y no depende de otros objetos para existir.

Un usuario registrado en una página web:

• Nombre de usuario
• Correo
• Contraseña

Objeto compuesto

Es formado por distintos objetos simples relacionados.

Un artículo de noticia:

• Título
• Cuerpo de texto
• Autor
• Fecha
• Comentarios

Objeto combinado

La unión de varios objetos que crea uno nuevo con un significado propio.

Comprar en un e-commerce:

• Usuario + Carrito de compra + Método de pago = Nuevo pedido

Objetos híbridos

Un objeto que puede funcionar de distintas maneras según el contexto.

Archivo de PDF en un sitio web:

• Puede ser un documento descargable
• Puede verse en el mismo sitio (vista previa)

Objeto de asociación

Un objeto que representa la relación entre dos o más.

Reseña de un producto en e-commerce:

• Relaciona Usuario + Producto

(No tiene sentido si los objetos no se asocian)

Objetos Padre-subtipo

Un objeto general que se especializa en tipos más concretos.

• Contenido (Padre) – Texto, imagen, video, audio (Subtipo)

(Es una forma específica general del contenido)

Objeto Arquetipo-versión

Un modelo base que da origen a distintas versiones.

• Modelo / Plantilla de una página web (Arquetipo) – Página de inicio, Página de contacto, Página de productos (Versión)

Archivos externos en HTML

Vincular archivos de distintas plataformas

Respetando licencias, derechos y atribuciones

API (Interfaz de Programación de Aplicaciones)

¿Qué es una API?

Son mecanismos que logran que dos componentes de software se complementen entre sí mediante protocolos y definiciones. “Por ejemplo, el sistema de software del instituto de meteorología contiene datos meteorológicos diarios. La aplicación meteorológica de su teléfono “habla” con este sistema a través de las API y le muestra las actualizaciones meteorológicas diarias en su teléfono”.

¿Qué significa API?

“Interfaz de programación de aplicaciones”. Separando las palabras, aplicación se refiere a distintos softwares con alguna función. La interfaz se podría considerar como el contrato de servicio de ambas aplicaciones. La documentación de su API declara cómo los desarrolladores deben estructurar las solicitudes y respuestas.

¿Cómo funcionan las API?

El funcionamiento y conversación entre distintos softwares suele explicarse con “cliente y servidor”. La aplicación que envía la solicitud es el cliente y la que responde, servidor. Las API pueden funcionar de cuatro maneras diferentes:

• API de SOAP (Protocolo Simple de Acceso a Objetos): El cliente y servidor se comunican mediante XML (Lenguaje de Marcado Extensible, es un tipo de lenguaje que permite definir y estructurar datos, logrando que tanto personas como máquinas pueden entenderlo).

• API de RPC (Llamadas a Procedimientos Remotos): El cliente realiza un procedimiento en el servidor, y él devuelve el resultado al cliente.

• API de WebSocket: Es un desarrollo moderno de la API que utiliza JSON (JavaScript Object Notation, formato de texto ligero) para transmitir datos.

• API de REST (Transferencia de Estado Representacional): Los clientes pueden acceder a los datos del servidor. Ambos softwares intercambian datos mediante HTTP. La principal característica de REST es que los servidores no guardan los datos del cliente entre solicitudes (hay ausencia de estado).

Beneficios

1. Integración
2. Innovación
3. Ampliación
4. Facilidad de mantenimiento

Diferentes tipos de API

• Privadas: Son internas de una empresa, solo se utilizan para conectar softwares dentro de ésta.

• Públicas: Cualquier persona puede utilizarlas, depende de la API si tiene sistema de autorización y coste asociado a su uso.

• De socios: Solo pueden acceder a éstas los desarrolladores externos autorizados para ayudar a distintas empresas.

• Compuestas: Combinan dos o más API distintas para abordar comportamientos complejos del sistema.

Wikimedia Commons

1. Se busca el archivo correspondiente en https://commons.wikimedia.org/wiki/Main_Page

2. En la página del archivo, se debe revisar la licencia (bajo el documento, imagen, video, audio). https://commons.wikimedia.org/wiki/File:ECH_1999_2_-_Caballer%C3%ADa_en_Chile,_Historia_de_la.djvu

Licencia del archivo

3. Se copia la URL del archivo, y luego insertarlo en el siguiente código:

<a href="URL_DEL_ARCHIVO">Ver documento original</a>

Si no, el código para incrustarlo con atribución (que el documento esté sin necesidad de redirigir a otro sitio).

<img src="URL_DE_LA_IMAGEN" alt="Descripción">
<>Imagen por [Autor] vía Wikimedia Commons (CC BY 4.0)</>

Europeana

https://www.europeana.eu/es

Interfaz Europeana

---

Zenodo

https://zenodo.org/

Interfaz Zenodo

---

Internet Archive

https://archive.org/

Interfaz Internet Archive

---

FigShare

https://info.figshare.com/researchers/

Interfaz FigShare

---

Sistema de Gestión de Contenidos (CMS)

Wordpress

Es una plataforma de gestión de contenidos que permite crear y administrar sitios web sin necesidad de tener conocimientos sobre la programación. Sirve para crear todo tipo de páginas web; blogs, tiendas online, foros. Funciona a través de temas (que definen el diseño) y plugins. Es un software de código abierto. Se puede utilizar su servicio en la nube, donde no necesitas servidor propio, tiene planes gratuitos y pagados. El único contra es que es más limitado para personalizar. La otra opción que entrega es descargar su software y se instala en el servidor propio. Permite un control total sobre diseño, plugins, base de datos y monetización.

Interfaz Wordpress

---

Existen otras plataformas similares;

• Drupal

Interfaz Drupal

---

• Joomla!

Interfaz Joomla!

---

• Ghost

Interfaz Ghost

---

Plataformas colaborativas

Tenemos que Hablar de Chile

“Somos una plataforma colaborativa de participación y diálogo ciudadano, que busca promover la cohesión y la construcción de una hoja de ruta país. Impulsada por la Pontificia Universidad Católica y la Universidad de Chile, y con el apoyo de muchas organizaciones de la sociedad civil, promovemos una forma de conversar que valore nuestras diferencias, y permita encontrarnos en torno a ellas. Queremos promover una cultura de diálogo masivo que valore nuestras diferencias, además de sistematizar, representar y responder rigurosamente la mirada de futuro de la sociedad chilena para enfrentar los desafíos de futuro.

Desde el 2020 hemos organizado distintos mecanismos y metodologías de participación en que han participado personas de todo el país. Cada uno de los espacios participativos que hemos implementado han sido creados y sistematizados por la UC y la Chile, buscando relevar lo que millones de personas han compartido en nuestros diálogos virtuales y presenciales.”

https://www.tenemosquehablardechile.cl/

Interfaz Tenemos que hablar de Chile

---

Decide Chile

“DecideChile, creado en 2013 por Unholster, es una plataforma de análisis de datos y visualizaciones enfocada en temas públicos.” Su misión es “Poner los datos y nuestra expertise en tecnología al servicio de la sociedad. En Unholster tenemos la convicción de que es importante guiarse por la información dura, que el populismo se combate con data y mientras más datos sean entendibles, se puede construir una mejor democracia.”

https://www.decidechile.cl/

Interfaz Decide Chile

---

Chile Convención

https://www.chileconvencion.cl/

Espacio online donde la ciudadanía podía enviar propuestas de norma constitucional.

Interfaz Chile Convención

---

Democracia en Red

"Somos Democracia en Red, una organización radicada en Argentina. Conformada por personas activistas, programadores y científicos sociales, que desde el hacer buscamos abrir las instituciones públicas y los procesos de toma de decisión."

https://www.democraciaos.org/

Interfaz DemocraciaOS

---

Civocracy

“Together you create a joint campaign for your target audience around a central quest. Raise awareness for your topic and reputation for yourself by teaming up and amplifying your reach.

Civocracy develops the engagement strategies to bring your target audience onboard.”

https://www.civocracy.org/

Interfaz Civocracy

---

Sistema Georreferencial (SIG)

Ejemplo interfaz Colombia Artesanal

https://colombiaartesanal.com.co/rutas/magdalena/

---

10 reglas heurísticas

• Visibilidad del estado del sistema

El usuario debe recibir un feedback al momento de realizar una acción (enviar un correo, hacer una transferencia, pagar algo), el tiempo no debe ser muy largo antes de recibir el estímulo. Esto sirve para que el usuario no sienta duda, pero sí seguridad al utilizar la plataforma. Mostrar el avance del sistema.

• Coincidencia entre el sistema y el mundo real

Nunca hay que asumir que el usuario ya sabe a lo que se está enfrentando en el sitio web. Hay que utilizar un lenguaje amigable para él.

• Dale al usuario el control y la libertad

Hay que entregarle al usuario la opción de decidir por su cuenta lo que quiera hacer, como volver atrás, eliminar o deshacer algo.

• Consistencia y estándares

“El usuario no debe estar preguntándose siempre si ese botón enviará el correo, o si es un botón o un enlace, o si ese elemento es clicable o no”. Hay que mantenerse en los estándares presentes, para así no confundir al usuario ni que el nuevo diseño juegue en contra.

• Prevención de errores

Google aplicó este pop-up en sus funciones. Por ejemplo, si enviamos un mail pensando que adjuntamos un archivo, Gmail te advertirá que no hay tal archivo, también con el asunto.

• Reconocer en lugar de recordar

“En el afán de diseñar pantallas “lo más limpias posibles” muchas veces caemos en ocultar opciones detrás de menús hamburguesa, hovers o ventanas modales”. Está bien mantener un cierto orden, pero hay que mostrarles a los usuarios las opciones que tienen, no asumir que recordarán la ubicación de cada botón y opciones.

• Flexibilidad y eficiencia de uso

Dar la opción de personalización del programa o sitio web. Es prudente dar indicaciones de uso, pero también es importante considerar a los usuarios que no son nuevos, y que no necesitan aprender a utlizarlo.

• Estética y diseño minimalista

“Para lograrlo, pregúntate si toda la información que muestras en la interfaz es necesaria y útil en ese momento exacto. Si no lo es, ocúltala o quítala”. Es fundamental no agregar más información de la necesaria. Hay que lograr disimular y ordenar todas las opciones que entrega el software de una manera clara y precisa.

• Ayuda al usuario a reconocer, diagnosticar y recuperarse de los errores

Hay que facilitar la experiencia cuando suceden problemas desde el usuario o desde la plataforma misma. Si el usuario se equivoca escribiendo su contraseña, hay que avisarle pero también darle la opción de cambiarla. O si los hay un problema con la programación de la página, se deja claro que el error no ha sido del usuario.

• Ayuda y documentación

Añadir una página dentro del sitio con FAQ (preguntas frecuentes), y también agregar contenido explicativo en campos complejos (un formulario, botones, contraseñas).

Presentar lo no digital en una plataforma digital

¿Qué cuentan los tejedores y tejedoras de Valle Hermoso?

Para tener información de primera fuente se visualizaron diversos videos de youtube donde hay entrevistas y documentales de la comunidad de Valle Hermoso.

• Video 1: La producción textil en Valle Hermoso, La Ligua ( Por CorProDeCo, SERPAT )
• Video 2: Tejer el Territorio: Saberes bioculturales en el Río La Ligua
• Video 3: Patrimonio Local: "Los Tradicionales Tejidos y Dulces de La Ligua"
• Video 4: Cuna del Tejido, Valle Hermoso

El tejido en Valle Hermoso constituye conocimientos heredados de generación en generación, aprendido desde la infancia. Para tejer, se utilizan distintos tipos de telares, como el telar a pala (el más antiguo), el telar de peine, el telar eléctrico y las máquinas de tejido de punto. Las materias primas provienen del pelaje de los animales, principalmente de llama, alpaca, vicuña y ovejas. Antiguamente las fibras eran 100% de origen natural, ahora solo un 5% es del animal, el otro porcentaje es fibra sintética, para así entregar más dureza.

Inicialmente, el oficio era solo de mujeres, hasta el 1950 que los hombres comenzaron a ser parte también. Es un saber y oficio ligado al territorio. A pesar de la crisis hídrica, la actividad textil no se ha visto interrumpida.

En 1940 se instaló la primera fábrica de tejidos, lo que provocó un fuerte impulso económico y tecnológico. Los tejidos se volvieron tendencia nacional, donde personas de todo Chile y también del exterior viajaban a La Ligua a comprar sus productos, entregando un gran reconocimiento artesanal. Gracias a este oficio muchas familias alcanzaron seguridad económica y bienestar, por lo que se generó un sentimiento de gratitud hacia el oficio. Los artesanos del sector cuentan que comienzan a tejer desde los seis años, muchos de ellos motivados a independizarse tempranamente (inculcado por la familia).

Con el avance económico nacional y sus tratados de libre comercio, los tejedores comenzaron a competir directamente con productos (externos) más baratos y de menor calidad, con lo que se vieron perjudicados directamente.

El oficio forma pequeños emprendedores, fabricantes medianos y grandes. El avance tecnológico ha permitido realizar en una hora lo que antes llevaba un medio día. Aunque la globalización ha generado dificultades, los artesanos valoran que la gente de fuera siga reconociendo la artesanía, lo que refuerza la importancia cultural y económica que los tejidos han tenido y siguen teniendo en la zona.

Acercamiento al oficio

Para un acercamiento al oficio, compré materiales y comencé a aprender a tejer, el punto más simple. Grabé este video de modo cercano y cálido, fijándome en el sonido y las texturas, para así comprender cómo es la sensación.

¿Cómo abstraer la lana?

Para comenzar a acercarme a la abstracción, visualicé cómo la lana caía y se posaba en una superficie, sin manipularla, solo dejándola caer desde arriba. También, comenzando a tejer, me di cuenta del detalle de las curvas de la lana alrededor de la aguja, siendo este el segundo paso del tejer.

Realicé dibujos de la lana, sin intención de detallarlo mucho, simplemente presenté el recorrido lineal de ésta.

La paleta de colores utilizada en las imágenes son de tierra, colores cálidos cafés (y sus derivados), y verdosos.

---

#280e04

#682a11

---

#7c3c18

#c28456

---

#3b352c

#aca69b

---

#51380e

#b49b77

---

¿Cómo cae la lana del ovillo?

Acto del punto

Acercamiento a la presentación de la abstracción

Lana interactiva

HTML

Visualiza el código HTML

<!DOCTYPE html> <html lang="es"> <head>

 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>Lana Interactiva</title>
 <link rel="stylesheet" href="prueba.css">

</head> <body>

 <audio id="sound" src="sonidolana.mp3" preload="auto"></audio>

 <svg id="canvas" viewBox="0 0 1600 800" preserveAspectRatio="none">
   <defs>
     <filter id="rugosa" x="0" y="0" width="100%" height="100%">
       <feTurbulence type="fractalNoise" baseFrequency="0.07" numOctaves="3" result="noise"/>
       <feDisplacementMap in="SourceGraphic" in2="noise" scale="2"/>
     </filter>
   </defs>

   <path id="lanaPath" d="" stroke="#6e452a" stroke-width="8"
         stroke-linecap="round" stroke-linejoin="round"
         fill="none"
         filter="url(#rugosa) drop-shadow(0 0 6px rgba(166,60,44,0.7))"/>

   <g id="ovillo" transform="translate(200,400) scale(1)" cursor="grab">
     <circle cx="0" cy="0" r="35" fill="#8b5e3c"/>
     <path d="M -20 -10 Q 0 -30, 20 -5" stroke="#a63c2c" stroke-width="3" fill="none"/>
     <path d="M -25 15 Q 0 30, 25 10" stroke="#d9c3a6" stroke-width="2" fill="none"/>
     <path d="M -30 0 Q 0 20, 30 0" stroke="#5c3a23" stroke-width="2" fill="none"/>
     <path d="M -15 -25 Q 5 0, 15 25" stroke="#a63c2c" stroke-width="2" fill="none"/>
   </g>
 </svg>

 <script>
   const svg = document.getElementById("canvas");
   const ovillo = document.getElementById("ovillo");
   const sound = document.getElementById("sound");
   const lanaPath = document.getElementById("lanaPath");

   let isDragging = false;
   let scale = 1;
   let pathData = "";

   ovillo.addEventListener("mousedown",(e)=>{
     isDragging = true;
     ovillo.setAttribute("cursor","grabbing");
     const x = e.clientX;
     const y = e.clientY;
     pathData = `M ${x} ${y}`; 
     lanaPath.setAttribute("d", pathData);
     sound.currentTime = 0;
     sound.play();
   });

   window.addEventListener("mousemove",(e)=>{
     if(!isDragging) return;
     const x = e.clientX;
     const y = e.clientY;

     ovillo.setAttribute("transform",`translate(${x},${y}) scale(${scale})`);

     pathData += ` L ${x} ${y}`;
     lanaPath.setAttribute("d", pathData);

     scale = Math.max(0.7, scale - 0.0003);
   });

   window.addEventListener("mouseup",()=>{
     isDragging = false;
     ovillo.setAttribute("cursor","grab");
     sound.pause();
   });
 </script>

</body> </html>

---

CSS

Visualiza el código CSS

body {
 margin: 0;
 background-color: #f5f0e6; 
 overflow: hidden;
}

svg {
 width: 100%;
 height: 100vh;
}

.lana {
 fill: none;
 stroke: #8b5e3c; 
 stroke-width: 8;
 stroke-linecap: round;
 stroke-linejoin: round;
 filter: url(#rugosa);
 transition: stroke 0.3s ease;
}

.lana:hover {

 stroke: #a63c2c; 

}

---

Cambio de imágenes lana

HTML

Visualiza el código HTML

<!DOCTYPE html>
<html>
<head>
<title>Cambio de imágenes lana</title>
<link rel="stylesheet" href="imágenes.css">
<script>
 
 document.addEventListener("DOMContentLoaded", () => {
   document.body.addEventListener("click", () => {
     
     window.location.href = "imagenes2.html";
   });
 });
</script>
</head>
<body>

<img src="IMG_2548.PNG" alt="Imagen 1">

<img src="IMG_2549.PNG" alt="Imagen 2">

<img src="IMG_2548.PNG" alt="Imagen 3">

<img src="IMG_2549.PNG" alt="Imagen 4">

<img src="IMG_2548.PNG" alt="Imagen 1">

<img src="IMG_2549.PNG" alt="Imagen 2">

<img src="IMG_2548.PNG" alt="Imagen 3">

<img src="IMG_2549.PNG" alt="Imagen 4">

<img src="IMG_2548.PNG" alt="Imagen 1">

<img src="IMG_2549.PNG" alt="Imagen 2">

<img src="IMG_2548.PNG" alt="Imagen 3">

<img src="IMG_2549.PNG" alt="Imagen 4">

<img src="IMG_2548.PNG" alt="Imagen 1">

<img src="IMG_2549.PNG" alt="Imagen 2">

<img src="IMG_2548.PNG" alt="Imagen 3">

<img src="IMG_2549.PNG" alt="Imagen 4">

<img src="IMG_2548.PNG" alt="Imagen 1">

<img src="IMG_2549.PNG" alt="Imagen 2">

<img src="IMG_2548.PNG" alt="Imagen 3">

<img src="IMG_2549.PNG" alt="Imagen 4">

<img src="IMG_2548.PNG" alt="Imagen 1">

<img src="IMG_2549.PNG" alt="Imagen 2">

<img src="IMG_2548.PNG" alt="Imagen 3">

<img src="IMG_2549.PNG" alt="Imagen 4">

<img src="IMG_2548.PNG" alt="Imagen 1">

<img src="IMG_2549.PNG" alt="Imagen 2">

<img src="IMG_2548.PNG" alt="Imagen 3">

<img src="IMG_2549.PNG" alt="Imagen 4">

<img src="IMG_2548.PNG" alt="Imagen 1">

<img src="IMG_2549.PNG" alt="Imagen 2">

<img src="IMG_2548.PNG" alt="Imagen 3">

<img src="IMG_2549.PNG" alt="Imagen 4">

<img src="IMG_2548.PNG" alt="Imagen 1">

<img src="IMG_2549.PNG" alt="Imagen 2">

<img src="IMG_2548.PNG" alt="Imagen 3">

</body>
</html>

---

CSS

Visualiza el código CSS

.grid-container {
 display: grid; 
 grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr ; 
 grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr; 
 gap: 0px; 
 width: 100%; 
 margin: 0px ; 
background-color: #280e04;
}

.grid-item img {
 max-width: 100%; 
 height: auto; 
 margin-left: 0px;
}

---

Museo de La Ligua

Avance 9 octubre

¿Qué hace el museo de La Ligua?

• Rescata
• Estudia
• Preserva
• Difunde

El Patrimonio Cultural y Natural de Petorca

¿Qué busca?

Transformarse en un lugar de encuentro y convivencia compartido por la comunidad, que sea un espacio inclusivo, emotivo, didáctico, democrático, reflexivo y educativo. Buscan “celebrar la vida”.

Sitio web museo

Actualmente existe una página del Museo de La Ligua (https://museolaligua.cl/), pero se nota que está en desuso y no actualizado.

Calendario de eventos Museo de La Ligua

Páginas dentro del sitio que están vacías

Botones de contenido audiovisual que no llevan a nada

Arquitectura de información

Se categorizaron los archivos en 2: Archivos Históricos (con periódicos de la zona y mapotecas) y Archivos Audiovisuales (con videos etnográficos, documentales, audios y fotografías patrimoniales). A pesar de que estén las dos categorías explicadas en la página, al momento de seleccionar el botón para consumir el contenido, los botones no redirigen ni abren nada, simplemente se expanden (un poco, para dar feedback de ubicación del cursor al usuario), pero no son clickeables.

También tiene un calendario de eventos, el cual se puede organizar por días, meses y listas, lamentablemente no aparece ningún evento, aunque seguramente hayan, lo que me confirma que no existe actividad online.

La información general está presente, como horarios, tarifas y reservas, aunque esta última solo muestra un mail y un número para inscribirse, podría ser interesante agregar un formulario en el mismo sitio web, para así facilitar y promover las reservas.

Acercamiento propuesta nuevo sitio web

Hay categorías del sitio actual que sí aportarían positivamente, pero ¿qué pasaría si dividimos el sitio en "Museo Presencial" y "Museo Online"? Así también se categorizaría el contenido interno y externo.

"Museo Presencial"

• Reservas
• Tarifas
• Accesibilidad
• Estacionamientos
• Actividades
• ¿Cómo llegar?
• Normas del museo
• Salas fijas de exposición
• ¿Qué hay de nuevo?

"Museo Online"

• Calendario de eventos
• Documentos (archivos)
• Contenido audiovisual
• Inmersión sensorial artesanías
• Publicaciones (se podría linkear con la plataforma que más usen, como instagram)
• Noticias

Visita a La Ligua

14 de octubre 2025

Museo

Jornada con las tejedoras

Abstracción de la lana

Telar 1

Telar 2

Telar 3

Telar 4

Inicio maqueta Figma

Wireframes

Para la siguiente propuesta, se dibujan wireframes para llevar el posible diseño a FIGMA. La propuesta comienza con un zoom del globo terráqueo, el cual se aproxima hacia Chile, más específicamente La Ligua.

Luego, se idean distintos botones con la finalidad de entregar información sobre las tejedoras de La Ligua, dónde encontrarlas y qué ver en el Museo.

Avance FIGMA

Considerando que una de las características de este sitio es que sea interactivo, se buscan distintas acciones que aporten positivamente a esta idea.

LINK FIGMA

Avance proyecto 06.11

Para este diseño se propone adentrarnos a un arpillera, donde luego de una breve presentación del sitio se muestra la totalidad de la pantalla como una obra, con la idea de sentirnos dentro de ésta.

Figma 2

LINK FIGMA

Entrevista arpilleras

Esta conversación / entrevista se realiza con la intención de comprender el trabajo de las arpilleras de La Ligua, su modo de empleo, la cercanía a éste, qué buscan mostrar con sus obras y qué les gustaría mostrar y ver en este posible sitio web.

Avance proyecto 13.11

Luego de la revisión de la maqueta anterior, se discute sobre cómo presentar la obra de la arpillera sin que sea literal. Cómo se puede abstraer esta obra? Se considera también que el sitio no sea una obra, si no que ésta esté presente de una manera no literal.

Se jugó más con los botones y cambios de colores, para lograr una idea más interactiva.

Wireframes

Figma

En esta maqueta de FIGMA, se buscó integrar interacciones con distintos objetos, para lograr una mayor dinámica en el sitio. Al ingresar a este sitio, se muestra una breve animación para comenzar el recorrido. Luego, la pantalla se divide en dos botones, con la finalidad de proponer otro tipo de experiencia. El botón que se desarrolló fue el de "galería virtual".

Link

LINK FIGMA

Avance proyecto 20.11

Búsqueda y recopilación de datos

Archivo de Fondos y Colecciones - Museo de la Memoria y los Derechos Humanos

Para avanzar con la parte del sitio que abarca el archivo histórico, se comenzó con la recopilación de datos de distintas arpilleras (1973 - 2015) utilizando el Archivo de Colecciones del Museo de la Memoria y los Derechos Humanos (LINK). A pesar de que la cantidad de colecciones eran muchas, no todas contaban con la información necesaria para poder categorizarlas, siendo esto un punto fundamental.

La recopilación de información abarcó los siguientes datos:

• Nombre
• Fecha
• Institución Archivística
• Origen del ingreso
• Lugar Cantidad
• Algunas Arpilleras
• Fecha específica

Hipervínculos FIGMA

Ya con la información ordenada, se decide considerar algunas categorías para la tabla de arpilleras. Lo interesante de esta tabla es la manera en que cada elemento se relaciona de alguna u otra manera con otro, a pesar de ser de distintas autoras.

Hipervínculos imágenes

Por otra parte, y en paralelo a la tabla, se realiza el mismo hipervínculo pero con las obras en imágenes. Este prototipo no busca ser el final, fue solo una entrada al diseño y orden.

Avance proyecto 28.11

Elementos gráficos

Entrega Final Título 1

Link Figma

Prototipo Figma

Título 2

Categorías y subcategorías información

La Raíz

Entes organizacionales

Museo

El museo es parte fundamental del oficio de arpilleras, ya que promueve su historia y proyectos dándole un espacio en su edificación y entregando herramientas y materiales para su desarrollo. El museo no es simplemente un espacio de exposiciones, para la comunidad de La Ligua, este lugar es una zona de desarrollo de diversas actividades culturales, tanto para adultos como niños. De hecho, en el Plan Municipal de Cultura, La Ligua 2022-2025, destacan la participación en el museo para actividades artísticas, culturales y/o patrimoniales, donde el 28,2% de los usuarios estudiados han sido parte. Y, dentro del mismo documento hay puntos donde el museo es fundamental;

• “Espacios como el museo o el conservatorio pueden becar a una persona y hacer un trabajo colaborativo y comunitario con esta persona.”

• “La Ligua es privilegiada por la capacidad de espacios para las artes y educación. Tiene espacios como el Cecrea, Museo, Biblioteca, Conservatorio. Centros culturales la Casa, La Patagua.”

• “Hay un fuerte resguardo de patrimonio, con instituciones importantes como el Museo, La biblioteca. Además de personas particulares que tienen preocupación por el patrimonio.”

• “El museo cuenta con un plan museológico a largo plazo, cuenta con espacio para acceso universal, cuenta con 3600 metros cuadrados y con programación para música, teatro. Realizan talleres dentro del Museo y se promueve el uso de áreas verdes y la asociación con organizaciones comunitarias. Tiene una exposición permanente museológica renovada en un amplio registro: Patrimonial, pueblos originarios. Museo es referente a nivel nacional e internacional por su gestión.”

• “Museo realiza programa educativo a nivel provincial, cultura, arte y patrimonio de base. Y han desarrollado alianza con astronomía, pueblos originarios y universidades de la región.”

• “No se ve una gestión cultural por parte del municipio, tampoco en las anteriores administraciones, a pesar de que se han hecho muchos diagnósticos, no se han visto resultados. El Museo ha cumplido la función de gestión cultural comunal.”

Cesfam

El rol del CESFAM no es gubernamental, pero tiene un espacio importante ya que ha derivado algunos casos de pacientes con diversas situaciones psicológicas a participar en el taller, por lo que le da la importancia al grupo de arpilleras como espacio de terapia.

Municipalidad/Gobierno Regional

La municipalidad entrega los recursos necesarios para el desarrollo de este oficio, a mano con el museo se organizan para poder permitir que este espacio funcione correctamente. Existen diversos ingresos municipales para el funcionamiento de las actividades patrimoniales, tales como las que ocurrieron en el 2025, donde la comunidad de Petorca recibió un financiamiento de $40.000.000 del FNDR (Fondo Nacional de Desarrollo Regional) , proyecto que busca promover la cohesión social y el bienestar comunitario mediante una fiesta navideña (con fiesta previa). Durante diversas sesiones, los concejales destacan la “importancia de acceder a recursos externos para el desarrollo de estas actividades”. Luego, con una mirada más cercana a La Ligua, leemos el siguiente titular “Municipio de La Ligua entregó subvenciones a organizaciones locales para mejorar infraestructuras y fomentar el desarrollo”, donde el administrador municipal de la ciudad señaló “Para nosotros como municipalidad es muy importante seguir potenciando un polo de desarrollo económico, local y regional”, haciendo notar la importancia de la ayuda del gobierno para desarrollar culturalmente la región.

Materiales

Ropa donada

Para realizar el oficio, un material fundamental es la tela, la cual proviene principalmente de prendas donadas. Cuando hablamos de donación de ropa se pueden presentar diversos problemas, y uno de ellos es la mala condición en las que a veces es entregada, y, por otro lado, es la cantidad de texturas y diseño que la tela presenta, ya que al momento de la elección de colores (luego de definir el proyecto), mientras más básica sea, mejor, ya que telas con estampados puede ser difícil encontrarle una forma que se adecúe.

Utensilios entregados

Los materiales y herramientas como tijeras, hilos, agujas, lanas, etcétera, son entregados por el museo (a mano de la municipalidad), el cual entrega estos materiales y el espacio de trabajo a cambio de dos proyectos anuales para exponer en el lugar.

El hacer

Estructura temporal organizacional

Proyectos por año

Como se comentó anteriormente, el museo solicita dos proyectos anuales (uno por semestre), donde se les entrega un tema y las arpilleras deben presentarlo.

Reuniones semanales

Las reuniones son semanales, por lo que en cuatro meses tienen 16 sesiones, donde en las primeras dos deben tener el tema, investigarlo y estudiar sobre él. Luego, se realizan bosquejos, se toman decisiones, e inician el trabajo, el cual está siempre sujeto a cambios.

Proceso creativo

Tema solicitado

El museo presenta un tema para el proyecto.

Investigación

El grupo busca información e investiga para lograr desarrollar correctamente la idea.

Bosquejos

Los bosquejos los realizan entre todas, donde cada una opina y proporciona ayuda.

Toma de decisiones

La toma de decisiones no es un proceso menor, el tiempo dedicado a esto no es una jornada entera, pero sí le dedican lo necesario para que todo haga sentido. Iniciando por la elección del color del borde de la obra, el cual debe tener sentido con los elementos que estén dentro de ella. También, se estudian los colores del interior, y la elección de telas es minuciosa, dedicando tiempo a su correcta elección.

Cambios y ajustes

El desarrollo del proyecto está siempre con posibles cambios, los cuales son conversados y llegados a consenso para realizarlos.

El cierre

Trabajo terminado

Ferias

La feria más grande en la que las arpilleras están presentes es “Expo La Ligua”, donde cada arpillera lleva su stock de productos (por ejemplo, marcadores de libros) con su sello personal, los cuales se venden en conjunto (¿las ganancias son personales?). Esta feria es un evento anual importante de la región, dura poco más de un mes y tiene más de 120 expositores, nacionales como internacionales, incluyendo también conciertos.

Archivo museo

Los proyectos que fueron expuestos en el museo van siendo reemplazados, y los que retiran los guardan en el archivo del museo.

Exposiciones museo

Los proyectos de las arpilleras son presentados y expuestos en el museo. Existe un gran proyecto sobre la crisis hídrica de la región, que ocupa casi un muro de espacio, y también hay un libro tejido.

Piezas guardadas

¿Cuáles son las piezas guardadas en las casas?

Visita La Ligua 10/04

Trabajo previo

Herramientas de registro de información

Para esta actividad, se eligieron seis trabajos en arpillera registrados en el archivo de exposiciones del museo. La herramienta era un libro cosido con la arpillera expuesta en la portada, y en su interior habían dos preguntas; ¿Qué representa para usted este trabajo en arpillera? y ¿Qué le llama la atención de este trabajo?. Esta actividad de realizó con la finalidad de registrar información en paralelo a las entrevistas y taller.

Documentos registros arpilleras

Elementos en trabajos

Luego de visualizar el conjunto de arpilleras, se eligieron diversos elementos que se repiten en las obras, agrupándolos en grupo. Esto con la finalidad de registrar elementos gráficos posiblemente útiles en un futuro.

Arpillera y ubicación (mapa)

Se eligieron los trabajos en arpillera que tuvieran información de una ubicación en el sector, con la finalidad de pensar en una cartografía interactiva donde se pueda elegir un sector y visualizar a modo de galería los trabajos relacionados al territorio.

Jornada de participación

Apuntes

El grupo que se reúne los viernes a las 15:00 es uno de los distintos colectivos de arpilleristas que existen dentro del museo, cada uno con sus propios horarios y días. Este grupo en particular lleva aproximadamente seis años funcionando, y su monitora es Viviana Zamora, quien fue la encargada de formarlo.

La organización interna no responde a una planificación estricta. Viviana, como monitora, está a cargo y apoya en distintas tareas. El resto de las participantes se divide entre mujeres con años de experiencia en el oficio y otras que comenzaron hace poco tiempo. Las más experimentadas acompañan de manera constante a las más nuevas. Cuando se integra una nueva mujer al grupo, por cupo disponible, su nivel de participación es más bajo que el del resto, y va aumentando a medida que aprende. Al finalizar el taller, se les entrega un diploma, y cada una decide si desea continuar participando o no.

El espacio también da lugar a vínculos y amistades que van más allá del taller, llegando a reunirse en sus casas para compartir.

En cuanto a las obras, no todas se destinan a exposiciones del museo. En ciertos periodos se les entregan materiales para que cada arpillerista realice las piezas que desee, con el fin que ella determine. Es habitual que las guarden en sus casas como recuerdo, aunque también hay quienes prefieren regalarlas como una forma de traspasar el oficio. Asimismo, se venden en exposiciones, ferias y de manera personal. Una de las integrantes comentaba, por ejemplo, que en cada viaje al extranjero llevaba algunas piezas para venderlas allá, donde son solicitadas.

Decisiones sitio web

Siguiendo la línea del proceso de Título 1, se define que la manera de presentar el contenido, estudio e investigación será mediante un sitio web, realizada en Figma (programa para maquetas de aplicaciones y sitios web). Los elementos gráficos y el contenido se han desarrollado durante el semestre, por lo que en este momento se deben tomar las decisiones de la manera en que se presentará lo registrado.

Primeros prototipos

Primera maqueta

Esta primera maqueta buscaba crear un vínculo gráfico entre los tres momentos estudiados (el origen, el hacer y el cierre), donde se consideró mostrarlo mediante un diagrama de Venn. Esta propuesta tuvo varias modificaciones, pero se decidió dejar el mapa, pero presentado de una manera distinta, por lo mismo se creó una cartografía digital a base de elementos arpilleros, tanto recuperados de las obras, como creados digitalmente.

Primera cartografía

Para esta cartografía, se eligió un territorio de la Quinta Región, el cual abarca desde Papudo hasta Putaendo, donde su centro es La Ligua. Los elementos fueron obtenidos de trabajos de arpilleras, y otros (como los cerros) fueron creados digitalmente, a base de fotos de telas.

La separación del territorio fue realizada a partir de la carretera.

Elementos gráficos

Cartografía

Siguiendo el mismo estilo de la primera cartografía presentada, esta tuvo un cambio pequeño pero significativo. La separación del territorio ya no era considerado por carretera, si no que por cuencas de la región.

Historias por contar

Luego de registrar diversos trabajos en arpillera del Museo de La Ligua, se consideró presentar las historias (ya existentes en libros arpilleros) de una manera digital distinta, siguiendo la línea de diseño existente en la artesanía. Había dos libros expuestos en el museo, uno de ellos era de la historia de los dulces de La Ligua, y el segundo sobre los Bailes Religiosos de la Quinta Región, habiendo también libros en el Archivo que contaban las mismas historias.

Para esta invención, se definió cuáles serían las historias presentadas, y luego se diseñó en photoshop la historia horizontalmente, creando primero el fondo, y luego posicionando los distintos elementos (personas, casas, iglesias, montañas, animales, etcétera) se comenzó a explicar la historia con palabras (extraído de los libros).

Dulces de La Ligua

Bailes religiosos de nuestro valle