diff --git a/README.md b/README.md
index c717e841..2740da7c 100644
--- a/README.md
+++ b/README.md
@@ -2,971 +2,77 @@
 
 ## Índice
 
-* [1. Preámbulo](#1-preámbulo)
-* [2. Resumen del proyecto](#2-resumen-del-proyecto)
-* [3. Consideraciones generales](#3-consideraciones-generales)
-* [4. Funcionalidades](#4-funcionalidades)
-* [5. Consideraciones técnicas](#5-consideraciones-técnicas)
-* [6. Criterios de aceptación mínimos del proyecto](#6-criterios-de-aceptación-mínimos-del-proyecto)
-* [7. Hacker edition](#7-hacker-edition)
-* [8. Objetivos de aprendizaje](#8-objetivos-de-aprendizaje)
-* [9. Pistas, tips y lecturas complementarias](#9-pistas-tips-y-lecturas-complementarias)
-* [10. Consideraciones para pedir tu Project Feedback](#10-consideraciones-para-pedir-tu-project-feedback)
+* [1. Introducción](#1-introducción)
+* [2. Descripción del proyecto](#2-Descripción-del-proyecto)
+* [3. Funcionalidades](#3-funcionalidades)
+* [4. Historia de usuario](#4-Historia-de-usuario)
+* [5.Tecnologías utilizadas](#5-Tecnologías-utilizadas)
+* [6. Diseño y Desarrollo del Prototipo](#6-Diseño-y-Desarrollo-del-Prototipo)
 
-***
+## 1. Introducción
+¡Bienvenido a WikiNook 🏡!
+Este proyecto es una aplicación web dedicada a los amantes del videojuego Animal Crossing, específicamente diseñada para explorar y conocer más sobre los adorables vecinos del juego. Con un diseño inspirado en la estética de Animal Crossing, WikiNook ofrece una experiencia interactiva para descubrir información detallada sobre cada vecino, clasificándolos según su especie, personalidad y género.
 
-## 1. Preámbulo
+## 2. Descripción del proyecto
+WikiNook tiene como objetivo proporcionar a los jugadores de Animal Crossing una plataforma intuitiva y atractiva para explorar información detallada sobre sus vecinos favoritos. Desde clasificar a los vecinos por personalidad y especie hasta la posibilidad de buscarlos por nombre, WikiNook es la guía perfecta para conocer a fondo la comunidad animal de tu isla.
 
-Según [Forbes](https://www.forbes.com/sites/bernardmarr/2018/05/21/how-much-data-do-we-create-every-day-the-mind-blowing-stats-everyone-should-read),
-el 90% de la data que existe hoy ha sido creada durante los últimos dos años.
-Cada día generamos 2.5 millones de terabytes de datos, una cifra sin
-precedentes.
+![Imagen página completa gif](WikiNook.gif)
 
-No obstante, los datos por sí mismos son de poca utilidad. Para que esas
-grandes cantidades de datos se conviertan en **información** fácil de leer para
-las usuarias, necesitamos entender y procesar estos datos. Una manera simple de
-hacerlo es creando _interfaces_ y _visualizaciones_.
+## 3. Funcionalidades
 
-En la siguiente imagen, podrás ver cómo con la data que que se ve en la parte
-izquierda se puede construir una interfaz amigable y entendible por las
-usuarias, al lado derecho.
+* Exploración por Filtros: Filtra a los vecinos por personalidad, especie y género, esta sección cuenta con un botón de limpiado de dichos filtros y devuelve los datos a su estado inicial.
+* Orden Alfabético: Explora la lista de vecinos de manera ascendente o descendente por orden alfabético a través de un selector.
+* Barra de Búsqueda: Encuentra rápidamente a tu vecino favorito por su nombre, cuenta con un botón que limpia la búsqueda realizada.
+* Estadísticas: Muestra porcentualmente en un modal la cantidad de vecinos del género femenino y del género masculino existentes en la plataforma. 
 
-![pokemon-data-to-ui](https://user-images.githubusercontent.com/12631491/218505816-c6d11758-9de4-428f-affb-2a56ea4d68c4.png)
+## 4. Historia de usuario
 
-## 2. Resumen del proyecto
+Se realizo un documento con las funcionalidades del proyecto, pedidas desde el punto de vista de un usuario, simulando una situación en la que podría ser usada. Aquí mostramos el enlace del documento realizada para el usuario que nos permite conocer los pasos en los que se desarrollo el proyecto.
+[Enlace del documento](https://docs.google.com/document/d/1K8NoQyA83kZ_FGCIBDcJ6XyT0XXSpx40iVrrJk-1XwY/edit)
 
-En este proyecto **construirás una _página web_ para visualizar un
-_conjunto (set) de datos_** que vas a generar con [prompting](https://www.itmadrid.com/que-es-un-prompt-en-inteligencia-artificial-ia/).
-Esta página web se adecuará a lo que descubras que tu usuaria
-necesita.
+## 5. Tecnologías utilizadas
+El desarrollo de WikiNook se benefició de un conjunto diverso de tecnologías y herramientas que permitieron una implementación robusta y una experiencia de usuario enriquecedora.
 
-Además, en este proyecto utilizarás herramientas de
-[inteligencia artificial](https://es.wikipedia.org/wiki/Inteligencia_artificial)
-como [ChatGPT](https://openai.com/chatgpt), [ExplainDev](https://explain.dev/),
-entre otras para generar un set de datos en un archivo javascript.
+### Prompt utilizado
+Se utiliza chatGPT como IA requerida, este nos facilito la extración de información que requeriamos para mostrar la data de las tarjetas.
 
-El propósito de generar los datos en esta manera es brindarte la oportunidad de
-adentrarte en el empleo de herramientas impulsadas por la inteligencia
-artificial, así como en [técnicas de
-prompting](https://learnprompting.org/es/docs/intro).
-
-Como entregable final tendrás una página web que permita **visualizar la data,
-filtrarla, ordenarla y calcular alguna estadística**. Con estadística
-nos referimos a distintos cálculos que puedes hacer con los datos para mostrar
-información aún más relevante a las usuarias (promedio, el valor máximo
-o mínimo, etc).
-
-## 3. Consideraciones generales
-
-* Este proyecto se debe resolver en duplas.
-* El rango de tiempo estimado para completar el proyecto es de 4 a 5 Sprints.
-* El tiempo estimado que deberías dedicar a la [generación de los datos](#generar-los-datos)
-  es de máximo un sprint. Además, al final del proyecto deberás presentar
-  un [screenshot del prompt utilizado](#prompt-utilizado).
-* Si ves que te va a tomar más tiempo,
-  deberás utilizar los datos de ejemplo que los vas a encontrar en
-  esta ruta: `./src/data/dataset.js`.
-* El proyecto será entregado subiendo tu código a GitHub (commit/push) y la
-  interfaz será desplegada usando [GitHub Pages](https://pages.github.com/).
-
-## 4. Funcionalidades
-
-Como entregable final tendrás una página web que permita **visualizar la data,
-filtrarla, ordenarla y calcular alguna estadística**.
-
-Aquí definimos en más detalle las funcionalidades mínimas que debe tener:
-
-* La aplicación debe permitir a la usuaria ver los items de la data en una visualización,
-  que puede ser [tipo tarjetas](http://www.uxables.com/diseno-ux-ui/que-es-y-como-disenar-una-card/)
-  o cualquier otra forma que tú decidas como la adecuada (pero desde aquí
-  referimos a los items como "tarjetas"). **Cada una de las tarjetas debe estar
-  contenida en un elemento `<li>` y estos a su vez contenido en
-  un elemento `<ul>`.**
-
-* El elemento `<ul>` deberá ser hijo de un elemento con atributo _id_
-  de valor "root". **Este es un paso importante para que tu**
-  **aplicación tenga la estructura requerida**
-
-* Las tarjetas deben resaltar los valores de las propiedades de la data que
-  le interesaría a la usuaria ver. Por ejemplo: nombre, fecha, imagen, etc.
-  **Si vas a filtrar u ordenar por una propiedad, la tarjeta tiene que mostrar
-  el valor de esta propiedad a la usuaria.**
-
-* La interfaz debe estructurar semánticamente la data usando el estándar [microdatos](https://developer.mozilla.org/en-US/docs/Web/HTML/Microdata).
-  Es obligatorio usar al menos los atributos [`itemscope`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemscope),
-  [`itemtype`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemtype)
-  y el atributo [`itemprop`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/itemprop).
-
-  Por ejemplo, la siguiente data correspondiente a Ada Lovelace:
-
-  ```json
-    {
-      "id": "ada-lovelace",
-      "name": "Ada Lovelace",
-      "shortDescription": "Pionera de la informática, fue la primera programadora.",
-      "description": "Una visionaria del siglo XIX ...",
-      "imageUrl": "URL_DE_LA_IMAGEN_GENERADA",
-      "facts": {
-        "yearOfBirth": 1843,
-        "placeOfBirth": "London, England",
-        "mainField": "Computer Science",
-      }
-    }
-  ```
-
-  puede ser estructurada semánticamente en HTML como:
-
-  ```html
-  <dl itemscope itemtype="WomenInTech">
-    <img src="URL_DE_LA_IMAGEN_GENERADA" alt="Ada Lovelace" />
-    <dt>Nombre:</dt><dd itemprop="name">Ada Lovelace</dd>
-    <dt>Descripción:</dt><dd itemprop="description">Pionera de la informática, fue la primera programadora.</dd>
-    <dt>Año de nacimiento:</dt><dd itemprop="yearOfBirth">1843</dd>
-    <dt>Lugar de nacimiento:</dt><dd itemprop="placeOfBirth">London, England</dd>
-    <dt>Campo de desempeño:</dt><dd itemprop="mainField">Computer Science</dd>
-  </dl>
-  ```
-
-* La aplicación debe calcular y visualizar una estadística de la data. Puede
-  ser una propiedad computada de cada item, como una propiedad adicional
-  (por ejemplo, el índice de masa corporal de cada pokemon) o unas estadísticas
-  de la data completa (por ejemplo, total de personas nacidas en los años 80s).
-
-* La aplicación debe permitir a la usuaria filtrar la data. Deberás usar
-  un elemento [`<select>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select)
-  con [un atributo de datos](https://developer.mozilla.org/es/docs/Learn/HTML/Howto/Use_data_attributes)
-  `data-testid="select-filter"`, y un atributo `name` con el nombre
-  de la propiedad por la que filtrará (por ejemplo, si vas a filtrar por "type",
-  el `<select>` tendrá  `name="type"`). Los `<option>` de este `<select>` deberán
-  tener en el atributo `value` el valor del filtro (por ejemplo, si vas a filtrar
-  por type "fire" sería `<option value="fire">Fire</option>`).
-
-* La aplicación debe permitir a la usuaria ordenar la data.
-  - Tendrá al menos un control `<select>` para ordenar.
-  - Si usas solo un control `<select>`, debe tener
-    [un atributo de datos](https://developer.mozilla.org/es/docs/Learn/HTML/Howto/Use_data_attributes)
-    `data-testid="select-sort"` y un atributo `name` con el nombre de la
-    propiedad por la que ordenará. (por ejemplo, si vas a ordenar por
-    "num" seria `name="num"`). Este `<select>` tendrá dos [`<option>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/option)
-    con `value` `asc` y `desc`, para ordenar ascendente y descendente la data
-    respectivamente (por ejemplo, `<option value="asc">A - Z</option>`).
-  - Una alternativa es ofrecer la usuaria un ordenamiento mas complejo.
-    Podrías implementar ordenar por varios propiedades. En este caso sería con
-    un `<select>` con un atributo de datos `data-testid="select-sort"`, y que
-    contiene hijos `<option>` con un `value` del nombre de la propiedad con
-    cual vas a ordenar. (Por ejemplo, `<option value="name">Nombre</option>`).
-    También, necesitarás otro control (`<radio>`,`<select>`, etc.) para decir
-    que el ordenamiento es ascendente o descendente. Este control secundaria
-    tendrá un atributo `name="sort-order"`, y tiene values `asc` y `desc`.
-
-* Las funcionalidades de ordenar deben operar sobre la data filtrada.
-  Por ejemplo, si filtro los pokemones de tipo fuego y luego los ordeno por
-  nombre ascendentemente, la aplicación deberá mantener el filtro aplicado y
-  ordenar los pokemones de tipo fuego.
-
-* La aplicación debe permitir a la usuaria reiniciar la aplicación, limpiando
-  filtros y ordenamiento, con un `<button>` con un atributo de datos
-  `data-testid="button-clear"`.
-
-* Las operaciones de filtrar, ordenar, limpiar, etc. no deben recargar
-  la página, si no que deben agregar el contenido en una manera
-  dinámica via javascript.
-
-* La aplicación será _responsive_, es decir, debe visualizarse sin problemas
-  desde distintos tamaños de pantallas: móviles, tablets y desktops.
-
-Los siguientes wireframes, son ejemplos de una interfaz que puede cumplir con esta
-funcionalidad. Como podrás ver, estos diseños cumplen con la metodología
-[Mobile First](https://developer.mozilla.org/es/docs/Glossary/Mobile_First), la misma
-que te recomendamos utilizar en todos tus proyectos:
-
-Diseño Mobile:
-
-* [Wireframe mobile 1](https://github.com/Laboratoria/curriculum/assets/123121338/54711bb7-cb05-448e-b677-3cbd9bf13c14)
-* [Wireframe mobile 2](https://github.com/Laboratoria/curriculum/assets/123121338/bf96d3ce-150f-47a2-a605-2efac2e0497b)
-
-Diseño Desktop:
-
-* [Wireframe desktop 1](https://github-production-user-asset-6210df.s3.amazonaws.com/92090/261137084-1625aeb8-883c-4b79-86da-5fab34fa5b88.png)
-* [Wireframe desktop 2](https://github-production-user-asset-6210df.s3.amazonaws.com/92090/261137087-6cef16bc-643a-4d6d-bc1c-e0daaeb21c88.png)
-
-## 5. Consideraciones técnicas
-
-La lógica del proyecto debe estar implementada completamente en JavaScript
-(ES6), HTML y CSS. En este proyecto NO está permitido usar librerías o
-frameworks, solo [vanilla JavaScript](https://medium.com/laboratoria-how-to/vanillajs-vs-jquery-31e623bbd46e),
-con la excepción de librerías para hacer gráficas (charts); ver
-[_Parte opcional_](#7-hacker-edition) más arriba.
-
-El _boilerplate_ contiene una estructura de archivos como punto de partida así
-como toda la configuración de dependencias:
-
-```text
-.
-├── README.md
-├── package.json
-├── src
-|  ├── data 
-|  |  └── dataset.js (La que hayas generado con la IA)
-|  ├── dataFunctions.js
-|  ├── view.js
-|  ├── index.html
-|  ├── main.js
-|  └── style.css
-└── test
-   └── data.js
-   └── dataFunctions.spec.js
-   └── tests-read-only
-
-```
-
-### `src/index.html`
-
-Como en el proyecto anterior, existe un archivo `index.html`. Como ya sabes,
-acá va la página que se mostrará a la usuaria. También nos sirve para indicar
-qué scripts se usarán y unir todo lo que hemos hecho.
-
-### `src/main.js`
-
-Recomendamos usar `src/main.js` para todo tu código que tenga que ver con
-mostrar los datos en la pantalla. Con esto nos referimos básicamente a la
-interacción con el DOM. Operaciones como creación de nodos, registro de
-manejadores de eventos (_event listeners_ o _event handlers_).
-
-Esta no es la única forma de dividir tu código, puedes usar más archivos y
-carpetas, siempre y cuando la estructura sea clara para tus compañeras.
-
-En este archivo encontrarás una serie de _imports_ listos para _cargar_
-las diferentes fuentes de datos.
-
-Por ejemplo, lost datos con los que vas a trabajar,
-los encontrarás en la siguiente línea:
-
-```js
-import data from './data/dataset.js';
-```
-
-### `src/dataFunctions.js`
-
-El corazón de este proyecto es la manipulación de datos a través de arreglos
-y objetos.
-
-Este archivo va a contener toda la funcionalidad que corresponda
-a obtener, procesar y manipular datos (tus funciones). Por ejemplo:
-
-* `filterData(data, filterBy, value)`: esta función recibe tres parámetros.
-  El primer parámetro, `data`, nos entrega los datos.
-  El segundo parámetro, `filterBy`, nos dice con respecto a cuál de los campos de
-  la data se quiere filtrar.
-  El tercer parámetro, `value`, indica el valor de campo que queremos filtrar.
-
-* `sortData(data, sortBy, sortOrder)`: esta función `sort` u ordenar
-  recibe tres parámetros.
-  El primer parámetro, `data`, nos entrega los datos.
-  El segundo parámetro, `sortBy`, nos dice con respecto a cuál de los campos de
-  la data se quiere ordenar.
-  El tercer parámetro, `sortOrder`, indica si se quiere ordenar de manera
-  ascendente o descendente.
-
-* `computeStats(data)`: la función `compute` o calcular, nos permitirá hacer
-  cálculos estadísticos básicos para ser mostrados de acuerdo a la data
-  proporcionada, esta función debe usar el método reduce.
-
-Estas funciones deben ser [_puras_](https://medium.com/laboratoria-developers/introducci%C3%B3n-a-la-programaci%C3%B3n-funcional-en-javascript-parte-2-funciones-puras-b99e08c2895d)
-e independientes del DOM. Estas funciones serán después usadas desde el archivo
-`src/main.js`, al cargar la página, y cada vez que la usuaria interactúe
-(click, filtrado, ordenado, ...).
-
-### `src/data`
-
-En esta carpeta están los datos con los que vas a trabajar (los datos de ejemplo
-o los datos que generarías con ayuda de la inteligencia artificial).
-
-### `test/dataFunctions.spec.js`
-
-En este archivo tendrás hacer pruebas unitarias de las funciones
-implementadas en el archivo `dataFunctions.js`. (`filterBy`, `sortBy`, etc.)
-
-### `test/data.js`
-
-En esta archivo puedes construir y exportar data "mock" para usar en los tests.
-Es mas fácil probar un arreglo de 5 elementos de un arreglo de 24, por eso
-vas a crear una muestra de la data que quieres probar. Como mínimo
-debes exportar un variable se llama `data`, pero puedes definir y exportar mas
-si sea necesario para tus tests.
-
-### `src/view.js`
-
-Para alcanzar mejor separación de responsabilidades en el código este
-archivo debe tener todas las funciones que utilizara para renderizar
-los elementos dinámicamente.
-
-Al menos se requeriere una función obligatoria:
-
-* `renderItems(data)`: esta función recibe el arreglo de data para renderizar
-  los elementos de cada item, y debería volver un elemento DOM o
-  un string de HTML.
-
-## 6. Criterios de aceptación mínimos del proyecto
-
-### Criterios de código
-
-Con cada objetivo de aprendizaje, evaluamos que el código cumpla con algunos
-criterios. Lo cual no excluye que puedas usar otras opciones, por ejemplo
-en el caso de los selectores, proponemos el uso de `querySelector`,
-no significa que no puedes usar `querySelectorAll` o `getElementId` también.
-
-Puedes ejecutar las pruebas de cada grupo de objetivos de aprendizaje de manera
-individual con los siguientes comandos:
-
-``` sh
-npm run test:oas-html
-npm run test:oas-css
-npm run test:oas-web-api
-npm run test:oas-js
-npm run test:oas-prompting
-npm run test:oas // Esto es para correr todos los tests de OAs
-```
-
-#### HTML
-
-* **Uso de HTML semántico**
-
-  - [ ] Tiene un `<header>` con `<h1>`
-  - [ ] Tiene un `<footer>`
-  - [ ] Tiene un `<main>` con `<h2>`
-  - [ ] Todas las etiquetas de controles (inputs, selects, radio, etc) tienen `<label>`
-  - [ ] `<ul>` esta usado para dibujar la data
-  - [ ] Los hijos de `<li>` usan attributos de microdata `itemscope` e `itemprop`
-
-#### CSS
-
-* **Uso de selectores de CSS**
-
-  - [ ] Uso de selector class para los items <li>
-  - [ ] Uso de flexbox en sentido `row` y `column`
-  - [ ] Uso de flexbox para el elemento que contiene los items
-  - [ ] Uso de flexbox para el elemento que contiene los UI inputs
-
-#### Web APIs
-
-* **Uso de selectores del DOM**
-
-  - [ ] La aplicación usa [`querySelector`](https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector)
-    para buscar los elementos del DOM
-  
-* **Manejo de eventos del DOM (listeners, propagación, delegación)**
-
-  - [ ] `addEventListener` con callback que tiene parámetro de `event`,
-    lo que permite el uso del objeto [`event`](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#event_objects)
-    con `event.target` o `event.currentTarget`
-  - [ ] La aplicación registra [Event Listeners](https://developer.mozilla.org/en/docs/Web/API/EventTarget/addEventListener)
-    para escuchar `click`, `change`, `keyup` dependiendo del evento que
-    se quiere escuchar
-
-* **Manipulación dinámica del DOM**
-
-  - [ ] La aplicación actualiza el atributo [`innerHTML`](https://developer.mozilla.org/es/docs/Web/API/Element/innerHTML).
-  - [ ] La aplicación usa `createElement` y `appendChild`, o template strings
-    para crear elementos
-
-#### JavaScript
-
-* **Variables (declaración, asignación, ámbito)**
-
-  - [ ] La aplicación declara variables con [`let`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/let)
-    y [`const`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/const)
-    en manera adecuada
-
-* **Uso de condicionales (if-else, switch, operador ternario, lógica booleana)**
-
-  - [ ] La aplicación usa el statement
-    [`if..else`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if...else)
-      para evaluar condiciones
-
-* **Uso de bucles/ciclos (while, for, for..of)**
-
-  - [ ] La aplicación usa el statement [`for`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for)
-    o método [`forEach`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach)
-    para iterar
-
-* **Funciones (params, args, return)**
-
-  En el archivo `dataFunctions.js` define las siguientes funciones:
-  - [ ] una función `sortBy` que tiene 3 parámetros (`data`, `sortBy`, `sortOrder`)
-    y devuelve el arreglo ordenado
-  - [ ] una función `filterBy` que tiene 3 parámetros (`data`, `filterBy`, `value`)
-    y devuelve el arreglo filtrado
-  - [ ] una función `computeStats` que tiene al menos un parámetro (`data`)
-    y devuelve un valor computado
-
-  Más sobre estos puntos en [la sección dataFunctions.js](#src/dataFunctions.js)
-
-* **Arrays (arreglos)**
-
-  - [ ] Uso de [Arreglos](https://curriculum.laboratoria.la/es/topics/javascript/04-arrays)
-  - [ ] Uso de [Array.prototype.sort() - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/sort)
-    o [Array.prototype.toSorted - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/toSorted)
-  - [ ] Uso de [Array.prototype.forEach() - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach)
-  - [ ] Uso de [Array.prototype.map() - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
-  - [ ] Uso de [Array.prototype.filter() - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
-  - [ ] Uso de [Array.prototype.reduce() - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce)
-
-* **Objetos**
-
-  - [ ] Uso de notación de punto para [acceder propiedades](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_accessors)
-  - [ ] Uso de notación de brackets para [acceder propiedades](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_accessors)
-
-* **Módulos de ECMAScript (ES Modules)**
-
-  - [ ] La aplicación usa [`import`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import)
-    y [`export`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/export)
-    para importar y exportar valores desde un modulo JavaScript.
-
-### Criterios del proyecto
-
-#### Definición del producto
-
-Documenta brevemente tu trabajo en el archivo `README.md` de tu repositorio,
-contándonos cómo fue tu proceso de diseño y cómo crees que el producto resuelve
-el problema (o problemas) que tiene tu usuaria.
-
-#### Historias de usuario
-
-Una vez que entiendas las necesidades de tus usuarias, escribe las [Historias
-de Usuaria](https://es.wikipedia.org/wiki/Historias_de_usuario) que representen
-todo lo que la usuaria necesita hacer/ver. Las **Historias de Usuario** deben
-ser el resultado de tu proceso de investigación o _research_ de tus usuarias.
-
-Asegúrate de incluir la definición de terminado (_definition of done_) y los
-Criterios de Aceptación para cada una.
-
-Usa tus historias de usuario para planificar tus sprints dividiendo
-cada historia en tareas.
-
-En la medida de lo posible, termina una Historia de Usuario antes de pasar
-a la siguiente (cumpliendo con la Definición de Terminado y los Criterios de Aceptación).
-
-#### Generar los datos
-
-La temática será a tu gusto, por ejemplo, pueden ser personajes importantes
-en la historia, personajes inventados, países, películas... etc.
-
-En el próximo proyecto, con la ayuda de la inteligencia artificial, deberás
-hacer que la usuaria pueda chatear con la data generada.
-Por ejemplo, si la data está mostrando un país, la usuaria podría
-preguntarle en que año fue fundado o cual es su capital, etc.
-Tenlo en cuenta a la hora de generar tu dataset.
-
-Esta data la vas a guardar en un archivo javascript. Este archivo,
-debe exportar un arreglo con 24 objetos. Y la estructura de cada objeto
-debe ser la siguiente:
-
-* `id`: Identificador único (no pueden haber dos elementos con el mismo `id`).
-  Debe ser un string de no más de 32 characteres, en minúscula, compuesto solo
-  por letras, números, underscore (`_`) o guión (`-`). Por ejemplo: `"ada-lovelace"`.
-* `name`: El nombre del personaje, país, película, etc.
-* `shortDescription`: Descripción corta del elemento. Esta descripción deberá
-  tener como máximo 20 palabras.
-* `description`: Descripción extendida del elemento. Esta descripción deberá
-  tener entre 80 y 100 palabras. Al momento de mostrar este dato en pantalla
-  puedes truncarlo para que no ocupe tanto espacio.
-* `imageUrl`: URL de la imagen. Esta imagen será generada a través de alguna
-  herramienta basada en inteligencia artifical. Una vez generada la imagen,
-  y guardada en tu repo, deberás agregar la URL en este campo.
-* `facts`: Un objeto con al menos **3** "hechos" o "info" sobre este elemento, en
-  formato `"nombre": "valor"`, por ejemplo:
-
-  ```json
-  "facts": {
-    "yearOfBirth": 1843,
-    "placeOfBirth": "London, England",
-    "mainField": "Computer Science",
-  }
-  ```
-
-  Los _nombres de las propiedades_, deben estar en formato _camelCase_.
-  Por ejemplo **ninguno** de los siguientes nombres sería válido:
-
-  ```json
-  "facts": {
-    "year_of_birth": 1843,
-    "Place of Birth": "London, England",
-    "MainField": "Computer Science",
-  }
-  ```
-
-  Los _valores de las propiedades_, sólo pueden ser de tipo `number`, `boolean`
-  o un `string` de no más de 64 caracteres (este **no** tiene restricciones sobre
-  el tipo de caracteres que puede contener).
-
-  Y por último ten en cuenta 2 cosas:
-  - Todos los elementos del dataset deben compartir las mismas propiedades en
-    `facts`, es decir, que si un elemento tiene una propiedad `yearOfBirth`,
-    el resto de elementos del array también deben tener esa propiedad.
-  - No es necesario que los nombres de las propiedades estén en inglés,
-    `"lugarDeNacimiento"` es un nombre igual de válido.
-
-* `extraInfo`: Y por último un campo libre opcional, similar a `facts`. Si lo
-  necesitas, aquí puedes poner cualquier otro tipo de información en formato
-  donde puedes poner otra info que necesites en formato `"nombre": "valor"`,
-  pero sin restricciones sobre el tipo de dato del valor. Por ejemplo:
-
-  ```json
-  "extraInfo": {
-    "imagePrompt": "Un texto bien, bien largo...",
-    "writings": [
-      "Vol. 1",
-      "Vol. 2",
-      "Vol. 3",
-      "Vol. 4"
-    ]
-  }
-  ```
-
-Un ejemplo de data, según los requisitos anteriores podría ser:
-
-```js
-export default [
-  {
-    "id": "ada-lovelace",
-    "name": "Ada Lovelace",
-    "shortDescription": "Pionera de la informática, fue la primera programadora.",
-    "description": "Una visionaria del siglo XIX ...",
-    "imageUrl": "URL_DE_LA_IMAGEN_GENERADA",
-    "facts": {
-      "yearOfBirth": 1843,
-      "placeOfBirth": "London, England",
-      "mainField": "Computer Science",
-    }
-  },
-  //... 23 objetos más
-]
-```
-
-La data generada deberás reemplazarla por el contenido de este archivo:
-`./src/data/dataset.js`.
-
-**El tiempo estimado que deberías dedicar a la generación de estos datos
-es de máximo un sprint.** Si transcurrido un sprint, no tienes un
-conjunto de datos generados, deberás
-utilizar los datos de ejemplo ubicados en la ruta:
-`./src/data/dataset.js`.
-
-Las URLs de las imágenes dentro del archivo javascript, deben enlazar
-a las imágenes para cada elemento del array.
-Estas imágenes pueden ser generadas por la inteligencia artificial o imágenes
-que puedas encontrar en la web.
-Para la generación de imágenes te recomendamos usar el
-[generador de imágenes de Bing](https://www.bing.com/create).
-Una vez que tengas la imagen, descárgala u obtiene su URL, para agregársela
-al dataset.
-
-Una vez que tengas el archivo javascript completo, recuerda correr los test con
-`npm run test` para verificar que el archivo esté cumpliendo con lo
-solicitado.
-
-Una vez que hayas delimitado tu campo de interés y generado el archivo
-javascript con la asistencia de la inteligenica artificial, dedica
-tiempo a comprender a fondo a tu usuaria y sus
-necesidades específicas. A partir de esta comprensión, podrás diseñar la
-interfaz que facilite una interacción más efectiva y una comprensión más
-completa de los datos presentados.
-
-#### Prompt utilizado
-
-Dentro del readme que armarás, debe incluir una captura de pantalla
-de tu prompt utilizado para generar los datos. Si utilizaste varios prompts,
-puedes adjuntar todas las capturas que necesites.
-
-#### Diseño de la Interfaz de Usuaria
-
-##### Prototipo de alta fidelidad
-
-Usando los wireframes o bocetos (_sketches_) de tu solución de interfaz
-como base, lo siguiente es diseñar tu Interfaz de Usuaria (UI por sus
-siglas en inglés - _User Interface_). Para eso debes aprender a
-utilizar alguna herramienta de diseño visual.
-Nosotros te recomendamos [Figma](https://www.figma.com/) que es
-una herramienta que funciona en el navegador y, además, puedes crear una cuenta
-gratis. Sin embargo, eres libre de utilizar otros editores gráficos como
-Illustrator, Photoshop, etc.
-
-El diseño debe representar el _ideal_ de tu solución. Digamos que es lo que
-desearías implementar si tuvieras tiempo ilimitado para trabajar. Además, tu
-diseño debe seguir los fundamentos de _visual design_.
-
-Recuerda pedir feedback de tu prototipo a tus compañeras y/o coaches.
-
-#### Testeos de usabilidad
-
-Durante el reto deberás hacer _tests_ de usabilidad con distintos usuarias,
-y con base en los resultados, deberás iterar tus diseños. Cuéntanos
-qué problemas de usabilidad detectaste a través de los _tests_ y cómo los
-mejoraste en tu propuesta final.
-
-#### Implementación de la Interfaz de Usuaria (HTML/CSS/JS)
-
-Luego de diseñar tu interfaz de usuaria deberás trabajar en su implementación.
-**No** es necesario que construyas la interfaz exactamente como la diseñaste.
-Tu tiempo de hacking es escaso, así que deberás priorizar.
-
-Revisa [las funcionalidades](#3-funcionalidades) que el proyecto pide del interfaz.
-
-#### Pruebas unitarias
-
-El _boilerplate_ de este proyecto no incluye Pruebas Unitarias (_tests_), así es
-que  tendrás que escribirlas tú para las funciones encargadas de  _procesar_,
-_filtrar_ y _ordenar_ la data, así como _calcular_ estadísticas. Este proyecto usa
-el framework [Jest](https://jestjs.io/) para ejecutar las pruebas unitarias por lo
-que te recomendamos consultar su documentación.
-
-Tus _pruebas unitarias_ deben dar una cobertura del 70% de _statements_
-(_sentencias_), _functions_ (_funciones_), _lines_ (_líneas_), y _branches_
-(_ramas_) del archivo `src/dataFunctions.js` que contenga tus funciones y
-está detallado en la sección de [Consideraciones técnicas](#src/data.js).
-
-## 7. Hacker edition
-
-Las secciones llamadas _Hacker Edition_ son **opcionales**. Si **terminaste**
-con todo lo anterior y te queda tiempo, intenta completarlas. Así podrás
-profundizar y/o ejercitar más sobre los objetivos de aprendizaje del proyecto.
-
-Features/características extra sugeridas:
-
-* Visualizar la estadística calculada mediante un gráfico. Para
-  ello te recomendamos explorar librerías de gráficas como
-  [Chart.js](https://www.chartjs.org/)
-  o [Google Charts](https://developers.google.com/chart/).
-* 100% Coverage
-
-## 8. Objetivos de aprendizaje
-
-
-Reflexiona y luego marca los objetivos que has llegado a entender y aplicar en tu proyecto. Piensa en eso al decidir tu estrategia de trabajo.
+![chatGPT para generar la data](promptingImage.png)
+![chatGPT para generar la data](chat1.png)
 
 ### HTML
-
-- [ ] **Uso de HTML semántico**
-
-  <details><summary>Links</summary><p>
-
-  * [HTML semántico](https://curriculum.laboratoria.la/es/topics/html/html5/semantic-html)
-  * [Semantics - MDN Web Docs Glossary](https://developer.mozilla.org/en-US/docs/Glossary/Semantics#Semantics_in_HTML)
-</p></details>
+Utilizado para la estructura y marcado del contenido de la aplicación web.
 
 ### CSS
-
-- [ ] **Uso de selectores de CSS**
-
-  <details><summary>Links</summary><p>
-
-  * [Intro a CSS](https://curriculum.laboratoria.la/es/topics/css/css/intro-css)
-  * [CSS Selectors - MDN](https://developer.mozilla.org/es/docs/Web/CSS/CSS_Selectors)
-</p></details>
-
-- [ ] **Modelo de caja (box model): borde, margen, padding**
-
-  <details><summary>Links</summary><p>
-
-  * [Box Model & Display](https://curriculum.laboratoria.la/es/topics/css/css/boxmodel-and-display)
-  * [The box model - MDN](https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/The_box_model)
-  * [Introduction to the CSS box model - MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model)
-  * [CSS display - MDN](https://developer.mozilla.org/pt-BR/docs/Web/CSS/display)
-  * [display - CSS Tricks](https://css-tricks.com/almanac/properties/d/display/)
-</p></details>
-
-- [ ] **Uso de flexbox en CSS**
-
-  <details><summary>Links</summary><p>
-
-  * [A Complete Guide to Flexbox - CSS Tricks](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)
-  * [Flexbox Froggy](https://flexboxfroggy.com/#es)
-  * [Flexbox - MDN](https://developer.mozilla.org/en-US/docs/Learn/CSS/CSS_layout/Flexbox)
-</p></details>
-
-### Web APIs
-
-- [ ] **Uso de selectores del DOM**
-
-  <details><summary>Links</summary><p>
-
-  * [Manipulación del DOM](https://curriculum.laboratoria.la/es/topics/browser/dom/1-dom-methods-selection)
-  * [Introducción al DOM - MDN](https://developer.mozilla.org/es/docs/Web/API/Document_Object_Model/Introduction)
-  * [Localizando elementos DOM usando selectores - MDN](https://developer.mozilla.org/es/docs/Web/API/Document_object_model/Locating_DOM_elements_using_selectors)
-</p></details>
-
-- [ ] **Manejo de eventos del DOM (listeners, propagación, delegación)**
-
-  <details><summary>Links</summary><p>
-
-  * [Introducción a eventos - MDN](https://developer.mozilla.org/es/docs/Learn/JavaScript/Building_blocks/Events)
-  * [EventTarget.addEventListener() - MDN](https://developer.mozilla.org/es/docs/Web/API/EventTarget/addEventListener)
-  * [EventTarget.removeEventListener() - MDN](https://developer.mozilla.org/es/docs/Web/API/EventTarget/removeEventListener)
-  * [El objeto Event](https://developer.mozilla.org/es/docs/Web/API/Event)
-</p></details>
-
-- [ ] **Manipulación dinámica del DOM**
-
-  <details><summary>Links</summary><p>
-
-  * [Introducción al DOM](https://developer.mozilla.org/es/docs/Web/API/Document_Object_Model/Introduction)
-  * [Node.appendChild() - MDN](https://developer.mozilla.org/es/docs/Web/API/Node/appendChild)
-  * [Document.createElement() - MDN](https://developer.mozilla.org/es/docs/Web/API/Document/createElement)
-  * [Document.createTextNode()](https://developer.mozilla.org/es/docs/Web/API/Document/createTextNode)
-  * [Element.innerHTML - MDN](https://developer.mozilla.org/es/docs/Web/API/Element/innerHTML)
-  * [Node.textContent - MDN](https://developer.mozilla.org/es/docs/Web/API/Node/textContent)
-</p></details>
+Se empleó CSS con la técnica de Flexbox para crear un diseño adaptable (responsive) y atractivo que se alinea con la estética de Animal Crossing.
 
 ### JavaScript
+JavaScript fue esencial en WikiNook, no solo para la manipulación dinámica del DOM, sino también para implementar diversas funcionalidades clave. Desde la gestión de filtros hasta la interactividad con tarjetas de vecinos y la lógica de búsqueda, JavaScript proporcionó una base sólida para una experiencia de usuario fluida y receptiva. Su versatilidad se extendió más allá de la manipulación del DOM, abarcando diversas interacciones y dinámicas presentes en la aplicación.
 
-- [ ] **Diferenciar entre tipos de datos primitivos y no primitivos**
-
-- [ ] **Arrays (arreglos)**
-
-  <details><summary>Links</summary><p>
-
-  * [Arreglos](https://curriculum.laboratoria.la/es/topics/javascript/arrays)
-  * [Array - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/)
-  * [Array.prototype.sort() - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/sort)
-  * [Array.prototype.forEach() - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach)
-  * [Array.prototype.map() - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
-  * [Array.prototype.filter() - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)
-  * [Array.prototype.reduce() - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array/Reduce)
-</p></details>
-
-- [ ] **Objetos (key, value)**
-
-  <details><summary>Links</summary><p>
-
-  * [Objetos en JavaScript](https://curriculum.laboratoria.la/es/topics/javascript/objects/objects)
-</p></details>
-
-- [ ] **Variables (declaración, asignación, ámbito)**
+### Testing
+Se utilizó Jest para realizar pruebas unitarias, asegurando la integridad y funcionalidad correcta de las distintas partes del código. Las pruebas unitarias contribuyeron a mantener la calidad del código y facilitaron futuras actualizaciones y expansiones del proyecto.
 
-  <details><summary>Links</summary><p>
+## 6. Diseño y Desarrollo del Prototipo
+El proceso de diseño y desarrollo del prototipo de WikiNook fue llevado a cabo con atención meticulosa, centrándonos en la experiencia del usuario y la estética inspirada en Animal Crossing. Utilizamos la plataforma de diseño colaborativo Figma para crear prototipos de media y alta fidelidad que sirvieron como guía visual y funcional antes de la implementación final.
 
-  * [Valores, tipos de datos y operadores](https://curriculum.laboratoria.la/es/topics/javascript/basics/values-variables-and-types)
-  * [Variables](https://curriculum.laboratoria.la/es/topics/javascript/basics/variables)
-</p></details>
+### Prototipo fidelidad media 
 
-- [ ] **Uso de condicionales (if-else, switch, operador ternario, lógica booleana)**
+Se diseñaron dos prototipos uno de media fidelidad que nos muestras las funcionalidades esperamos tuviera el proyecto.
 
-  <details><summary>Links</summary><p>
+<img src="prototipoMediaFidelidad.png" alt="Prototipo media fidelidad" width="500" height="350">
 
-  * [Estructuras condicionales y repetitivas](https://curriculum.laboratoria.la/es/topics/javascript/flow-control/conditionals-and-loops)
-  * [Tomando decisiones en tu código — condicionales - MDN](https://developer.mozilla.org/es/docs/Learn/JavaScript/Building_blocks/conditionals)
-</p></details>
+### Prototipo fidelidad alta
+Encuanto al prototipo de alta fidelidad es la culminación del proyecto, en cuanto a interacción con el usuario, así como los acabados que debe tener la página y las tarjetas mostradas.
 
-- [ ] **Uso de bucles/ciclos (while, for, for..of)**
+<img src="prototipoAltaFidelidad.png" alt="Prototipo alta fidelidad" width="500" height="350">
 
-  <details><summary>Links</summary><p>
+### Implementación
+* Transición a Desarrollo.
+* Adaptación a Tecnologías Seleccionadas. </br>
+¡Tú también puedes echarle un vistazo a nuestro prototipo! clic aquí [Link al prototipo](https://www.figma.com/proto/lw0HfZvfVOoTsurPPYlpeL/Prototipo%2FDataverse?page-id=0%3A1&type=design&node-id=168-26302&viewport=928%2C-200%2C0.59&t=zLZEgt3rNaGcR8uG-1&scaling=contain&starting-point-node-id=36%3A103&mode=design)
 
-  * [Bucles (Loops)](https://curriculum.laboratoria.la/es/topics/javascript/flow-control/loops)
-  * [Bucles e iteración - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Guide/Loops_and_iteration)
-</p></details>
-
-- [ ] **Funciones (params, args, return)**
-
-  <details><summary>Links</summary><p>
-
-  * [Funciones (control de flujo)](https://curriculum.laboratoria.la/es/topics/javascript/flow-control/functions)
-  * [Funciones clásicas](https://curriculum.laboratoria.la/es/topics/javascript/functions/classic)
-  * [Arrow Functions](https://curriculum.laboratoria.la/es/topics/javascript/functions/arrow)
-  * [Funciones — bloques de código reutilizables - MDN](https://developer.mozilla.org/es/docs/Learn/JavaScript/Building_blocks/Functions)
-</p></details>
-
-- [ ] **Pruebas unitarias (unit tests)**
-
-  <details><summary>Links</summary><p>
-
-  * [Empezando con Jest - Documentación oficial](https://jestjs.io/docs/es-ES/getting-started)
-</p></details>
-
-- [ ] **Módulos de ECMAScript (ES Modules)**
-
-  <details><summary>Links</summary><p>
-
-  * [import - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Statements/import)
-  * [export - MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Statements/export)
-</p></details>
-
-- [ ] **Uso de linter (ESLINT)**
-
-- [ ] **Uso de identificadores descriptivos (Nomenclatura y Semántica)**
-
-- [ ] **Diferenciar entre expresiones (expressions) y sentencias (statements)**
-
-### Control de Versiones (Git y GitHub)
-
-- [ ] **Git: Instalación y configuración**
-
-- [ ] **Git: Control de versiones con git (init, clone, add, commit, status, push, pull, remote)**
-
-- [ ] **Git: Integración de cambios entre ramas (branch, checkout, fetch, merge, reset, rebase, tag)**
-
-- [ ] **GitHub: Creación de cuenta y repos, configuración de llaves SSH**
-
-- [ ] **GitHub: Despliegue con GitHub Pages**
-
-  <details><summary>Links</summary><p>
-
-  * [Sitio oficial de GitHub Pages](https://pages.github.com/)
-</p></details>
-
-- [ ] **GitHub: Colaboración en Github (branches | forks | pull requests | code review | tags)**
-
-### Centrado en el usuario
-
-- [ ] **Diseñar y desarrollar un producto o servicio poniendo a las usuarias en el centro**
-
-### Diseño de producto
-
-- [ ] **Crear prototipos de alta fidelidad que incluyan interacciones**
-
-- [ ] **Seguir los principios básicos de diseño visual**
-
-### Investigación
-
-- [ ] **Planear y ejecutar testeos de usabilidad de prototipos en distintos niveles de fidelidad**
-
-  <details><summary>Links</summary><p>
-
-  * [Intro a testeos usabilidad](https://coda.io/@bootcamp-laboratoria/contenido-ux/test-de-usabilidad-15)
-  * [Pruebas con Usuarios 1 — ¿Qué, cuándo y para qué testeamos?](https://eugeniacasabona.medium.com/pruebas-con-usuarios-1-qu%C3%A9-cu%C3%A1ndo-y-para-qu%C3%A9-testeamos-7c3a89b4b5e7)
-</p></details>
-
-### AI Prompting
-
-- [ ] **Dando Instrucciones**
-
-  <details><summary>Links</summary><p>
-
-  * [Dando Instrucciones | Learn Prompting: Your Guide to Communicating with AI](https://learnprompting.org/es/docs/basics/instructions)
-</p></details>
-
-- [ ] **Few shot prompting**
-
-  <details><summary>Links</summary><p>
-
-  * [Few shot prompting | Learn Prompting: Your Guide to Communicating with AI](https://learnprompting.org/es/docs/basics/few_shot)
-</p></details>
-
-## 9. Pistas, tips y lecturas complementarias
-
-### Primeros pasos
-
-Súmate al canal de Slack
-[#project-dataverse](https://claseslaboratoria.slack.com/archives/C03MV35EP5M)
-para conversar y pedir ayuda del proyecto.
-
-Antes de empezar a escribir código, debes definir qué deberá hacer el
-producto con base en el conocimiento que puedas obtener de tu usuaria.
-Estas preguntas te pueden ayudar:
-
-* ¿Quiénes son las principales usuarias del producto?
-* ¿Cuáles son los objetivos de estas usuarias en relación con el producto?
-* ¿Cuáles son los datos más relevantes que quieren ver en la interfaz y por qué?
-* ¿Cuándo utilizan o utilizarían el producto?
-* Toda tu investigación previa debe tener como resultado todas las Historias
-  de Usuaria de tu proyecto.
-* No hagas los prototipos de alta fidelidad de todas tus Historias. Comienza
-  solamente por los que se necesiten para tu Sprint 1 (semana 1 de trabajo). Más
-  pistas en la guía de organización para el proyecto.
-
-Cuando ya estés lista para codear, te sugerimos empezar de esta manera:
-
-1. Una de las integrantes del equipo debe realizar un :fork_and_knife:
-   [fork](https://help.github.com/articles/fork-a-repo/) del repo de tu cohort,
-   tus _coaches_ te compartirán un _link_ a un repo y te darán acceso de lectura
-   en ese repo. La otra integrante del equipo deber hacer un fork **del
-   repositorio de su compañera** y
-   [configurar](https://gist.github.com/BCasal/026e4c7f5c71418485c1) un `remote`
-   hacia el mismo.
-2. :arrow_down: [Clona](https://help.github.com/articles/cloning-a-repository/)
-   tu _fork_ a tu computadora (copia local).
-3. 📦 Instala las dependencias del proyecto con el comando `npm install`. Esto
-   asume que has instalado [Node.js](https://nodejs.org/) (que incluye [npm](https://docs.npmjs.com/)).
-4. Si todo ha ido bien, deberías poder ejecutar las :traffic_light:
-   pruebas unitarias (unit tests) con el comando `npm test`.
-5. Para ver la interfaz de tu programa en el navegador, usa el comando
-  `npm start` para arrancar el servidor web y dirígete a
-  `http://localhost:5000` en tu navegador.
-6. A codear se ha dicho! :rocket:
-
-### Contenido de referencia
-
-#### Desarrollo Front-end
-
-* [Tópicos en la currícula de Laboratoria](https://curriculum.laboratoria.la/es/web-dev/topics)
-  testing, arreglos, objetos, funciones, DOM en Browser Javascript.
-* [Buscando elementos con querySelector*](https://es.javascript.info/searching-elements-dom)
-* [Objeto del evento](https://es.javascript.info/introduction-browser-events#objeto-del-evento)
-* [Array en MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array)
-* [Array.sort en MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/sort)
-* [Array.toSorted en MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/toSorted)
-* [Array.map en MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/map)
-* [Array.filter en MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/filter)
-* [Array.reduce en MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/reduce)
-* [Array.forEach en MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Array/forEach)
-* [Object.keys en MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/keys)
-* [Object.entries en MDN](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Objetos_globales/Object/entries)
-* [Atributos de datos](https://developer.mozilla.org/es/docs/Learn/HTML/Howto/Use_data_attributes)
-* [expressions-vs-statements](https://2ality.com/2012/09/expressions-vs-statements.html)
-* [expresión vs sentencia](https://openclassrooms.com/en/courses/4309531-descubre-las-funciones-en-javascript/5108986-diferencia-entre-expresion-y-sentencia)
-* [Datos atómicos vs datos estructurados](https://www.todojs.com/tipos-datos-javascript-es6/)
-* [Módulos: Export](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/export)
-* [Módulos: Import](https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/import)
-* [Diferencia entre array y objetos](https://youtu.be/mJJloQY7A8Y)
-* [¿Cómo puedo recorrer un objeto?](https://youtube.com/01RHn23Bn_0)
-* [`map`, `filter`, `sort` y `reduce` también son métodos para objetos](https://youtu.be/bUl1R2lQvKo)
-* [Diferencia entre expression y statements](https://youtu.be/wlukoWco2zk)
-* [Diferencia entre createElement e innerHTML](https://www.javascripttutorial.net/javascript-dom/javascript-innerhtml-vs-createelement/)
-* [¿Qué es el Scope?](https://youtu.be/s-7C09ymzK8)
-
-#### Herramientas
-
-* [Git](https://git-scm.com/)
-* [GitHub](https://github.com/)
-* [GitHub Pages](https://pages.github.com/)
-* [Para preguntas sobre Git recomendamos ver este playlist](https://www.youtube.com/watch?v=F1EoBbvhaqU&list=PLiAEe0-R7u8k9o3PbT3_QdyoBW_RX8rnV)
-* [Node.js](https://nodejs.org/)
-* [Jest](https://jestjs.io/)
-
-#### Organización del Trabajo
-
-* [Historias de Usuario](https://www.youtube.com/watch?v=ky6wFiF5vMk&t=344s).
-  Ojo que Cris no diferencia _Definición de terminado_ de _Criterios de
-  Aceptación_ y nosotros sí lo haremos. Más detalles en la guía.
-* [Cómo dividir H.U.](https://www.youtube.com/watch?v=Ueq786iZ30I&t=341s)
-
-## 10. Consideraciones para pedir tu Project Feedback
-
-Antes de agendar tu Project Feedback con un coach, asegúrate que tu proyecto:
-
-* [ ] Cumple con todos los criterios mínimos de aceptación al ejecutar `npm run test:oas`
-* [ ] Cumple con todas las pruebas _end to end_ al ejecutar `npm run test:e2e`
-* [ ] Cumple con todas las pruebas unitarias al ejecutar `npm run test` y
-  que tienen una cobertura del 70% de _statements_ (_sentencias_),
-  _functions_ (_funciones_), _lines_ (_líneas_), y _branches_
-* [ ] Esta libre de _errores_ de `eslint` al ejecutar `npm run pretest`
-* [ ] Está subido a GitHub y desplegado en GitHub Pages
-* [ ] Captura de pantalla del prompt utilizado para generar los datos.
-* Tiene un `README.md` con la siguente:
-  - [ ] _Definición del producto_ clara e informativa
-  - [ ] Historias de usuario
-  - [ ] Un _Diseño de la Interfaz de Usuaria_ (prototipo de alta fidelidad)
-  - [ ] El listado de problemas que detectaste a través de tests
-    de usabilidad en el `README.md`
-* Tiene un UI que cumple las funcionalidades:
-  - [ ] Muestra lista con datos y/o indicadores
-  - [ ] Permite ordenar data por uno o más campos (asc y desc)
-  - [ ] Permite filtrar data con base en una condición
-  - [ ] Permite limpiar los filtros con un botón
-  - [ ] Es _responsive_
+#### Testeos de usabilidad
 
-Recuerda que debes hacer una autoevaluación de _objetivos de aprendizaje_ y
-_life skills_ desde tu dashboard de estudiante.
+Se realizo una prueba de usabilidad con usuarios elegidos al azar para ayudarnos a generar información que nos fue de utilidad para el mejoramiento dinámico y visual de la página.
 
-Si no has completado todo lo anterior, no consideramos que estás lista para
-tu sesión de Project Feedback.
+[Enlace del documento](https://docs.google.com/document/d/1moavw2dL9eJssKzZC8Xq0elcS4KpEhgRxF3GcTFZ-sI/edit#heading=h.icq4iwform4o)
+  
\ No newline at end of file
diff --git a/WikiNook.gif b/WikiNook.gif
new file mode 100644
index 00000000..60a10487
Binary files /dev/null and b/WikiNook.gif differ
diff --git a/chat1.png b/chat1.png
new file mode 100644
index 00000000..178c267c
Binary files /dev/null and b/chat1.png differ
diff --git a/chat2.png b/chat2.png
new file mode 100644
index 00000000..1793a064
Binary files /dev/null and b/chat2.png differ
diff --git a/fonts/EncodeSans_Condensed-Bold.ttf b/fonts/EncodeSans_Condensed-Bold.ttf
new file mode 100644
index 00000000..31882870
Binary files /dev/null and b/fonts/EncodeSans_Condensed-Bold.ttf differ
diff --git a/fonts/EncodeSans_Condensed-Light.ttf b/fonts/EncodeSans_Condensed-Light.ttf
new file mode 100644
index 00000000..80e3497e
Binary files /dev/null and b/fonts/EncodeSans_Condensed-Light.ttf differ
diff --git a/fonts/EncodeSans_Condensed-Regular.ttf b/fonts/EncodeSans_Condensed-Regular.ttf
new file mode 100644
index 00000000..87272350
Binary files /dev/null and b/fonts/EncodeSans_Condensed-Regular.ttf differ
diff --git a/promptingImage.png b/promptingImage.png
new file mode 100644
index 00000000..2f0f7dc4
Binary files /dev/null and b/promptingImage.png differ
diff --git a/prototipoAltaFidelidad.png b/prototipoAltaFidelidad.png
new file mode 100644
index 00000000..85d5b780
Binary files /dev/null and b/prototipoAltaFidelidad.png differ
diff --git a/prototipoMediaFidelidad.png b/prototipoMediaFidelidad.png
new file mode 100644
index 00000000..92fc32f7
Binary files /dev/null and b/prototipoMediaFidelidad.png differ
diff --git a/src/data/dataset.js b/src/data/dataset.js
index 0ebafb6f..37d5df47 100644
--- a/src/data/dataset.js
+++ b/src/data/dataset.js
@@ -1,378 +1,365 @@
 export default [
   {
-    "id": "ada-lovelace",
-    "name": "Ada Lovelace",
-    "shortDescription": "Pionera en la programación, primera programadora de la historia.",
-    "description": "Una visionaria matemática británica del siglo XIX, es aclamada como la primera programadora de la historia. Su colaboración con Charles Babbage en la creación de la Máquina Analítica la llevó a desarrollar algoritmos, incluyendo el famoso \"algoritmo de Bernoulli\", destinados a ser procesados por una máquina. Su visión pionera la convirtió en una figura fundamental en la informática y la inteligencia artificial. Lovelace demostró que las computadoras podían ir más allá de simples cálculos matemáticos, anticipando un mundo donde la programación sería esencial en la resolución de problemas complejos, dejando una huella imborrable en la ciencia y la tecnología.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/ada-lovelace.jpg",
-    "facts": {
-      "yearOfBirth": "1815",
-      "yearOfDeath": "1852",
-      "birthPlace": "Londres, Reino Unido",
-      "mainField": "Ciencia de la Computación"
+    id: "beaDog",
+    name: "Bea",
+    species: "Perro",
+    personality: "Dulce",
+    gender: "Femenino",
+    shortDescription: "Perro deportista y enérgico, amante del ejercicio y las competiciones.",
+    description: "Bea es un perro orgulloso y elegante que se considera a sí misma una autoridad en moda y alta sociedad en Animal Crossing. Siempre está al tanto de las últimas tendencias y eventos de la alta sociedad. Bea se enorgullece de su elegancia y buen gusto, y a menudo ofrece consejos de moda a los demás habitantes. Aunque puede parecer algo distante al principio, aprecia la amistad genuina y siempre está dispuesta a ayudar a sus amigos. ¡Celebra su cumpleaños el 15 de octubre!",
+    imageUrl: "https://dodo.ac/np/images/thumb/c/c2/Bea_NH.png/150px-Bea_NH.png",
+    facts: {
+      zodiacSign: "Leo",
+      catchPhrase: "¡A darlo todo!",
+      birthDate: "15/10",
     },
-    "extraInfo": {
-      "imageSource": "https://www.bing.com/images/create/genera-una-imagen-de-ada-lovelace2c-la-primera-prog/650a1eff8ff04b88833d5cdef0309441"
-    }
   },
   {
-    "id": "emmy-noether",
-    "name": "Emmy Noether",
-    "shortDescription": "Matemática destacada, teorema fundamental en álgebra abstracta.",
-    "description": "Una brillante matemática alemana, revolucionó la física teórica con sus contribuciones al teorema de conservación de la energía y el teorema de Noether, fundamentales en la teoría de la relatividad y la mecánica cuántica. A pesar de los obstáculos que enfrentó como mujer en la academia, sus investigaciones en álgebra abstracta y teoría de grupos son fundamentales en la física moderna. Su capacidad para unificar conceptos matemáticos y físicos marcó un hito en la historia de la ciencia, allanando el camino para futuras generaciones de científicas.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/emmy-noether.jpg",
-    "facts": {
-      "yearOfBirth": "1882",
-      "yearOfDeath": "1935",
-      "birthPlace": "Erlangen, Alemania",
-      "mainField": "Matemáticas"
+    id: "biskitDog",
+    name: "Biskit",
+    species: "Perro",
+    personality: "Perezoso",
+    gender: "Masculino",
+    shortDescription: "Perro despreocupado y amante de las galletas, siempre con un hambre insaciable.",
+    description: "Biskit es un perro despistado con una personalidad relajada y amigable en Animal Crossing. Siempre parece estar en su propio mundo y es conocido por su actitud despreocupada. A menudo se le encuentra tarareando melodías alegres y disfrutando de la vida sin preocupaciones. Biskit es fácil de llevar y se lleva bien con otros habitantes del pueblo. Su catchphrase es '¡bork!', reflejando su naturaleza canina. Aunque su cabeza pueda estar en las nubes, su corazón está siempre en el lugar correcto, y es un amigo leal para todos en el pueblo. Biskit celebra su cumpleaños el 13 de mayo.",
+    imageUrl: "https://dodo.ac/np/images/thumb/7/78/Biskit_NH.png/150px-Biskit_NH.png",
+    facts: {
+      zodiacSign: "Piscis",
+      catchPhrase: "¡Guau galleta!",
+      birthDate: "13/05",
     },
-    "extraInfo": {
-      "imageSource": "https://www.bing.com/images/create/create-an-image-of-of-a-german-woman2c-a-pioneering/6510ddb1e8254b928b8f8f1d5e95fea4"
-    }
   },
   {
-    "id": "hypatia-de-alejandria",
-    "name": "Hypatia de Alejandría",
-    "shortDescription": "Matemática y filósofa en la antigua Alejandría.",
-    "description": "Filósofa y matemática en la antigua Alejandría, desafió las normas de género de su época al destacar en una sociedad dominada por hombres. Su legado incluye importantes contribuciones a la geometría y la astronomía, así como su destacado papel como maestra y defensora del conocimiento en una época de agitación política. Hypatia demostró que las mujeres podían sobresalir en campos intelectuales y su valentía al mantener sus creencias filosóficas la convierte en un símbolo de resistencia y sabiduría en la historia de la ciencia.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/hypatia-de-alejandria.jpg",
-    "facts": {
-      "yearOfBirth": "circa 360",
-      "yearOfDeath": "415",
-      "birthPlace": "Alejandría, Egipto",
-      "mainField": "Matemáticas, Filosofía"
+    id: "bonesDog",
+    name: "Bones",
+    species: "Perro",
+    personality: "Perezoso",
+    gender: "Masculino",
+    shortDescription: "Perro amigable y entusiasta, siempre lleno de energía y buen humor.",
+    description: "Bones es un perro amable y relajado en Animal Crossing, conocido por su disposición para hacer nuevos amigos y su actitud positiva. Siempre está sonriendo y tratando de ver el lado bueno de la vida. Bones es un compañero leal para los habitantes del pueblo y disfruta pasar tiempo conversando y compartiendo historias. Aunque su personalidad sea un poco ingenua, su corazón es puro y su amabilidad no conoce límites. Su catchphrase es '¡Yip yip!', una expresión de su entusiasmo. Bones celebra su cumpleaños el 4 de agosto.",
+    imageUrl: "https://dodo.ac/np/images/thumb/2/2b/Bones_NH.png/150px-Bones_NH.png",
+    facts: {
+      zodiacSign: "Geminis",
+      catchPhrase: "¡Amigo!",
+      birthDate: "04/08",
     },
-    "extraInfo": {
-      "imageSource": "https://www.bing.com/images/create/create-a-vivid-digital-artwork-or-painting-that-de/6510df0ebe1a4807af22175452761e1a"
-    }
   },
   {
-    "id": "marjorie-lee-browne",
-    "name": "Marjorie Lee Browne",
-    "shortDescription": "Matemática, contribuyó a la teoría de números.",
-    "description": "Matemática estadounidense, destacó en una época en la que las mujeres afroamericanas enfrentaban múltiples barreras en la educación superior. No solo obtuvo su doctorado en matemáticas, sino que también se convirtió en una destacada educadora, promoviendo la diversidad en las ciencias matemáticas y desafiando la discriminación racial y de género. Su compromiso con la educación y su capacidad para inspirar a futuras generaciones la convierten en un modelo a seguir para las mujeres en la ciencia, dejando una huella perdurable en la historia académica.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/marjorie-lee-browne.jpg",
-    "facts": {
-      "yearOfBirth": "1914",
-      "yearOfDeath": "1979",
-      "birthPlace": "Memphis, Estados Unidos",
-      "mainField": "Matemáticas"
+    id: "gooseChicken",
+    name: "Goose",
+    species: "Gallo",
+    personality: "Deportista",
+    gender: "Masculino",
+    shortDescription: "Gallo deportista y competitivo, siempre listo para un desafío atlético.",
+    description: "Goose es una gallina jock con una gran pasión por el ejercicio y el deporte en Animal Crossing. Siempre está lleno de energía y entusiasmo, listo para animar a los habitantes del pueblo a mantenerse activos. Goose es conocido por su actitud competitiva y su amor por la competición deportiva. Siempre está entrenando para mejorar su rendimiento y es un modelo a seguir para aquellos que quieren mantenerse en forma. Su catchphrase es '¡Buh-kay!', reflejando su espíritu deportivo. Goose celebra su cumpleaños el 4 de octubre.",
+    imageUrl: "https://dodo.ac/np/images/9/91/Goose_NH.png",
+    facts: {
+      zodiacSign: "Aries",
+      catchPhrase: "¡Ánimo!",
+      birthDate: "04/10",
     },
-    "extraInfo": {
-      "imageSource": "https://www.bing.com/images/create/design-an-inspiring-and-historically-accurate-imag/6510df7e7bb745f69d67f695441607a8"
-    }
   },
   {
-    "id": "shakuntala-devi",
-    "name": "Shakuntala Devi",
-    "shortDescription": "Matemática prodigio, conocida como la 'Calculadora Humana'.",
-    "description": "Conocida como \"la bruja de las matemáticas\" de la India, dejó una marca indeleble en el mundo de los números. Su capacidad mental asombrosa la llevó a resolver complejos cálculos matemáticos mentalmente en cuestión de segundos, estableciendo récords mundiales. Además de su talento innato, Devi promovió activamente la educación matemática y luchó por la igualdad de género en un país donde las mujeres enfrentaban desafíos en la ciencia y la educación. Su legado destaca el poder de la mente humana y la importancia de la igualdad de oportunidades en la ciencia.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/shakuntala-devi.jpg",
-    "facts": {
-      "yearOfBirth": "1929",
-      "yearOfDeath": "2013",
-      "birthPlace": "Bangalore, India",
-      "mainField": "Matemáticas"
+    id: "kenChicken",
+    name: "Ken",
+    species: "Gallo",
+    personality: "Esnob",
+    gender: "Masculino",
+    shortDescription: "Gallo gentil y aficionado a la jardinería, siempre cuidando de las flores y plantas del pueblo.",
+    description: "Ken es una gallina amigable y alegre en Animal Crossing, siempre dispuesta a hacer nuevos amigos y compartir sonrisas. Su actitud positiva y su disposición para ayudar a los demás lo convierten en un vecino querido en el pueblo. Ken disfruta de la música y toca el shamisen con pasión. Siempre está en busca de una buena melodía para alegrar el día de todos. Su catchphrase es '¡Cluckaroo!', reflejando su entusiasmo por la vida. Ken celebra su cumpleaños el 23 de diciembre.",
+    imageUrl: "https://dodo.ac/np/images/e/e0/Ken_NH.png",
+    facts: {
+      zodiacSign: "Libra",
+      catchPhrase: "¡Buen día!",
+      birthDate: "23/12",
     },
-    "extraInfo": {
-      "imageSource": "https://www.bing.com/images/create/indian-woman-writing-math-problems-in-a-blackbard-/6510e19f3db54e14b365b7e8dc5045f6"
-    }
   },
   {
-    "id": "sofia-kovalevskaya",
-    "name": "Sofia Kovalevskaya",
-    "shortDescription": "Matemática y escritora, contribuyó a la teoría de funciones.",
-    "description": "Matemática rusa del siglo XIX, dejó una marca indeleble en la ciencia del siglo XIX al desafiar las barreras de género. Como matemática rusa, superó las restricciones sociales de su época para convertirse en la primera mujer en obtener un doctorado en matemáticas en Europa. Sus contribuciones a la teoría de las ecuaciones diferenciales y la mecánica revolucionaron la disciplina, abriendo nuevas perspectivas en el análisis matemático. Su destacada membresía en la Academia de Ciencias de Suecia marcó un hito en la historia de las mujeres en la ciencia.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/sofia-kovalevskaya.jpg",
-    "facts": {
-      "yearOfBirth": "1850",
-      "yearOfDeath": "1891",
-      "birthPlace": "Moscú, Rusia",
-      "mainField": "Matemáticas"
+    id: "rizzoMouse",
+    name: "Rizzo",
+    species: "Raton",
+    personality: "Gruñon",
+    gender: "Masculino",
+    shortDescription: "Ratón cascarrabias con un toque de sarcasmo en su actitud.",
+    description: "Rizzo es un ratón cascarrabias con un toque de sarcasmo en su actitud en Animal Crossing. A pesar de su actitud a veces brusca, Rizzo tiene un corazón de oro y se preocupa por sus amigos. Siempre está dispuesto a ayudar en tiempos de necesidad, aunque lo haga con un toque de sarcasmo. Es conocido por sus comentarios mordaces y su sentido del humor peculiar. Su catchphrase es '¡Squee!', una expresión que a menudo usa para expresar su sorpresa o emoción. Rizzo celebra su cumpleaños el 17 de enero.",
+    imageUrl: "https://dodo.ac/np/images/6/69/Rizzo_NH.png",
+    facts: {
+      zodiacSign: "Leo",
+      catchPhrase: "¡Cheese!",
+      birthDate: "17/01",
     },
-    "extraInfo": {
-      "imageSource": "https://www.bing.com/images/create/indian-woman-writing-math-problems-in-a-blackbard-/6510e19f3db54e14b365b7e8dc5045f6"
-    }
   },
   {
-    "id": "yoko-shimomura",
-    "name": "Yoko Shimomura",
-    "shortDescription": "Compositora de música, destacada en la industria de los videojuegos.",
-    "description": "Compositora japonesa, es una figura destacada en la ciencia de la música y el arte sonoro. Aunque no se dedica a la ciencia en el sentido tradicional, su trabajo en la composición musical ha requerido un profundo entendimiento de la teoría musical y la tecnología de audio. Ha contribuido de manera significativa a la industria de los videojuegos, componiendo icónicas bandas sonoras que han enriquecido la experiencia de juego. Su éxito en un campo donde las mujeres estaban subrepresentadas la convierte en un modelo a seguir, incluso en campos no convencionales como la composición musical.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/yoko-shimomura.jpg",
-    "facts": {
-      "yearOfBirth": "1967",
-      "birthPlace": "Hyogo, Japón",
-      "mainField": "Composición Musical, Video Juegos"
+    id: "sallySquirrel",
+    name: "Sally",
+    species: "Ardilla",
+    personality: "Dulce",
+    gender: "Femenino",
+    shortDescription: "Ardilla amable y soñadora, siempre en busca de la belleza y la tranquilidad.",
+    description: "Sally es una ardilla dulce y amable que siempre está dispuesta a ayudar a los demás en Animal Crossing. Su personalidad es amigable y cariñosa, lo que la convierte en una de las habitantes más queridas del pueblo. Sally disfruta mucho de la jardinería y pasa mucho tiempo cuidando de las flores y los árboles. Siempre tiene una sonrisa en el rostro y su catchphrase es '¡Chispea!', reflejando su actitud optimista. Además, Sally celebra su cumpleaños el 19 de junio.",
+    imageUrl: "https://i.postimg.cc/ZRxC84gJ/501px-Sally-NH.png",
+    facts: {
+      zodiacSign: "Acuario",
+      catchPhrase: "¡Bellissima!",
+      birthDate: "19/06",
     },
-    "extraInfo": {
-      "imageSource": "https://www.bing.com/images/create/yoko-shimomura-making-music-for-a-video-game-in-19/6510e40dd1eb45d0906e8c1f4bb601d3"
-    }
   },
   {
-    "id": "maryam-mirzakhani",
-    "name": "Maryam Mirzakhani",
-    "shortDescription": "Matemática, ganadora del Premio Fields.",
-    "description": "Matemática iraní, hizo historia al convertirse en la primera mujer en ganar la Medalla Fields, el premio más prestigioso en matemáticas. Sus investigaciones en la geometría de superficies y la teoría de las superficies de Riemann han tenido un impacto duradero en la matemática pura. A lo largo de su carrera, Mirzakhani inspiró a muchas mujeres a perseguir carreras en ciencia y matemáticas, derribando las barreras de género. Su enfoque innovador y su capacidad para resolver problemas complejos la convierten en un modelo a seguir para la comunidad científica y en un símbolo de la excelencia matemática.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/maryam-mirzakhani.jpg",
-    "facts": {
-      "yearOfBirth": "1977",
-      "yearOfDeath": "2017",
-      "birthPlace": "Teherán, Irán",
-      "mainField": "Matemáticas"
+    id: "rodMouse",
+    name: "Rod",
+    species: "Raton",
+    personality: "Deportista",
+    gender: "Masculino",
+    shortDescription: "Ratón deportista y competitivo, siempre en busca de desafíos atléticos.",
+    description: "Rod es un ratón jock en Animal Crossing, siempre en busca de aventuras y desafíos físicos. Su energía y entusiasmo son contagiosos, y anima a los demás a mantenerse en forma y activos. Rod es conocido por su amor por el deporte y el ejercicio, y a menudo se le encuentra corriendo por el pueblo o haciendo pesas. A pesar de su naturaleza competitiva, es amigable y se preocupa profundamente por sus amigos. Su catchphrase es '¡Ratón de hierro!', reflejando su determinación. Rod celebra su cumpleaños el 14 de agosto.",
+    imageUrl: "https://dodo.ac/np/images/e/ea/Rod_NH.png",
+    shortDescription: "Ratón deportista y competitivo, siempre en busca de desafíos atléticos.",
+    description: "Rod es un ratón jock en Animal Crossing, siempre en busca de aventuras y desafíos físicos. Su energía y entusiasmo son contagiosos, y anima a los demás a mantenerse en forma y activos. Rod es conocido por su amor por el deporte y el ejercicio, y a menudo se le encuentra corriendo por el pueblo o haciendo pesas. A pesar de su naturaleza competitiva, es amigable y se preocupa profundamente por sus amigos. Su catchphrase es '¡Ratón de hierro!', reflejando su determinación. Rod celebra su cumpleaños el 14 de agosto.",
+    imageUrl: "https://i.postimg.cc/mDfH3dgy/Rod-NH.png",
+    facts: {
+      zodiacSign: "Leo",
+      catchPhrase: "¡Sudor y gloria!",
+      birthDate: "14/08",
     },
-    "extraInfo": {
-      "imageSource": "https://chalkdustmagazine.com/features/mathematics-maryam-mirzakhani/"
-    }
   },
   {
-    "id": "adele-goldberg",
-    "name": "Adele Goldberg",
-    "shortDescription": "Informática pionera, co-creadora del lenguaje de programación Smalltalk.",
-    "description": "Informática estadounidense reconocida por su influyente trabajo en la investigación y desarrollo de la programación orientada a objetos. Su contribución más destacada es la creación del lenguaje de programación Smalltalk, que revolucionó la forma en que se desarrollan software y sistemas informáticos. Goldberg ha sido una defensora incansable de la usabilidad y la accesibilidad en la informática, asegurando que las aplicaciones informáticas sean más amigables para los usuarios. Su trabajo ha allanado el camino para una programación más intuitiva y eficiente, y su legado perdura en la industria de la tecnología.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/adele-goldberg.jpg",
-    "facts": {
-      "yearOfBirth": "1945",
-      "birthPlace": "Chicago, Estados Unidos",
-      "mainField": "Ciencias de la Computación"
+    id: "breeMouse",
+    name: "Bree",
+    species: "Raton",
+    personality: "Altanera",
+    gender: "Femenino",
+    shortDescription: "Ratón amable y tranquilo, aficionado a la lectura y la cultura.",
+    description: "Bree es una ratón snooty que lleva un aire de elegancia y sofisticación en Animal Crossing. Tiene un gusto por el lujo y la moda, y a menudo se comporta con una actitud refinada. Aunque puede parecer distante al principio, Bree puede ser amigable una vez que la conoces mejor. Le gusta hablar sobre arte y cultura, y su casa está decorada con muebles elegantes. Su catchphrase es '¡Lujoso!', reflejando su amor por las cosas finas. Bree celebra su cumpleaños el 7 de julio.",
+    imageUrl: "https://dodo.ac/np/images/thumb/1/12/Bree_NH.png/398px-Bree_NH.png",
+    facts: {
+      zodiacSign: "Virgo",
+      catchPhrase: "¡Que interesante!",
+      birthDate: "07/07",
     },
-    "extraInfo": {
-      "imageSource": "https://pionerasinformaticas.ujaen.es/en/computer-women-pioneers/adele-goldberg-en"
-    }
   },
   {
-    "id": "barbara-liskov",
-    "name": "Barbara Liskov",
-    "shortDescription": "Científica de la computación, pionera en programación orientada a objetos.",
-    "description": "Pionera de la informática, es conocida por su trabajo en la programación y la arquitectura de sistemas distribuidos. Fue la primera mujer en obtener un doctorado en ciencias de la computación en el Instituto de Tecnología de Stanford y desarrolló el lenguaje de programación CLU, que estableció fundamentos para la programación orientada a objetos. Liskov ha dejado una marca indeleble en la industria de la tecnología al liderar avances en sistemas de almacenamiento y seguridad informática. Su enfoque en la fiabilidad y la robustez ha influido en el diseño de sistemas críticos en todo el mundo.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/barbara-liskov.jpg",
-    "facts": {
-      "yearOfBirth": "1939",
-      "birthPlace": "Los Angeles, Estados Unidos",
-      "mainField": "Ciencia de la Computación"
+    id: "claudiaTiger",
+    name: "Claudia",
+    species: "Tigre",
+    personality: "Altanera",
+    gender: "Femenino",
+    shortDescription: "Tigre deportista y competitivo, siempre en busca de desafíos atléticos.",
+    description: "Claudia es una tigre deportista con una actitud competitiva y enérgica en Animal Crossing. Siempre está lista para un desafío y se enorgullece de mantenerse en forma y activa. Claudia es apasionada por los deportes y disfruta de la compañía de otros habitantes que comparten su entusiasmo por el ejercicio. Aunque ella puede ser competitiva, también es amigable y leal con sus amigos. Su catchphrase es '¡A rugir!', reflejando su espíritu competitivo. Claudia celebra su cumpleaños el 22 de noviembre.",
+    imageUrl: "https://dodo.ac/np/images/thumb/d/d6/Claudia_NH.png/320px-Claudia_NH.png",
+    facts: {
+      zodiacSign: "Capricornio",
+      catchPhrase: "¡A rugir!",
+      birthDate: "22/11",
     },
-    "extraInfo": {
-      "imageSource": "https://medium.com/a-computer-of-ones-own/barbara-liskov-inventor-of-abstract-data-types-9f8908fdcf86"
-    }
   },
   {
-    "id": "grace-hopper",
-    "name": "Grace Hopper",
-    "shortDescription": "Científica de la computación, creadora del primer compilador.",
-    "description": "Una de las pioneras de la informática, es famosa por su contribución al desarrollo del primer compilador y al lenguaje de programación COBOL. Además, desafió los estereotipos de género en la década de 1940 al unirse a la Marina de los Estados Unidos y convertirse en la primera programadora de la computadora Harvard Mark I. Su legado abarca la creación de conceptos cruciales como la \"depuración de software\" y su influencia en el desarrollo de la informática moderna, estableciendo estándares para la programación de alto nivel y la innovación tecnológica.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/grace-hopper.jpg",
-    "facts": {
-      "yearOfBirth": "1906",
-      "yearOfDeath": "1992",
-      "birthPlace": "Nueva York, Estados Unidos",
-      "mainField": "Ciencia de la Computación"
+    id: "leonardoTiger",
+    name: "Leo",
+    species: "Tigre",
+    personality: "Deportista",
+    gender: "Masculino",
+    shortDescription: "Tigre deportista y enérgico, siempre listo para una competencia.",
+    description: "Leonardo es un tigre jock apasionado por el fitness y el entrenamiento físico en Animal Crossing. Siempre está en busca de la siguiente rutina de ejercicios y disfruta de competencias de levantamiento de pesas. Leonardo es un firme creyente en mantener un cuerpo sano, una mente sana, y a menudo da consejos de salud y bienestar a los habitantes del pueblo. A pesar de su enfoque en el fitness, es amigable y se preocupa por el bienestar de los demás. Su catchphrase es '¡No pain, no gain!', reflejando su dedicación al ejercicio. Leonardo celebra su cumpleaños el 26 de mayo.",
+    imageUrl: "https://dodo.ac/np/images/thumb/0/0a/Leonardo_NH.png/800px-Leonardo_NH.png",
+    facts: {
+      zodiacSign: "Leo",
+      catchPhrase: "¡Rugido victorioso!",
+      birthDate: "26/05",
     },
-    "extraInfo": {
-      "imageSource": "https://photos.com/featured/grace-hopper-with-early-computer-bettmann.html"
-    }
   },
   {
-    "id": "margaret-hamilton",
-    "name": "Margaret Hamilton",
-    "shortDescription": "Científica de la computación, lideró desarrollo de software para Apollo 11.",
-    "description": "Destacada científica de la computación que desempeñó un papel fundamental en el programa Apollo de la NASA. Fue directora de la División de Ingeniería de Software en el Laboratorio de Instrumentación del MIT, donde desarrolló el concepto de \"ingeniería de software\". Su liderazgo en el desarrollo del software de vuelo para las misiones Apollo fue fundamental para el éxito de la llegada del hombre a la Luna. Hamilton es un ejemplo de cómo la tecnología y la ciencia pueden alcanzar logros extraordinarios cuando se combinan con un enfoque innovador y una visión audaz.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/margaret-hamilton.jpg",
-    "facts": {
-      "yearOfBirth": "1936",
-      "birthPlace": "Paoli, Indiana, Estados Unidos",
-      "mainField": "Ciencia de la Computación"
+    id: "rolf_tiger",
+    name: "Rolf",
+    species: "Tigre",
+    personality: "Gruñon",
+    gender: "Masculino",
+    shortDescription: "Tigre gruñón y fuerte, siempre busca ser el más fuerte del pueblo.",
+    description: "Rolf es un tigre gruñón y fuerte que siempre busca ser el más fuerte del pueblo en Animal Crossing. A pesar de su apariencia intimidante, tiene un buen corazón y a menudo se preocupa por los demás habitantes. Rolf se dedica a entrenar constantemente para mantener su fuerza y resistencia, y disfruta de competir en desafíos de fuerza con otros. A veces puede ser serio, pero su determinación es admirable. Si necesitas consejos sobre cómo mantenerte en forma, Rolf es el tigre al que debes acudir. ¡Celebra su cumpleaños el 22 de agosto!",
+    imageUrl: "https://dodo.ac/np/images/thumb/9/93/Rolf_NH.png/150px-Rolf_NH.png",
+    facts: {
+      zodiacSign: "Leo",
+      catchPhrase: "¡Grrrr!",
+      birthDate: "22/08",
     },
-    "extraInfo": {
-      "imageSource": "https://odetta.ai/blogs/margaret-hamilton-the-first-software-engineer"
-    }
   },
   {
-    "id": "radia-perlman",
-    "name": "Radia Perlman",
-    "shortDescription": "Ingeniera de redes, inventora del algoritmo Spanning Tree.",
-    "description": "Científica de la computación estadounidense, ha dejado una marca indeleble en el mundo de las redes informáticas y la seguridad. Conocida como \"la madre de Internet\", su invención del algoritmo Spanning Tree Protocol (STP) revolucionó la conectividad de redes y sentó las bases para la infraestructura de Internet moderna. A pesar de operar en un campo dominado por hombres, Perlman ha demostrado que las mujeres pueden liderar avances tecnológicos vitales. Su compromiso con la resiliencia de las redes y la ciberseguridad ha influido en la estabilidad y confiabilidad de la comunicación en línea.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/radia-perlman.jpg",
-    "facts": {
-      "yearOfBirth": "1951",
-      "birthPlace": "Portsmouth, Estados Unidos",
-      "mainField": "Ciencia de la Computación"
+    id: "wol02",
+    name: "Wolfi",
+    species: "Lobo",
+    personality: "Gruñon",
+    gender: "Masculino",
+    imageUrl: "https://static.wikia.nocookie.net/animalcrossing/images/a/aa/Wolfgang_NH.png",
+    shortDescription: "Wolfgang es un aldeano lobo gruñon en la serie Animal Crossing que aparece en todos los juegos hasta la fecha.",
+    description: "Wolfi tiene la personalidad gruñona, Por lo general parecerá estar agitado y de mal humor y es más difícil hacerse amigo de él que otros tipos de vecinos. Cuando habla con el Jugador, tiende a enojarse si el jugador no está de acuerdo con él o se niega a hacerle un favor. Al igual que todos los vecinos gruñones, Wolfi tiene una edad avanzada e invertirá su tiempo en su hobby, con frecuencia desafiará al jugador a varias competiciones. Él se entenderá fácilmente con vecinos atléticos, presumidas y otros vecinos gruñones, y en ocasiones también con vecinos perezosos y normales.",
+    facts: {
+      zodiacSign: "Sagitario",
+      birthDate: "25/11",
+      catchPhrase: "grauuuh!",
     },
-    "extraInfo": {
-      "imageSource": "https://hackaday.com/2018/05/29/spanning-the-tree-dr-radia-perlman-untangling-networks/"
-    }
   },
   {
-    "id": "shafi-goldwasser",
-    "name": "Shafi Goldwasser",
-    "shortDescription": "Científica de la computación, ganadora del Premio Turing.",
-    "description": "Es una destacada criptógrafa y científica de la computación que ha contribuido significativamente a la teoría de la computación y la seguridad de la información. Su trabajo en criptografía de probabilidad y complejidad computacional ha sentado las bases para la seguridad en línea y la privacidad de datos en un mundo cada vez más digitalizado. Goldwasser es un ejemplo de cómo la ciencia de la computación puede abordar desafíos contemporáneos y proteger la información en la era de la información.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/shafi-goldwasser.jpg",
-    "facts": {
-      "yearOfBirth": "1958",
-      "birthPlace": "Nueva York, Estados Unidos",
-      "mainField": "Ciencia de la Computación"
+    id: "der11",
+    name: "Yuki",
+    species: "Ciervo",
+    personality: "Vivaracha",
+    gender: "Femenino",
+    imageUrl: "https://dodo.ac/np/images/2/26/Shino_amiibo.png",
+    shortDescription: "Yuki es una aldeana ciervo animada en la serie Animal Crossing",
+    description: "Yuki en una cierva de color blanco amarillento con un hocico de color blanco y pesuñas de color dorado. Yuki tiene unos ojos alargados de color amarillo con una sombra de ojos de color rojo del estilo Hikimayu, además de unos pequeños colmillos que sobresalen de su boca y podrían indicar que pertenece a la especie del ciervo de copete. El diseño de Shino parece estar inspirado por máscaras del teatro Noh japonés, más concretamente a la mascara de los Hannya, demonios de mujeres consumidas por los celos.",
+    facts: {
+      zodiacSign: "Libra",
+      birthDate: "31/10",
+      catchPhrase: "oni",
     },
-    "extraInfo": {
-      "imageSource": "https://www.jahresbericht2019.unibe.ch/successes_2019/einstein_lectures/index_eng.html"
-    }
   },
   {
-    "id": "chien-shiung-wu",
-    "name": "Chien-Shiung Wu",
-    "shortDescription": "Física experimental, contribuyó a la física nuclear.",
-    "description": "Física experimental de origen chino, desafiando los prejuicios de género y nacionalidad, realizó experimentos fundamentales en física de partículas y contribuyó significativamente a la comprensión de la desintegración beta. Su famoso experimento \"Wu\" refutó la paridad en la física de partículas, lo que cambió la forma en que los científicos comprenden las fuerzas fundamentales de la naturaleza. Wu demostró que el talento y la perseverancia pueden superar cualquier barrera, y su legado sigue siendo un faro de inspiración para científicas en todo el mundo.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/chien-shiung-wu.jpg",
-    "facts": {
-      "yearOfBirth": "1912",
-      "yearOfDeath": "1997",
-      "birthPlace": "Liuhe, Taicang, China",
-      "mainField": "Física"
+    id: "duk16",
+    name: "Deira",
+    species: "Pato",
+    personality: "Dulce",
+    gender: "Femenino",
+    imageUrl: "https://dodo.ac/np/images/thumb/2/29/Molly_NH.png/150px-Molly_NH.png",
+    shortDescription: "Deira es una aldeana pato normal en la serie Animal Crossing",
+    description: "Deira, al ser de personalidad normal, será tímida y cariñosa con el jugador y los vecinos. Al igual que otras vecinas de la misma personalidad, será obsesiva con la limpieza e higiene. Se llevará bien con vecinos de personalidad esnob, perezosa e incluso también con vecinos de su misma personalidad. Puede llevarse mal con vecinos de personalidad gruñona debido a su naturaleza grosera y arrogante. Por lo general, hablará de otros vecinos en lugar de hablar sobre ella misma y sus problemas. También parece disfrutar de la cocina y con frecuencia le preguntará al jugador sobre comida.",
+    facts: {
+      zodiacSign: "Piscis",
+      birthDate: "07/03",
+      catchPhrase: "deverdá",
     },
-    "extraInfo": {
-      "imageSource": "https://www.thoughtco.com/chien-shiung-wu-biography-3530366"
-    }
   },
   {
-    "id": "hedy-lamarr",
-    "name": "Hedy Lamarr",
-    "shortDescription": "Actriz e inventora, contribuyó al desarrollo de la tecnología de espectro ensanchado.",
-    "description": "Actriz austroamericana y científica, fue una mente brillante en la intersección de la tecnología y el entretenimiento. Junto con el compositor George Antheil, inventó un sistema de comunicación secreta durante la Segunda Guerra Mundial que sentó las bases para la tecnología de espectro ensanchado y la comunicación inalámbrica moderna. Lamarr demostró que las mujeres pueden destacar tanto en el cine como en la ciencia, y su legado como inventora ha sido fundamental para el desarrollo de la tecnología de comunicación inalámbrica que usamos en la actualidad.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/hedy-lamarr.jpg",
-    "facts": {
-      "yearOfBirth": "1914",
-      "yearOfDeath": "2000",
-      "birthPlace": "Viena, Austria",
-      "mainField": "Actuación, Física"
+    id: "squ21",
+    name: "Auri",
+    species: "Ardilla",
+    personality: "Dulce",
+    gender: "Femenino",
+    imageUrl: "https://dodo.ac/np/images/4/40/Ione_amiibo.png",
+    shortDescription: "Auri es una aldeana ardilla normal en la serie Animal Crossing",
+    description: "Auri tiene personalidad normal, por lo que actuará con timidez al principio, pero se preocupará por el Jugador. Tendrá preocupaciones de higiene, representadas cuando el jugador visite su casa, y expresará su vergüenza por la apariencia supuestamente sucia de su hogar. Por otra parte, Ella disfrutará de los pasatiempos comunes, tales como la pesca y atrapar bichos, generalmente para mantenerse activa. Mencionará su interés por la lectura y los diversos libros que lee. Ella también disfrutará escribiendo y recibiendo cartas.",
+    facts: {
+      zodiacSign: "Virgo",
+      birthDate: "11/09",
+      catchPhrase: "blinguiblín",
     },
-    "extraInfo": {
-      "imageSource": "https://www.sparkfun.com/news/6147"
-    }
   },
   {
-    "id": "maria-goeppert-mayer",
-    "name": "Maria Goeppert Mayer",
-    "shortDescription": "Física teórica, ganadora del Premio Nobel de Física.",
-    "description": "Física teórica alemana-estadounidense, dejó una profunda huella en la física nuclear y la mecánica cuántica. Fue la segunda mujer en recibir el Premio Nobel de Física y su trabajo pionero en la estructura de capas nucleares revolucionó nuestra comprensión de los núcleos atómicos. A pesar de las barreras de género en la academia, su dedicación y talento la llevaron a contribuir significativamente a la teoría nuclear, abriendo el camino para futuras investigadoras en un campo dominado por hombres. Maria Goeppert Mayer es un ejemplo inspirador de excelencia científica y perseverancia en la búsqueda del conocimiento.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/maria-goeppert-mayer.jpg",
-    "facts": {
-      "yearOfBirth": "1906",
-      "yearOfDeath": "1972",
-      "birthPlace": "Kattowitz, Alemania",
-      "mainField": "Física"
+    id: "der00",
+    name: "Fauna",
+    species: "Ciervo",
+    personality: "Dulce",
+    gender: "Femenino",
+    imageUrl: "https://dodo.ac/np/images/thumb/9/91/Fauna_NH.png/150px-Fauna_NH.png",
+    shortDescription: "Fauna es una aldeana ciervo normal en la serie Animal Crossing",
+    description: "Fauna tiene personalidad normal, por lo que tendrá un carácter amable, cariñoso y tranquilo. Fauna disfruta de los pasatiempos comunes, tales como la pesca y atrapar bichos, generalmente para mantenerse activa. Fauna frecuentemente invitará al Jugador a su casa, donde denotará sus preocupaciones por la higiene y la limpieza. Fauna se sentirá decepcionada u ofendida fácilmente por otros vecinos, en particular con los vecinos vagos que se despistan fácilmente en sus conversaciones y los vecinos picajosos que tienen una naturaleza grosera e irritable.",
+    facts: {
+      zodiacSign: "Aries",
+      birthDate: "26/03",
+      catchPhrase: "puchu",
     },
-    "extraInfo": {
-      "imageSource": "https://www.wsemexhibit.org/maria-goeppert-mayer.html"
-    }
   },
   {
-    "id": "lise-meitner",
-    "name": "Lise Meitner",
-    "shortDescription": "Física nuclear, contribuyó a la teoría de la fisión nuclear.",
-    "description": "Física austriaca-sueca, dejó un legado imborrable en la física nuclear y la radioquímica. A pesar de enfrentar obstáculos de género en una era dominada por hombres, colaboró con Otto Hahn en el descubrimiento de la fisión nuclear, un avance revolucionario. Aunque no compartió el Premio Nobel por este logro, su contribución fue crucial para comprender la energía nuclear y la física de partículas. Su determinación y pasión por la ciencia han inspirado a generaciones de científicas. Lise Meitner es un símbolo perdurable de la perseverancia femenina y el impacto duradero que las mujeres pueden tener en la ciencia.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/lise-meitner.jpg",
-    "facts": {
-      "yearOfBirth": "1878",
-      "yearOfDeath": "1968",
-      "birthPlace": "Viena, Austria",
-      "mainField": "Física"
+    id: "cat23",
+    name: "Narciso",
+    species: "Gato",
+    personality: "Esnob",
+    gender: "Masculino",
+    imageUrl: "https://dodo.ac/np/images/2/2a/Raymond_NH.png",
+    shortDescription: "Narciso es un aldeano gato Esnob en la serie Animal Crossing",
+    description: "Narciso es un gato con pelaje de color gris con un mechón de pelo rubio en la frente y puntas de sus orejas, patas y cola son de color negro. Narciso tiene heterocromía, por lo que sus ojos son de colores diferentes, su ojo izquierdo es de color verde mientras que su ojo derecho es de color marrón, tiene una boca triangular de la cual sobresalen un par de colmillos que solo pueden verse cuando abre la boca. Lleva un par de gafas de pasta gruesa de color negro.",
+    facts: {
+      zodiacSign: "Libra",
+      birthDate: "01/10",
+      catchPhrase: "atilda",
     },
-    "extraInfo": {
-      "imageSource": "https://www.bing.com/images/create/lise-meitner-in-nuclear-physics-lab-in-19502c-retro/651196e6bbcb4009950e9955c2199760"
-    }
   },
   {
-    "id": "sau-lan-wu",
-    "name": "Sau Lan Wu",
-    "shortDescription": "Física de partículas, contribuyó a experimentos clave en física de alta energía.",
-    "description": "Física experimental sinoamericana, ha sido una fuerza motriz en la física de partículas. Destacó en experimentos en el CERN y lideró investigaciones cruciales, como el descubrimiento del quark c, que expandieron nuestro entendimiento de la estructura fundamental de la materia. Wu superó desafíos en una disciplina dominada por hombres y ha sido un faro de inspiración para científicas de todo el mundo. Sau Lan Wu es un ejemplo de excelencia científica y de cómo las mujeres pueden dejar huella en la investigación de vanguardia.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/sau-lan-wu.jpg",
-    "facts": {
-      "yearOfBirth": "1940",
-      "birthPlace": "Hong Kong, China",
-      "mainField": "Física de Partículas"
+    id: "squ17",
+    name: "Munchi",
+    species: "Ardilla",
+    personality: "Esnob",
+    gender: "Masculino",
+    imageUrl: "https://i.postimg.cc/cH0J4PJ2/150px-Marshal-NH.png",
+    shortDescription: "Munchi es un aldeano ardilla Esnob en la serie Animal Crossing",
+    description: "Es una ardilla blanca con un fleco entrecortado de color bronce. También tiene marcas rosadas en sus mejillas y un color de lavanda en el dentro del oído. Sus patas y los remolinos a cada lado de su cola también son de color bronce. Los ojos de Munchi son negros y arqueados con un ojo lateral fijo, y su boca está vuelta hacia abajo. Esto lo hace parecer molesto, lo que hace que muchos lo confundan con un vecino gruñón. El sonrojo también lo hace ver femenino, lo que significa que a menudo también se lo confunde con un vecina.",
+    facts: {
+      zodiacSign: "Libra",
+      birthDate: "29/09",
+      catchPhrase: "tecúen",
     },
-    "extraInfo": {
-      "imageSource": "https://repository.aip.org/islandora/object/nbla%3A315195"
-    }
   },
   {
-    "id": "jocelyn-bell-burnell",
-    "name": "Jocelyn Bell Burnell",
-    "shortDescription": "Astrónoma y astrofísica, co-descubridora de los púlsares.",
-    "description": "Astrofísica británica, es una figura extraordinaria en la ciencia. Durante su doctorado, hizo un descubrimiento revolucionario al detectar los primeros púlsares, estrellas de neutrones altamente magnetizadas que emiten pulsos regulares de radiación. A pesar de que su asesor recibió el Premio Nobel por este descubrimiento, Bell Burnell se ha convertido en un símbolo de perseverancia y contribución de las mujeres a la astronomía. Su carrera distinguida y su activismo en favor de la diversidad de género en la ciencia han inspirado a generaciones futuras de científicas. Jocelyn Bell Burnell es un ejemplo de valentía y excelencia científica.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/jocelyn-bell-burnell.jpg",
-    "facts": {
-      "yearOfBirth": "1943",
-      "birthPlace": "Belfast, Reino Unido",
-      "mainField": "Astronomía, Astrofísica"
+    id: "goa09",
+    name: "Morfeo",
+    species: "Cabra",
+    personality: "Perezoso",
+    gender: "Masculino",
+    imageUrl: "https://dodo.ac/np/images/thumb/1/18/Sherb_NH.png/150px-Sherb_NH.png",
+    shortDescription: "Morfeo es un aldeano cabra perezoso en la serie Animal Crossing",
+    description: "Morfeo tiene la personalidad vaga, por lo que será amigable y fácil de tratar debido a su estilo de vida relajado. Como a todos los vecinos vagos, a Morfeo le encanta comer y el descansar, disfrutará de participar en sus pasatiempos comunes, que generalmente tienen que ver con relajarse o comer, como la pesca. Morfeo se llevará bien con los otros vecinos, pero puede ofender o confundir a los vecinos deportistas, que tienen un estilo de vida de lleno de ejercicio y de buen estado físico, en comparación con el estilo de vida perezoso de Morfeo.",
+    facts: {
+      zodiacSign: "Capricornio",
+      birthDate: "18/01",
+      catchPhrase: "bostezzz",
     },
-    "extraInfo": {
-      "imageSource": "https://womeninscienceweadmire.icfo.eu/wiswa-2/jocelyn-bell/"
-    }
   },
   {
-    "id": "dorothy-crowfoot-hodgkin",
-    "name": "Dorothy Crowfoot Hodgkin",
-    "shortDescription": "Química, ganadora del Premio Nobel de Química.",
-    "description": "Química británica, es una figura icónica en la ciencia que superó las barreras de género de su época. Su trabajo revolucionario en la cristalografía de rayos X permitió determinar la estructura de importantes biomoléculas, como la penicilina, la vitamina B12 y la insulina. Fue galardonada con el Premio Nobel de Química en 1964, siendo la tercera mujer en recibir este prestigioso reconocimiento. Hodgkin no solo fue una científica excepcional, sino también una defensora de la igualdad de género en la ciencia, allanando el camino para futuras generaciones de científicas y dejando un legado duradero en la investigación y la equidad.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/dorothy-crowfoot-hodgkin.jpg",
-    "facts": {
-      "yearOfBirth": "1910",
-      "yearOfDeath": "1994",
-      "birthPlace": "El Cairo, Egipto / Shipston-on-Stour, Reino Unido",
-      "mainField": "Química"
+    id: "cbr05",
+    name: "Parches",
+    species: "Oso",
+    personality: "Perezoso",
+    gender: "Masculino",
+    imageUrl: "https://dodo.ac/np/images/thumb/5/56/Stitches_NH.png/150px-Stitches_NH.png",
+    shortDescription: "Parches es un aldeano oso Peresozo en la serie Animal Crossing.",
+    description: "Parches tiene la personalidad perezosa, por lo que será amigable y de trato fácil debido a su estilo de vida relajado. Como a todos los vecinos perezosos, a Parches le encanta la comida y el descanso. Parches disfrutará de participar en los pasatiempos comunes, generalmente por razones que involucran relajarse o comer, como la pesca. Parches se llevará bien con los otros vecinos, pero puede ofender o confundir a los vecinos atléticos, que tienen un estilo de vida de ejercicio y de buen estado físico, en comparación con el estilo de vida perezoso de Parches.",
+    facts: {
+      zodiacSign: "Acuario",
+      birthDate: "10/02",
+      catchPhrase: "paguahhh",
     },
-    "extraInfo": {
-      "imageSource": "https://www.some.ox.ac.uk/news/jan-royall-why-we-must-champion-dorothy-hodgkin-for-the-50-note/"
-    }
   },
   {
-    "id": "marie-curie",
-    "name": "Marie Curie",
-    "shortDescription": "Física y química, ganadora de dos Premios Nobel.",
-    "description": "física y química de origen polaco y nacionalizada francesa, es una de las figuras más icónicas en la historia de la ciencia. Ganadora de dos premios Nobel (Física en 1903 y Química en 1911), Curie realizó investigaciones fundamentales sobre la radiactividad y el descubrimiento de los elementos radio y polonio. Su dedicación y valentía en la investigación científica, a pesar de los desafíos de la discriminación de género y los riesgos de la radiación, la convierten en un modelo a seguir para científicas de todo el mundo.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/marie-curie.jpg",
-    "facts": {
-      "yearOfBirth": "1867",
-      "yearOfDeath": "1934",
-      "birthPlace": "Varsovia, Polonia",
-      "mainField": "Física y Química"
+    id: "pbr00",
+    name: "Apolo",
+    species: "Águila",
+    personality: "Gruñon",
+    gender: "Masculino",
+    imageUrl: "https://dodo.ac/np/images/thumb/0/0e/Apollo_NH_Transparent.png/150px-Apollo_NH_Transparent.png",
+    shortDescription: "Apolo tiene la personalidad gruñona, por lo general él parecerá estar agitado y de mal humor.",
+    description: "Apolo es un águila calva con un cuerpo de color gris oscuro y una cabeza de color blanca, un aspecto típico de la águila calva, tiene un pico y pies de color amarillo con garras blancas al final de ellos. Las alas de Apolo se degradan lentamente en un color blanco y sus ojos son semicírculos blancos bordados con un contorno negro y pupilas totalmente negras. En Animal Crossing: Población: ¡en aumento! hasta New Leaf su atuendo inicial un jersey cremallera, pero a partir de New Horizons usa una chaqueta de aviación negra.",
+    facts: {
+      zodiacSign: "Cancer",
+      birthDate: "04/07",
+      catchPhrase: "rapahhh",
     },
-    "extraInfo": {
-      "imageSource": "https://www.historyextra.com/period/first-world-war/life-of-the-week-marie-curie/"
-    }
   },
   {
-    "id": "marjory-stephenson",
-    "name": "Marjory Stephenson",
-    "shortDescription": "Microbióloga y bioquímica, investigó en enzimología.",
-    "description": "Bioquímica británica, brilló como científica en una época en la que las mujeres enfrentaban obstáculos muy significativos en la investigación científica. Su trabajo pionero en microbiología, enzimología y bioquímica contribuyó al entendimiento de procesos fundamentales en la vida. Fue una de las primeras mujeres en ser elegida miembro de la Royal Society, un reconocimiento a su destacada contribución a la ciencia. Además, fue una mentora y defensora de las mujeres en la ciencia, inspirando y allanando el camino para futuras generaciones.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/marjory-stephenson.jpg",
-    "facts": {
-      "yearOfBirth": "1885",
-      "yearOfDeath": "1948",
-      "birthPlace": "Londres, Reino Unido",
-      "mainField": "Química, Microbiología, Bioquímica"
+    id: "dog14",
+    name: "Pit",
+    species: "Perro",
+    personality: "Deportista",
+    gender: "Masculino",
+    imageUrl: "https://dodo.ac/np/images/thumb/a/ab/Mac_NH.png/150px-Mac_NH.png",
+    shortDescription: "Pit es un aldeano perro atlético en la serie Animal Crossing",
+    description: "Tiene la personalidad deportista, por lo que tendrá un gran interés en la aptitud física y los deportes. Esto lo hará parecer muy competitivo y desafiante, Pit tendrá una actitud hiperactiva y motivada, pero a menudo actuará de forma egoísta y pesada, pero a pesar de esto, sera amigable y amable con el Jugador. Como todo vecino deportista, Pit está muy interesado en su hobby, y puede competir contra el jugador por atrapar Bichos o Peces, Pit se lleva bien con los vecinos esnobs, alegres y dulces, pero tendrá problemas con el estilo de vida relajado de los vecinos perezosos.",
+    facts: {
+      zodiacSign: "Escorpio",
+      birthDate: "11/11",
+      catchPhrase: "frusky",
     },
-    "extraInfo": {
-      "imageSource": "https://microbiologysociety.org/grants-prizes/all-prizes-and-competitions-/prize-lectures/marjory-stephenson-prize-lecture/marjory-stephenson-a-short-history.html"
-    }
   },
   {
-    "id": "rosalind-franklin",
-    "name": "Rosalind Franklin",
-    "shortDescription": "Química y cristalógrafa, contribuyó a la comprensión de la estructura del ADN.",
-    "description": "Química y cristalógrafa británica, destacó en un campo dominado por hombres y su contribución a la ciencia es innegable. Sus investigaciones pioneras en la cristalografía de rayos X fueron fundamentales para revelar la estructura del ADN en forma de doble hélice, un hito crucial en la biología molecular. A pesar de que su trabajo inicial fue subestimado, su determinación y habilidad científica allanaron el camino para futuros avances en genética y biología. Franklin es un ejemplo inspirador de cómo las mujeres pueden sobresalir en la ciencia, dejando un legado duradero en la investigación y la igualdad de género.",
-    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/rosalind-franklin.jpg",
-    "facts": {
-      "yearOfBirth": "1920",
-      "yearOfDeath": "1958",
-      "birthPlace": "Londres, Reino Unido",
-      "mainField": "Química, Cristalografía"
+    id: "hrs04",
+    name: "Jereza",
+    species: "Caballo",
+    personality: "Gruñon",
+    gender: "Masculino",
+    imageUrl: "https://dodo.ac/np/images/thumb/8/8e/Roscoe_NH.png/150px-Roscoe_NH.png",
+    shortDescription: "Jereza es un aldeano caballo gruñon en la serie Animal Crossing.",
+    description: "Tiene la personalidad picajosa y por lo general parecerá estar agitado y de mal humor y es más difícil hacerse amigo de él que otros tipos de vecinos. Cuando habla con el Jugador, tiende a enojarse si el jugador no está de acuerdo con él o se niega a hacerle un favor. Al igual que todos los vecinos picajosos, Jereza tiene una edad avanzada e invertirá su tiempo en su hobby, con frecuencia desafiará al jugador a varias competiciones. Él se entenderá fácilmente con vecinos deportistas, altaneras y otros vecinos picajosos, y en ocasiones también con vecinos vagos y dulces.",
+    facts: {
+      zodiacSign: "Geminis",
+      birthDate: "16/06",
+      catchPhrase: "Ñiii",
     },
-    "extraInfo": {
-      "imageSource": ""
-    }
-  }
+  },
 ];
\ No newline at end of file
diff --git a/src/data/datasetGame.js b/src/data/datasetGame.js
new file mode 100644
index 00000000..c97c29c7
--- /dev/null
+++ b/src/data/datasetGame.js
@@ -0,0 +1,380 @@
+
+/*export default [
+  {
+    "id": "ada-lovelace",
+    "name": "Ada Lovelace",
+    "shortDescription": "Pionera en la programación, primera programadora de la historia.",
+    "description": "Una visionaria matemática británica del siglo XIX, es aclamada como la primera programadora de la historia. Su colaboración con Charles Babbage en la creación de la Máquina Analítica la llevó a desarrollar algoritmos, incluyendo el famoso \"algoritmo de Bernoulli\", destinados a ser procesados por una máquina. Su visión pionera la convirtió en una figura fundamental en la informática y la inteligencia artificial. Lovelace demostró que las computadoras podían ir más allá de simples cálculos matemáticos, anticipando un mundo donde la programación sería esencial en la resolución de problemas complejos, dejando una huella imborrable en la ciencia y la tecnología.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/ada-lovelace.jpg",
+    "facts": {
+      "yearOfBirth": "1815",
+      "yearOfDeath": "1852",
+      "birthPlace": "Londres, Reino Unido",
+      "mainField": "Ciencia de la Computación"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.bing.com/images/create/genera-una-imagen-de-ada-lovelace2c-la-primera-prog/650a1eff8ff04b88833d5cdef0309441"
+    }
+  },
+  {
+    "id": "emmy-noether",
+    "name": "Emmy Noether",
+    "shortDescription": "Matemática destacada, teorema fundamental en álgebra abstracta.",
+    "description": "Una brillante matemática alemana, revolucionó la física teórica con sus contribuciones al teorema de conservación de la energía y el teorema de Noether, fundamentales en la teoría de la relatividad y la mecánica cuántica. A pesar de los obstáculos que enfrentó como mujer en la academia, sus investigaciones en álgebra abstracta y teoría de grupos son fundamentales en la física moderna. Su capacidad para unificar conceptos matemáticos y físicos marcó un hito en la historia de la ciencia, allanando el camino para futuras generaciones de científicas.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/emmy-noether.jpg",
+    "facts": {
+      "yearOfBirth": "1882",
+      "yearOfDeath": "1935",
+      "birthPlace": "Erlangen, Alemania",
+      "mainField": "Matemáticas"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.bing.com/images/create/create-an-image-of-of-a-german-woman2c-a-pioneering/6510ddb1e8254b928b8f8f1d5e95fea4"
+    }
+  },
+  {
+    "id": "hypatia-de-alejandria",
+    "name": "Hypatia de Alejandría",
+    "shortDescription": "Matemática y filósofa en la antigua Alejandría.",
+    "description": "Filósofa y matemática en la antigua Alejandría, desafió las normas de género de su época al destacar en una sociedad dominada por hombres. Su legado incluye importantes contribuciones a la geometría y la astronomía, así como su destacado papel como maestra y defensora del conocimiento en una época de agitación política. Hypatia demostró que las mujeres podían sobresalir en campos intelectuales y su valentía al mantener sus creencias filosóficas la convierte en un símbolo de resistencia y sabiduría en la historia de la ciencia.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/hypatia-de-alejandria.jpg",
+    "facts": {
+      "yearOfBirth": "circa 360",
+      "yearOfDeath": "415",
+      "birthPlace": "Alejandría, Egipto",
+      "mainField": "Matemáticas, Filosofía"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.bing.com/images/create/create-a-vivid-digital-artwork-or-painting-that-de/6510df0ebe1a4807af22175452761e1a"
+    }
+  },
+  {
+    "id": "marjorie-lee-browne",
+    "name": "Marjorie Lee Browne",
+    "shortDescription": "Matemática, contribuyó a la teoría de números.",
+    "description": "Matemática estadounidense, destacó en una época en la que las mujeres afroamericanas enfrentaban múltiples barreras en la educación superior. No solo obtuvo su doctorado en matemáticas, sino que también se convirtió en una destacada educadora, promoviendo la diversidad en las ciencias matemáticas y desafiando la discriminación racial y de género. Su compromiso con la educación y su capacidad para inspirar a futuras generaciones la convierten en un modelo a seguir para las mujeres en la ciencia, dejando una huella perdurable en la historia académica.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/marjorie-lee-browne.jpg",
+    "facts": {
+      "yearOfBirth": "1914",
+      "yearOfDeath": "1979",
+      "birthPlace": "Memphis, Estados Unidos",
+      "mainField": "Matemáticas"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.bing.com/images/create/design-an-inspiring-and-historically-accurate-imag/6510df7e7bb745f69d67f695441607a8"
+    }
+  },
+  {
+    "id": "shakuntala-devi",
+    "name": "Shakuntala Devi",
+    "shortDescription": "Matemática prodigio, conocida como la 'Calculadora Humana'.",
+    "description": "Conocida como \"la bruja de las matemáticas\" de la India, dejó una marca indeleble en el mundo de los números. Su capacidad mental asombrosa la llevó a resolver complejos cálculos matemáticos mentalmente en cuestión de segundos, estableciendo récords mundiales. Además de su talento innato, Devi promovió activamente la educación matemática y luchó por la igualdad de género en un país donde las mujeres enfrentaban desafíos en la ciencia y la educación. Su legado destaca el poder de la mente humana y la importancia de la igualdad de oportunidades en la ciencia.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/shakuntala-devi.jpg",
+    "facts": {
+      "yearOfBirth": "1929",
+      "yearOfDeath": "2013",
+      "birthPlace": "Bangalore, India",
+      "mainField": "Matemáticas"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.bing.com/images/create/indian-woman-writing-math-problems-in-a-blackbard-/6510e19f3db54e14b365b7e8dc5045f6"
+    }
+  },
+  {
+    "id": "sofia-kovalevskaya",
+    "name": "Sofia Kovalevskaya",
+    "shortDescription": "Matemática y escritora, contribuyó a la teoría de funciones.",
+    "description": "Matemática rusa del siglo XIX, dejó una marca indeleble en la ciencia del siglo XIX al desafiar las barreras de género. Como matemática rusa, superó las restricciones sociales de su época para convertirse en la primera mujer en obtener un doctorado en matemáticas en Europa. Sus contribuciones a la teoría de las ecuaciones diferenciales y la mecánica revolucionaron la disciplina, abriendo nuevas perspectivas en el análisis matemático. Su destacada membresía en la Academia de Ciencias de Suecia marcó un hito en la historia de las mujeres en la ciencia.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/sofia-kovalevskaya.jpg",
+    "facts": {
+      "yearOfBirth": "1850",
+      "yearOfDeath": "1891",
+      "birthPlace": "Moscú, Rusia",
+      "mainField": "Matemáticas"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.bing.com/images/create/indian-woman-writing-math-problems-in-a-blackbard-/6510e19f3db54e14b365b7e8dc5045f6"
+    }
+  },
+  {
+    "id": "yoko-shimomura",
+    "name": "Yoko Shimomura",
+    "shortDescription": "Compositora de música, destacada en la industria de los videojuegos.",
+    "description": "Compositora japonesa, es una figura destacada en la ciencia de la música y el arte sonoro. Aunque no se dedica a la ciencia en el sentido tradicional, su trabajo en la composición musical ha requerido un profundo entendimiento de la teoría musical y la tecnología de audio. Ha contribuido de manera significativa a la industria de los videojuegos, componiendo icónicas bandas sonoras que han enriquecido la experiencia de juego. Su éxito en un campo donde las mujeres estaban subrepresentadas la convierte en un modelo a seguir, incluso en campos no convencionales como la composición musical.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/yoko-shimomura.jpg",
+    "facts": {
+      "yearOfBirth": "1967",
+      "birthPlace": "Hyogo, Japón",
+      "mainField": "Composición Musical, Video Juegos"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.bing.com/images/create/yoko-shimomura-making-music-for-a-video-game-in-19/6510e40dd1eb45d0906e8c1f4bb601d3"
+    }
+  },
+  {
+    "id": "maryam-mirzakhani",
+    "name": "Maryam Mirzakhani",
+    "shortDescription": "Matemática, ganadora del Premio Fields.",
+    "description": "Matemática iraní, hizo historia al convertirse en la primera mujer en ganar la Medalla Fields, el premio más prestigioso en matemáticas. Sus investigaciones en la geometría de superficies y la teoría de las superficies de Riemann han tenido un impacto duradero en la matemática pura. A lo largo de su carrera, Mirzakhani inspiró a muchas mujeres a perseguir carreras en ciencia y matemáticas, derribando las barreras de género. Su enfoque innovador y su capacidad para resolver problemas complejos la convierten en un modelo a seguir para la comunidad científica y en un símbolo de la excelencia matemática.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/maryam-mirzakhani.jpg",
+    "facts": {
+      "yearOfBirth": "1977",
+      "yearOfDeath": "2017",
+      "birthPlace": "Teherán, Irán",
+      "mainField": "Matemáticas"
+    },
+    "extraInfo": {
+      "imageSource": "https://chalkdustmagazine.com/features/mathematics-maryam-mirzakhani/"
+    }
+  },
+  {
+    "id": "adele-goldberg",
+    "name": "Adele Goldberg",
+    "shortDescription": "Informática pionera, co-creadora del lenguaje de programación Smalltalk.",
+    "description": "Informática estadounidense reconocida por su influyente trabajo en la investigación y desarrollo de la programación orientada a objetos. Su contribución más destacada es la creación del lenguaje de programación Smalltalk, que revolucionó la forma en que se desarrollan software y sistemas informáticos. Goldberg ha sido una defensora incansable de la usabilidad y la accesibilidad en la informática, asegurando que las aplicaciones informáticas sean más amigables para los usuarios. Su trabajo ha allanado el camino para una programación más intuitiva y eficiente, y su legado perdura en la industria de la tecnología.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/adele-goldberg.jpg",
+    "facts": {
+      "yearOfBirth": "1945",
+      "birthPlace": "Chicago, Estados Unidos",
+      "mainField": "Ciencias de la Computación"
+    },
+    "extraInfo": {
+      "imageSource": "https://pionerasinformaticas.ujaen.es/en/computer-women-pioneers/adele-goldberg-en"
+    }
+  },
+  {
+    "id": "barbara-liskov",
+    "name": "Barbara Liskov",
+    "shortDescription": "Científica de la computación, pionera en programación orientada a objetos.",
+    "description": "Pionera de la informática, es conocida por su trabajo en la programación y la arquitectura de sistemas distribuidos. Fue la primera mujer en obtener un doctorado en ciencias de la computación en el Instituto de Tecnología de Stanford y desarrolló el lenguaje de programación CLU, que estableció fundamentos para la programación orientada a objetos. Liskov ha dejado una marca indeleble en la industria de la tecnología al liderar avances en sistemas de almacenamiento y seguridad informática. Su enfoque en la fiabilidad y la robustez ha influido en el diseño de sistemas críticos en todo el mundo.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/barbara-liskov.jpg",
+    "facts": {
+      "yearOfBirth": "1939",
+      "birthPlace": "Los Angeles, Estados Unidos",
+      "mainField": "Ciencia de la Computación"
+    },
+    "extraInfo": {
+      "imageSource": "https://medium.com/a-computer-of-ones-own/barbara-liskov-inventor-of-abstract-data-types-9f8908fdcf86"
+    }
+  },
+  {
+    "id": "grace-hopper",
+    "name": "Grace Hopper",
+    "shortDescription": "Científica de la computación, creadora del primer compilador.",
+    "description": "Una de las pioneras de la informática, es famosa por su contribución al desarrollo del primer compilador y al lenguaje de programación COBOL. Además, desafió los estereotipos de género en la década de 1940 al unirse a la Marina de los Estados Unidos y convertirse en la primera programadora de la computadora Harvard Mark I. Su legado abarca la creación de conceptos cruciales como la \"depuración de software\" y su influencia en el desarrollo de la informática moderna, estableciendo estándares para la programación de alto nivel y la innovación tecnológica.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/grace-hopper.jpg",
+    "facts": {
+      "yearOfBirth": "1906",
+      "yearOfDeath": "1992",
+      "birthPlace": "Nueva York, Estados Unidos",
+      "mainField": "Ciencia de la Computación"
+    },
+    "extraInfo": {
+      "imageSource": "https://photos.com/featured/grace-hopper-with-early-computer-bettmann.html"
+    }
+  },
+  {
+    "id": "margaret-hamilton",
+    "name": "Margaret Hamilton",
+    "shortDescription": "Científica de la computación, lideró desarrollo de software para Apollo 11.",
+    "description": "Destacada científica de la computación que desempeñó un papel fundamental en el programa Apollo de la NASA. Fue directora de la División de Ingeniería de Software en el Laboratorio de Instrumentación del MIT, donde desarrolló el concepto de \"ingeniería de software\". Su liderazgo en el desarrollo del software de vuelo para las misiones Apollo fue fundamental para el éxito de la llegada del hombre a la Luna. Hamilton es un ejemplo de cómo la tecnología y la ciencia pueden alcanzar logros extraordinarios cuando se combinan con un enfoque innovador y una visión audaz.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/margaret-hamilton.jpg",
+    "facts": {
+      "yearOfBirth": "1936",
+      "birthPlace": "Paoli, Indiana, Estados Unidos",
+      "mainField": "Ciencia de la Computación"
+    },
+    "extraInfo": {
+      "imageSource": "https://odetta.ai/blogs/margaret-hamilton-the-first-software-engineer"
+    }
+  },
+  {
+    "id": "radia-perlman",
+    "name": "Radia Perlman",
+    "shortDescription": "Ingeniera de redes, inventora del algoritmo Spanning Tree.",
+    "description": "Científica de la computación estadounidense, ha dejado una marca indeleble en el mundo de las redes informáticas y la seguridad. Conocida como \"la madre de Internet\", su invención del algoritmo Spanning Tree Protocol (STP) revolucionó la conectividad de redes y sentó las bases para la infraestructura de Internet moderna. A pesar de operar en un campo dominado por hombres, Perlman ha demostrado que las mujeres pueden liderar avances tecnológicos vitales. Su compromiso con la resiliencia de las redes y la ciberseguridad ha influido en la estabilidad y confiabilidad de la comunicación en línea.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/radia-perlman.jpg",
+    "facts": {
+      "yearOfBirth": "1951",
+      "birthPlace": "Portsmouth, Estados Unidos",
+      "mainField": "Ciencia de la Computación"
+    },
+    "extraInfo": {
+      "imageSource": "https://hackaday.com/2018/05/29/spanning-the-tree-dr-radia-perlman-untangling-networks/"
+    }
+  },
+  {
+    "id": "shafi-goldwasser",
+    "name": "Shafi Goldwasser",
+    "shortDescription": "Científica de la computación, ganadora del Premio Turing.",
+    "description": "Es una destacada criptógrafa y científica de la computación que ha contribuido significativamente a la teoría de la computación y la seguridad de la información. Su trabajo en criptografía de probabilidad y complejidad computacional ha sentado las bases para la seguridad en línea y la privacidad de datos en un mundo cada vez más digitalizado. Goldwasser es un ejemplo de cómo la ciencia de la computación puede abordar desafíos contemporáneos y proteger la información en la era de la información.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/shafi-goldwasser.jpg",
+    "facts": {
+      "yearOfBirth": "1958",
+      "birthPlace": "Nueva York, Estados Unidos",
+      "mainField": "Ciencia de la Computación"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.jahresbericht2019.unibe.ch/successes_2019/einstein_lectures/index_eng.html"
+    }
+  },
+  {
+    "id": "chien-shiung-wu",
+    "name": "Chien-Shiung Wu",
+    "shortDescription": "Física experimental, contribuyó a la física nuclear.",
+    "description": "Física experimental de origen chino, desafiando los prejuicios de género y nacionalidad, realizó experimentos fundamentales en física de partículas y contribuyó significativamente a la comprensión de la desintegración beta. Su famoso experimento \"Wu\" refutó la paridad en la física de partículas, lo que cambió la forma en que los científicos comprenden las fuerzas fundamentales de la naturaleza. Wu demostró que el talento y la perseverancia pueden superar cualquier barrera, y su legado sigue siendo un faro de inspiración para científicas en todo el mundo.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/chien-shiung-wu.jpg",
+    "facts": {
+      "yearOfBirth": "1912",
+      "yearOfDeath": "1997",
+      "birthPlace": "Liuhe, Taicang, China",
+      "mainField": "Física"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.thoughtco.com/chien-shiung-wu-biography-3530366"
+    }
+  },
+  {
+    "id": "hedy-lamarr",
+    "name": "Hedy Lamarr",
+    "shortDescription": "Actriz e inventora, contribuyó al desarrollo de la tecnología de espectro ensanchado.",
+    "description": "Actriz austroamericana y científica, fue una mente brillante en la intersección de la tecnología y el entretenimiento. Junto con el compositor George Antheil, inventó un sistema de comunicación secreta durante la Segunda Guerra Mundial que sentó las bases para la tecnología de espectro ensanchado y la comunicación inalámbrica moderna. Lamarr demostró que las mujeres pueden destacar tanto en el cine como en la ciencia, y su legado como inventora ha sido fundamental para el desarrollo de la tecnología de comunicación inalámbrica que usamos en la actualidad.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/hedy-lamarr.jpg",
+    "facts": {
+      "yearOfBirth": "1914",
+      "yearOfDeath": "2000",
+      "birthPlace": "Viena, Austria",
+      "mainField": "Actuación, Física"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.sparkfun.com/news/6147"
+    }
+  },
+  {
+    "id": "maria-goeppert-mayer",
+    "name": "Maria Goeppert Mayer",
+    "shortDescription": "Física teórica, ganadora del Premio Nobel de Física.",
+    "description": "Física teórica alemana-estadounidense, dejó una profunda huella en la física nuclear y la mecánica cuántica. Fue la segunda mujer en recibir el Premio Nobel de Física y su trabajo pionero en la estructura de capas nucleares revolucionó nuestra comprensión de los núcleos atómicos. A pesar de las barreras de género en la academia, su dedicación y talento la llevaron a contribuir significativamente a la teoría nuclear, abriendo el camino para futuras investigadoras en un campo dominado por hombres. Maria Goeppert Mayer es un ejemplo inspirador de excelencia científica y perseverancia en la búsqueda del conocimiento.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/maria-goeppert-mayer.jpg",
+    "facts": {
+      "yearOfBirth": "1906",
+      "yearOfDeath": "1972",
+      "birthPlace": "Kattowitz, Alemania",
+      "mainField": "Física"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.wsemexhibit.org/maria-goeppert-mayer.html"
+    }
+  },
+  {
+    "id": "lise-meitner",
+    "name": "Lise Meitner",
+    "shortDescription": "Física nuclear, contribuyó a la teoría de la fisión nuclear.",
+    "description": "Física austriaca-sueca, dejó un legado imborrable en la física nuclear y la radioquímica. A pesar de enfrentar obstáculos de género en una era dominada por hombres, colaboró con Otto Hahn en el descubrimiento de la fisión nuclear, un avance revolucionario. Aunque no compartió el Premio Nobel por este logro, su contribución fue crucial para comprender la energía nuclear y la física de partículas. Su determinación y pasión por la ciencia han inspirado a generaciones de científicas. Lise Meitner es un símbolo perdurable de la perseverancia femenina y el impacto duradero que las mujeres pueden tener en la ciencia.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/lise-meitner.jpg",
+    "facts": {
+      "yearOfBirth": "1878",
+      "yearOfDeath": "1968",
+      "birthPlace": "Viena, Austria",
+      "mainField": "Física"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.bing.com/images/create/lise-meitner-in-nuclear-physics-lab-in-19502c-retro/651196e6bbcb4009950e9955c2199760"
+    }
+  },
+  {
+    "id": "sau-lan-wu",
+    "name": "Sau Lan Wu",
+    "shortDescription": "Física de partículas, contribuyó a experimentos clave en física de alta energía.",
+    "description": "Física experimental sinoamericana, ha sido una fuerza motriz en la física de partículas. Destacó en experimentos en el CERN y lideró investigaciones cruciales, como el descubrimiento del quark c, que expandieron nuestro entendimiento de la estructura fundamental de la materia. Wu superó desafíos en una disciplina dominada por hombres y ha sido un faro de inspiración para científicas de todo el mundo. Sau Lan Wu es un ejemplo de excelencia científica y de cómo las mujeres pueden dejar huella en la investigación de vanguardia.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/sau-lan-wu.jpg",
+    "facts": {
+      "yearOfBirth": "1940",
+      "birthPlace": "Hong Kong, China",
+      "mainField": "Física de Partículas"
+    },
+    "extraInfo": {
+      "imageSource": "https://repository.aip.org/islandora/object/nbla%3A315195"
+    }
+  },
+  {
+    "id": "jocelyn-bell-burnell",
+    "name": "Jocelyn Bell Burnell",
+    "shortDescription": "Astrónoma y astrofísica, co-descubridora de los púlsares.",
+    "description": "Astrofísica británica, es una figura extraordinaria en la ciencia. Durante su doctorado, hizo un descubrimiento revolucionario al detectar los primeros púlsares, estrellas de neutrones altamente magnetizadas que emiten pulsos regulares de radiación. A pesar de que su asesor recibió el Premio Nobel por este descubrimiento, Bell Burnell se ha convertido en un símbolo de perseverancia y contribución de las mujeres a la astronomía. Su carrera distinguida y su activismo en favor de la diversidad de género en la ciencia han inspirado a generaciones futuras de científicas. Jocelyn Bell Burnell es un ejemplo de valentía y excelencia científica.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/jocelyn-bell-burnell.jpg",
+    "facts": {
+      "yearOfBirth": "1943",
+      "birthPlace": "Belfast, Reino Unido",
+      "mainField": "Astronomía, Astrofísica"
+    },
+    "extraInfo": {
+      "imageSource": "https://womeninscienceweadmire.icfo.eu/wiswa-2/jocelyn-bell/"
+    }
+  },
+  {
+    "id": "dorothy-crowfoot-hodgkin",
+    "name": "Dorothy Crowfoot Hodgkin",
+    "shortDescription": "Química, ganadora del Premio Nobel de Química.",
+    "description": "Química británica, es una figura icónica en la ciencia que superó las barreras de género de su época. Su trabajo revolucionario en la cristalografía de rayos X permitió determinar la estructura de importantes biomoléculas, como la penicilina, la vitamina B12 y la insulina. Fue galardonada con el Premio Nobel de Química en 1964, siendo la tercera mujer en recibir este prestigioso reconocimiento. Hodgkin no solo fue una científica excepcional, sino también una defensora de la igualdad de género en la ciencia, allanando el camino para futuras generaciones de científicas y dejando un legado duradero en la investigación y la equidad.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/dorothy-crowfoot-hodgkin.jpg",
+    "facts": {
+      "yearOfBirth": "1910",
+      "yearOfDeath": "1994",
+      "birthPlace": "El Cairo, Egipto / Shipston-on-Stour, Reino Unido",
+      "mainField": "Química"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.some.ox.ac.uk/news/jan-royall-why-we-must-champion-dorothy-hodgkin-for-the-50-note/"
+    }
+  },
+  {
+    "id": "marie-curie",
+    "name": "Marie Curie",
+    "shortDescription": "Física y química, ganadora de dos Premios Nobel.",
+    "description": "física y química de origen polaco y nacionalizada francesa, es una de las figuras más icónicas en la historia de la ciencia. Ganadora de dos premios Nobel (Física en 1903 y Química en 1911), Curie realizó investigaciones fundamentales sobre la radiactividad y el descubrimiento de los elementos radio y polonio. Su dedicación y valentía en la investigación científica, a pesar de los desafíos de la discriminación de género y los riesgos de la radiación, la convierten en un modelo a seguir para científicas de todo el mundo.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/marie-curie.jpg",
+    "facts": {
+      "yearOfBirth": "1867",
+      "yearOfDeath": "1934",
+      "birthPlace": "Varsovia, Polonia",
+      "mainField": "Física y Química"
+    },
+    "extraInfo": {
+      "imageSource": "https://www.historyextra.com/period/first-world-war/life-of-the-week-marie-curie/"
+    }
+  },
+  {
+    "id": "marjory-stephenson",
+    "name": "Marjory Stephenson",
+    "shortDescription": "Microbióloga y bioquímica, investigó en enzimología.",
+    "description": "Bioquímica británica, brilló como científica en una época en la que las mujeres enfrentaban obstáculos muy significativos en la investigación científica. Su trabajo pionero en microbiología, enzimología y bioquímica contribuyó al entendimiento de procesos fundamentales en la vida. Fue una de las primeras mujeres en ser elegida miembro de la Royal Society, un reconocimiento a su destacada contribución a la ciencia. Además, fue una mentora y defensora de las mujeres en la ciencia, inspirando y allanando el camino para futuras generaciones.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/marjory-stephenson.jpg",
+    "facts": {
+      "yearOfBirth": "1885",
+      "yearOfDeath": "1948",
+      "birthPlace": "Londres, Reino Unido",
+      "mainField": "Química, Microbiología, Bioquímica"
+    },
+    "extraInfo": {
+      "imageSource": "https://microbiologysociety.org/grants-prizes/all-prizes-and-competitions-/prize-lectures/marjory-stephenson-prize-lecture/marjory-stephenson-a-short-history.html"
+    }
+  },
+  {
+    "id": "rosalind-franklin",
+    "name": "Rosalind Franklin",
+    "shortDescription": "Química y cristalógrafa, contribuyó a la comprensión de la estructura del ADN.",
+    "description": "Química y cristalógrafa británica, destacó en un campo dominado por hombres y su contribución a la ciencia es innegable. Sus investigaciones pioneras en la cristalografía de rayos X fueron fundamentales para revelar la estructura del ADN en forma de doble hélice, un hito crucial en la biología molecular. A pesar de que su trabajo inicial fue subestimado, su determinación y habilidad científica allanaron el camino para futuros avances en genética y biología. Franklin es un ejemplo inspirador de cómo las mujeres pueden sobresalir en la ciencia, dejando un legado duradero en la investigación y la igualdad de género.",
+    "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/rosalind-franklin.jpg",
+    "facts": {
+      "yearOfBirth": "1920",
+      "yearOfDeath": "1958",
+      "birthPlace": "Londres, Reino Unido",
+      "mainField": "Química, Cristalografía"
+    },
+    "extraInfo": {
+      "imageSource": ""
+    }
+  }
+];*/
+
diff --git a/src/data/villagers.js b/src/data/villagers.js
new file mode 100644
index 00000000..8622b663
--- /dev/null
+++ b/src/data/villagers.js
@@ -0,0 +1,482 @@
+export default vecinos = [
+    {
+      "id": "wol02",
+      "name": "Wolfgang",
+      "species": "Lobo",
+      "personality": "Gru\u00f1\u00f3n",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/a/aa/Wolfgang_NH.png/150px-Wolfgang_NH.png",
+      "shortDescription": "Wolfgang es un aldeano lobo gru\u00f1\u00f3n en la serie Animal Crossing que aparece en todos los juegos hasta la fecha.",
+      "description": "Wolfgang es un aldeano lobo gru\u00f1\u00f3n en la serie Animal Crossing que aparece en todos los juegos hasta la fecha. Su nombre probablemente es un juego de palabras con su especie y el nombre dado Wolfgang.",
+      "facts": {
+        "zodiac": "Sagitario",
+        "birthday": "25/11",
+        "catchphrase": "grauuuh!"
+      }
+    },
+    {
+      "id": "hrs04",
+      "name": "Jereza",
+      "species": "Caballo",
+      "personality": "Gru\u00f1\u00f3n",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/8/8e/Roscoe_NH.png/150px-Roscoe_NH.png",
+      "shortDescription": "Jereza es un aldeano caballo gru\u00f1\u00f3n en la serie Animal Crossing.",
+      "description": "Jereza es un aldeano caballo gru\u00f1\u00f3n en la serie Animal Crossing. Apareci\u00f3 por primera vez en Doubutsu no Mori e+ y ha aparecido en todos los juegos posteriores. Es el \u00fanico caballo gru\u00f1\u00f3n en la serie. Su nombre puede ser un juego de palabras con el jinete galardonado, Jereza Goose, y su frase caracter\u00edstica puede ser un juego de palabras con el relincho.",
+      "facts": {
+        "zodiac": "G\u00e9minis",
+        "birthday": "16/6",
+        "catchphrase": "\u00f1iii"
+      }
+    },
+    {
+      "id": "pbr00",
+      "name": "Apolo",
+      "species": "\u00c1guila",
+      "personality": "Gru\u00f1\u00f3n",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/0/0e/Apollo_NH_Transparent.png/150px-Apollo_NH_Transparent.png",
+      "shortDescription": "Apolo es un aldeano \u00e1guila gru\u00f1\u00f3n en la serie Animal Crossing que aparece en todos los juegos hasta la fecha, as\u00ed como en \ud83c\udfac Gekij\u014dban Doubutsu no Mori.",
+      "description": "Apolo es un aldeano \u00e1guila gru\u00f1\u00f3n en la serie Animal Crossing que aparece en todos los juegos hasta la fecha, as\u00ed como en \ud83c\udfac Gekij\u014dban Doubutsu no Mori. Su nombre puede ser una referencia al programa espacial Apolo de la NASA en los Estados Unidos, ya que su especie es el ave nacional de EE. UU. y su cumplea\u00f1os, el 4 de julio, es el D\u00eda de la Independencia en EE. UU.",
+      "facts": {
+        "zodiac": "C\u00e1ncer",
+        "birthday": "4/7",
+        "catchphrase": "rapahhh"
+      }
+    },
+    {
+      "id": "rhn02",
+      "name": "Cornio",
+      "species": "Rinoceronte",
+      "personality": "Gru\u00f1\u00f3n",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/f/f1/Spike_NH.png/150px-Spike_NH.png",
+      "shortDescription": "Cornio es un aldeano rinoceronte gru\u00f1\u00f3n en la serie Animal Crossing.",
+      "description": "Cornio es un aldeano rinoceronte gru\u00f1\u00f3n en la serie Animal Crossing. Apareci\u00f3 por primera vez en Doubutsu no Mori y despu\u00e9s de su aparici\u00f3n en Doubutsu no Mori e+, estuvo ausente en la serie hasta Animal Crossing: New Leaf - Welcome amiibo. Datos sobre \u00e9l existen en Animal Crossing: Happy Home Designer, pero finalmente no se utilizan. Datos no utilizados de Cornio tambi\u00e9n se pod\u00edan encontrar en Animal Crossing: Pocket Camp antes de su inclusi\u00f3n en el juego. Es el \u00fanico rinoceronte gru\u00f1\u00f3n en la serie. Su nombre se refiere al cuerno en su cabeza, que tambi\u00e9n podr\u00eda llamarse espiga.",
+      "facts": {
+        "zodiac": "C\u00e1ncer",
+        "birthday": "17/6",
+        "catchphrase": "granuja"
+      }
+    },
+    {
+      "id": "cbr05",
+      "name": "Parches",
+      "species": "Oso",
+      "personality": "Perezoso",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/5/56/Stitches_NH.png/150px-Stitches_NH.png",
+      "shortDescription": "Parches es un aldeano oso cub gru\u00f1\u00f3n en la serie Animal Crossing.",
+      "description": "Parches es un aldeano oso cub gru\u00f1\u00f3n en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: Wild World y ha aparecido en todos los juegos posteriores. Est\u00e1 dise\u00f1ado como un osito de peluche hecho de parches de tela coloridos, y su nombre, frase caracter\u00edstica y dicho favorito hacen referencia a su dise\u00f1o.",
+      "facts": {
+        "zodiac": "Acuario",
+        "birthday": "10/2",
+        "catchphrase": "paguahhh"
+      }
+    },
+    {
+      "id": "goa09",
+      "name": "Morfeo",
+      "species": "Cabra",
+      "personality": "Perezoso",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/1/18/Sherb_NH.png/150px-Sherb_NH.png",
+      "shortDescription": "Morfeo es un aldeano cabra perezoso en la serie Animal Crossing",
+      "description": "Morfeo es un aldeano cabra perezoso en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Horizons y fue agregado a Animal Crossing: Pocket Camp para coincidir con el lanzamiento del primero. Su nombre puede derivarse de \"sherbet\", un postre helado, que se relaciona con la ropa tem\u00e1tica de nieve que usa por defecto.",
+      "facts": {
+        "zodiac": "Capricornio",
+        "birthday": "18/1",
+        "catchphrase": "bostezzz"
+      }
+    },
+    {
+      "id": "rhn04",
+      "name": "Rino",
+      "species": "Rinoceronte",
+      "personality": "Perezoso",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/9/95/Hornsby_NH.png/150px-Hornsby_NH.png",
+      "shortDescription": "Rino es un aldeano rinoceronte perezoso en la serie Animal Crossing",
+      "description": "Rino es un aldeano rinoceronte perezoso en la serie Animal Crossing. Apareci\u00f3 por primera vez en Doubutsu no Mori y despu\u00e9s de su aparici\u00f3n en Doubutsu no Mori e+, estuvo ausente en la serie hasta Animal Crossing: New Leaf - Welcome amiibo. Existen datos sobre \u00e9l en Animal Crossing: Happy Home Designer, pero finalmente no se utilizan. Es el \u00fanico rinoceronte perezoso en la serie. Su nombre proviene del cuerno en su cabeza.",
+      "facts": {
+        "zodiac": "Piscis",
+        "birthday": "20/3",
+        "catchphrase": "naricita"
+      }
+    },
+    {
+      "id": "dog02",
+      "name": "Pupas",
+      "species": "Perro",
+      "personality": "Perezoso",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/5/59/Lucky_NH.png/150px-Lucky_NH.png",
+      "shortDescription": "Pupas es un aldeano perro perezoso en la serie Animal Crossing que aparece en todos los juegos hasta la fecha",
+      "description": "Pupas es un aldeano perro perezoso en la serie Animal Crossing que aparece en todos los juegos hasta la fecha. Su nombre es ir\u00f3nico, dado que su apariencia lo hace parecer una persona herida envuelta en vendajes.",
+      "facts": {
+        "zodiac": "Escorpio",
+        "birthday": "4/11",
+        "catchphrase": "guuuuf"
+      }
+    },
+    {
+      "id": "mnk09",
+      "name": "Tiangsheng",
+      "species": "Mono",
+      "personality": "Deportista",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/5/5d/Tiansheng_amiibo.png",
+      "shortDescription": "Tiangsheng es un aldeano mono atl\u00e9tico en la serie Animal Crossing",
+      "description": "Tiangsheng es un aldeano mono atl\u00e9tico en la serie Animal Crossing. Fue agregado a Animal Crossing: New Horizons como parte de la Actualizaci\u00f3n Gratuita 2.0 el 4 de noviembre de 2021, y fue agregado a Animal Crossing: Pocket Camp entre el anuncio y el lanzamiento de la actualizaci\u00f3n de New Horizons. Su nombre y apariencia est\u00e1n basados en el Rey Mono, tambi\u00e9n conocido como Sun Wukong, uno de los protagonistas de la novela china de 1592 'Journey to the West'. Su nombre se deriva espec\u00edficamente del t\u00edtulo autoproclamado de Sun Wukong, \"Q\u00ed Ti\u0101n D\u00e0 Sh\u00e8ng\" (simplificado: \u9f50\u5929\u5927\u5723/tradicional: \u9f4a\u5929\u5927\u8056), que se traduce como \"Gran Sabio, Igual a los Cielos\".",
+      "facts": {
+        "zodiac": "Leo",
+        "birthday": "4/8",
+        "catchphrase": "wuwu"
+      }
+    },
+    {
+      "id": "dog14",
+      "name": "Pit",
+      "species": "Perro",
+      "personality": "Deportista",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/a/ab/Mac_NH.png/150px-Mac_NH.png",
+      "shortDescription": "Pit es un aldeano perro atl\u00e9tico en la serie Animal Crossing",
+      "description": "Pit es un aldeano perro atl\u00e9tico en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: City Folk y ha aparecido en todos los juegos posteriores excepto Animal Crossing: Pocket Camp.",
+      "facts": {
+        "zodiac": "Escorpio",
+        "birthday": "11/11",
+        "catchphrase": "frusky"
+      }
+    },
+    {
+      "id": "cbr02",
+      "name": "Poncho",
+      "species": "Cub",
+      "personality": "Deportista",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/f/f0/Poncho_NH.png/150px-Poncho_NH.png",
+      "shortDescription": "Poncho es un aldeano cachorro de oso deportista de la serie Animal Crossing que aparece en todos los juegos hasta la fecha",
+      "description": "Poncho es un aldeano cachorro de oso deportista de la serie Animal Crossing que aparece en todos los juegos hasta la fecha. Su eslogan, 'peque\u00f1o oso', hace referencia a su especie.",
+      "facts": {
+        "zodiac": "Capricornio",
+        "birthday": "2/1",
+        "catchphrase": "bolita"
+      }
+    },
+    {
+      "id": "der01",
+      "name": "Cornelio",
+      "species": "Ciervo",
+      "personality": "Deportista",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/2/2b/Bam_NH.png/150px-Bam_NH.png",
+      "shortDescription": "Cornelio es un aldeano ciervo atl\u00e9tico en la serie Animal Crossing",
+      "description": "Cornelio es un aldeano ciervo atl\u00e9tico en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Leaf y ha aparecido en todos los juegos posteriores. Es el \u00fanico ciervo atl\u00e9tico en la serie. Su nombre puede derivarse de Corneliobi, un ciervo macho que es el personaje principal de la novela 'Corneliobi, una vida en el bosque' y su adaptaci\u00f3n cinematogr\u00e1fica. Su nombre tambi\u00e9n es onomatopeya para un ruido fuerte y abrupto, y en una tem\u00e1tica similar, su frase caracter\u00edstica PAL antes de Animal Crossing: New Horizons, 'prang', significa 'choque'.",
+      "facts": {
+        "zodiac": "Escorpio",
+        "birthday": "7/11",
+        "catchphrase": "galilla"
+      }
+    },
+    {
+      "id": "squ17",
+      "name": "Munchi",
+      "species": "Ardilla",
+      "personality": "Esnob",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/d/da/Marshal_NH.png/150px-Marshal_NH.png",
+      "shortDescription": "Munchi es un aldeano ardilla engre\u00eddo en la serie Animal Crossing",
+      "description": "Munchi es un aldeano ardilla engre\u00eddo en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Leaf y ha aparecido en todos los juegos posteriores. Es la \u00fanica ardilla engre\u00edda en la serie. Su nombre puede derivarse de 'malvavisco', haciendo referencia al color de su pelaje. Su frase caracter\u00edstica, 'sulky', puede tener cierto parecido con su apariencia.",
+      "facts": {
+        "zodiac": "Libra",
+        "birthday": "29/9",
+        "catchphrase": "tec\u00faen"
+      }
+    },
+    {
+      "id": "hrs13",
+      "name": "Azulino",
+      "species": "Caballo",
+      "personality": "Esnob",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/f/f2/Julian_NH.png/150px-Julian_NH.png",
+      "shortDescription": "Azulino es un aldeano caballo engre\u00eddo en la serie Animal Crossing",
+      "description": "Azulino es un aldeano caballo engre\u00eddo en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Leaf y ha aparecido en todos los juegos posteriores.",
+      "facts": {
+        "zodiac": "Piscis",
+        "birthday": "15/3",
+        "catchphrase": "trot\u00f3t"
+      }
+    },
+    {
+      "id": "cat23",
+      "name": "Narciso",
+      "species": "Gato",
+      "personality": "Esnob",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/2/2a/Raymond_NH.png",
+      "shortDescription": "Narciso es un aldeano gato engre\u00eddo en la serie Animal Crossing",
+      "description": "Narciso es un aldeano gato engre\u00eddo en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Horizons y fue agregado a Animal Crossing: Pocket Camp para coincidir con el lanzamiento del primero. Hasta el lanzamiento de New Horizons, \u00e9l es el \u00fanico gato engre\u00eddo en la serie.",
+      "facts": {
+        "zodiac": "Libra",
+        "birthday": "1/10",
+        "catchphrase": "atilda"
+      }
+    },
+    {
+      "id": "dog18",
+      "name": "Fleco",
+      "species": "Perro",
+      "personality": "Esnob",
+      "gender": "Masculino",
+      "image_url": "https://dodo.ac/np/images/thumb/c/c1/Shep_NH.png/150px-Shep_NH.png",
+      "shortDescription": "Fleco es un aldeano perro engre\u00eddo en la serie Animal Crossing",
+      "description": "Fleco es un aldeano perro engre\u00eddo en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Leaf y ha aparecido en todos los juegos posteriores. Es el \u00fanico perro engre\u00eddo en la serie. Su nombre viene de 'perro pastor', lo cual se refleja en su frase caracter\u00edstica.",
+      "facts": {
+        "zodiac": "Sagitario",
+        "birthday": "24/11",
+        "catchphrase": "grrruau"
+      }
+    },
+    {
+      "id": "der00",
+      "name": "Fauna",
+      "species": "Ciervo",
+      "personality": "Dulce",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/thumb/9/91/Fauna_NH.png/150px-Fauna_NH.png",
+      "shortDescription": "Fauna es una aldeana ciervo normal en la serie Animal Crossing",
+      "description": "Fauna es una aldeana ciervo normal en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Leaf y ha aparecido en todos los juegos posteriores. Su nombre proviene de 'fauna', que significa la vida animal de una regi\u00f3n espec\u00edfica, aunque tambi\u00e9n puede ser un juego de palabras con 'fawn', un ciervo joven.",
+      "facts": {
+        "zodiac": "Aries",
+        "birthday": "26/3",
+        "catchphrase": "puchu"
+      }
+    },
+    {
+      "id": "cbr01",
+      "name": "Dulce",
+      "species": "Oso",
+      "personality": "Dulce",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/thumb/a/a2/Maple_NH.png/150px-Maple_NH.png",
+      "shortDescription": "Dulce es una aldeana oso cachorro normal en la serie Animal Crossing que aparece en todos los juegos hasta la fecha",
+      "description": "Dulce es una aldeana oso cachorro normal en la serie Animal Crossing que aparece en todos los juegos hasta la fecha. Su nombre puede provenir de los arces, que se conocen por tener hojas marr\u00f3n claro, haciendo referencia al color de su pelaje. Su frase caracter\u00edstica, 'miel', hace referencia a c\u00f3mo a los osos les gusta comer miel.",
+      "facts": {
+        "zodiac": "G\u00e9minis",
+        "birthday": "15/6",
+        "catchphrase": "mielmiel"
+      }
+    },
+    {
+      "id": "squ21",
+      "name": "Auri",
+      "species": "Ardilla",
+      "personality": "Dulce",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/4/40/Ione_amiibo.png",
+      "shortDescription": "Auri es una aldeana ardilla normal en la serie Animal Crossing",
+      "description": "Auri es una aldeana ardilla normal en la serie Animal Crossing. Fue agregada a Animal Crossing: New Horizons como parte de la Actualizaci\u00f3n Gratuita 2.0 el 4 de noviembre de 2021, y fue a\u00f1adida a Animal Crossing: Pocket Camp entre el anuncio y el lanzamiento de la actualizaci\u00f3n de New Horizons. El nombre 'Auri' es el antiguo griego para la flor violeta y el nombre de una ninfa en la mitolog\u00eda griega, posiblemente haciendo referencia al tema espacial completo de Auri. Su frase caracter\u00edstica, 'brillo', puede referirse a las estrellas brillando en el cielo, coincidiendo con su tema espacial, o puede referirse a c\u00f3mo ciertas partes de su cuerpo brillan en la oscuridad.",
+      "facts": {
+        "zodiac": "Virgo",
+        "birthday": "11/9",
+        "catchphrase": "blinguibl\u00edn"
+      }
+    },
+    {
+      "id": "duk16",
+      "name": "Deira",
+      "species": "Pato",
+      "personality": "Dulce",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/thumb/2/29/Molly_NH.png/150px-Molly_NH.png",
+      "shortDescription": "Deira es una aldeana pato normal en la serie Animal Crossing",
+      "description": "Deira es una aldeana pato normal en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Leaf y ha aparecido en todos los juegos posteriores. Su nombre puede derivarse de '\u00e1nade'.",
+      "facts": {
+        "zodiac": "Piscis",
+        "birthday": "7/3",
+        "catchphrase": "deverd\u00e1"
+      }
+    },
+    {
+      "id": "der11",
+      "name": "Yuki",
+      "species": "Ciervo",
+      "personality": "Vivaracha",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/2/26/Shino_amiibo.png",
+      "shortDescription": "Yuki es una aldeana ciervo animada en la serie Animal Crossing",
+      "description": "Yuki es una aldeana ciervo animada en la serie Animal Crossing. Fue agregada a Animal Crossing: New Horizons como parte de la Actualizaci\u00f3n Gratuita 2.0 el 4 de noviembre de 2021, y fue a\u00f1adida a Animal Crossing: Pocket Camp entre el anuncio y el lanzamiento de la actualizaci\u00f3n de New Horizons. Hasta el lanzamiento de New Horizons, ella es la \u00fanica cierva animada en la serie.",
+      "facts": {
+        "zodiac": "Libra",
+        "birthday": "31/10",
+        "catchphrase": "oni"
+      }
+    },
+    {
+      "id": "wol12",
+      "name": "Monica",
+      "species": "Lobo",
+      "personality": "Vivaracha",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/thumb/1/1b/Audie_NH.png/150px-Audie_NH.png",
+      "shortDescription": "Monica es una aldeana lobo animada en la serie Animal Crossing",
+      "description": "Monica es una aldeana lobo animada en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Horizons y fue agregada a Animal Crossing: Pocket Camp para coincidir con el lanzamiento del primero. Hasta el lanzamiento de New Horizons, ella es la \u00fanica loba animada en la serie.",
+      "facts": {
+        "zodiac": "Virgo",
+        "birthday": "31/8",
+        "catchphrase": "ulalil\u00e1"
+      }
+    },
+    {
+      "id": "tig06",
+      "name": "Bianca",
+      "species": "Tigre",
+      "personality": "Vivaracha",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/thumb/6/6f/Bianca_NH.png/150px-Bianca_NH.png",
+      "shortDescription": "Bianca es una aldeana tigre animada en la serie Animal Crossing",
+      "description": "Bianca es una aldeana tigre animada en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Leaf y ha aparecido en todos los juegos posteriores. Bianca, junto con Claudia, es notablemente la primera tigresa desde Bangle en aparecer en un t\u00edtulo de la serie Animal Crossing, compartiendo tambi\u00e9n la personalidad animada de Bangle. El nombre de Bianca en italiano significa 'blanco', haciendo referencia al color de su pelaje. La parte posterior de su frase caracter\u00edstica japonesa, 'de hyou' (\u3067\u30d2\u30e7\u30a6), significa 'leopardo', relacion\u00e1ndose con su especie; 'hyou' (\u30d2\u30e7\u30a6) tambi\u00e9n se traduce como 'granizo', relacion\u00e1ndose con su tema de clima fr\u00edo, ya que se asemeja a un leopardo de las nieves.",
+      "facts": {
+        "zodiac": "Sagitario",
+        "birthday": "13/12",
+        "catchphrase": "ruarri"
+      }
+    },
+    {
+      "id": "ost04",
+      "name": "Rio",
+      "species": "Avestruz",
+      "personality": "Vivaracha",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/7/7e/Rio_amiibo.png",
+      "shortDescription": "R\u00edo es una aldeana avestruz animada en la serie Animal Crossing",
+      "description": "R\u00edo es una aldeana avestruz animada en la serie Animal Crossing. Aparece en Doubutsu no Mori, Doubutsu no Mori+, Animal Crossing, Doubutsu no Mori e+ y regresa en Animal Crossing: New Horizons. Su nombre en ingl\u00e9s, junto con su nombre japon\u00e9s, De Janeiro (\u30c7\u30b8\u30e3\u30cd\u30a4\u30ed), probablemente hace referencia a la ciudad brasile\u00f1a, R\u00edo de Janeiro. Su apariencia generalmente muy decorada, combinada con su nombre, puede ser una referencia a los bailarines del Carnaval de R\u00edo de Janeiro. Esto se ve respaldado por su descripci\u00f3n en Pocket Camp, que indica que ella baila reflexivamente con m\u00fasica animada.",
+      "facts": {
+        "zodiac": "Sagitario",
+        "birthday": "10/9",
+        "catchphrase": "sambasamba"
+      }
+    },
+    {
+      "id": "der08",
+      "name": "Bambina",
+      "species": "Ciervo",
+      "personality": "Altanera",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/thumb/1/1f/Diana_NH.png/150px-Diana_NH.png",
+      "shortDescription": "Bambina es una aldeana ciervo presumida en la serie Animal Crossing",
+      "description": "Bambina es una aldeana ciervo presumida en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Leaf y ha aparecido en todos los juegos posteriores. Ella es la \u00fanica cierva presumida en la serie. Su nombre puede referirse a la m\u00edtica Bambina, la Diosa de la Caza, que transform\u00f3 a un cazador en ciervo cuando la vio ba\u00f1\u00e1ndose en el bosque; esto se ve respaldado por su hogar, que tiene como tema un ba\u00f1o p\u00fablico.",
+      "facts": {
+        "zodiac": "Capricornio",
+        "birthday": "4/1",
+        "catchphrase": "nonu\u00e1"
+      }
+    },
+    {
+      "id": "squ13",
+      "name": "Tania",
+      "species": "Ardilla",
+      "personality": "Altanera",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/thumb/3/35/Tasha_NH.png/150px-Tasha_NH.png",
+      "shortDescription": "Tania es una aldeana ardilla presumida en la serie Animal Crossing",
+      "description": "Tania es una aldeana ardilla presumida en la serie Animal Crossing. Tras su debut en Doubutsu no Mori e+, se mantuvo ausente en la serie hasta Animal Crossing: New Leaf - Welcome amiibo.",
+      "facts": {
+        "zodiac": "Sagitario",
+        "birthday": "30/11",
+        "catchphrase": "bi-bu\u00e1"
+      }
+    },
+    {
+      "id": "wol03",
+      "name": "Lupe",
+      "species": "Lobo",
+      "personality": "Altanera",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/thumb/3/36/Whitney_NH.png/150px-Whitney_NH.png",
+      "shortDescription": "Lupe es una aldeana lobo presumida en la serie Animal Crossing",
+      "description": "Lupe es una aldeana lobo presumida en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: Wild World y ha aparecido en todos los juegos posteriores, as\u00ed como en \ud83c\udfec Gekij\u014dban Doubutsu no Mori. Su nombre probablemente proviene de su color de pelaje blanco.",
+      "facts": {
+        "zodiac": "Virgo",
+        "birthday": "17/9",
+        "catchphrase": "auf-auf"
+      }
+    },
+    {
+      "id": "ost08",
+      "name": "Roc\u00edo",
+      "species": "Avestruz",
+      "personality": "Altanera",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/thumb/d/df/Blanche_NH.png/150px-Blanche_NH.png",
+      "shortDescription": "Roc\u00edo es una aldeana avestruz presumida en la serie Animal Crossing",
+      "description": "Roc\u00edo es una aldeana avestruz presumida en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Leaf y ha aparecido en todos los juegos posteriores. Su nombre es la palabra francesa para blanco, haciendo referencia al color de sus plumas.",
+      "facts": {
+        "zodiac": "Sagitario",
+        "birthday": "21/12",
+        "catchphrase": "goticas"
+      }
+    },
+    {
+      "id": "hrs16",
+      "name": "Luna",
+      "species": "Caballo",
+      "personality": "Familiar",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/thumb/9/92/Reneigh_NH.png/150px-Reneigh_NH.png",
+      "shortDescription": "Luna es una aldeana caballo hermana mayor en la serie Animal Crossing",
+      "description": "Luna es una aldeana caballo hermana mayor en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Horizons y fue agregada a Animal Crossing: Pocket Camp para coincidir con el lanzamiento del primero. Hasta el lanzamiento de New Horizons, ella es la \u00fanica caballa hermana mayor en la serie. Su nombre es un juego de palabras entre el nombre Ren\u00e9e y neigh, un sonido que hacen los caballos.",
+      "facts": {
+        "zodiac": "G\u00e9minis",
+        "birthday": "4/6",
+        "catchphrase": "guauchi"
+      }
+    },
+    {
+      "id": "dog17",
+      "name": "Corcelia",
+      "species": "Perro",
+      "personality": "Familiar",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/thumb/3/3e/Cherry_NH.png/150px-Cherry_NH.png",
+      "shortDescription": "Corcelia es una aldeana perro hermana mayor en la serie Animal Crossing",
+      "description": "Corcelia es una aldeana perro hermana mayor en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Leaf y ha aparecido en todos los juegos posteriores. Ella es la \u00fanica aldeana perro hermana mayor en la serie. Su nombre probablemente se refiere al color rojo de su pelaje.",
+      "facts": {
+        "zodiac": "Tauro",
+        "birthday": "11/5",
+        "catchphrase": "ju\u00e1\u00e1\u00e1"
+      }
+    },
+    {
+      "id": "pbr10",
+      "name": "Alexis",
+      "species": "\u00c1guila",
+      "personality": "Familiar",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/thumb/a/a2/Quinn_amiibo.png/150px-Quinn_amiibo.png",
+      "shortDescription": "Alexis es una aldeana \u00e1guila hermana mayor en la serie Animal Crossing",
+      "description": "Alexis es una aldeana \u00e1guila hermana mayor en la serie Animal Crossing. Fue agregada a Animal Crossing: New Horizons como parte de la Actualizaci\u00f3n Gratuita 2.0 el 4 de noviembre de 2021, y fue agregada a Animal Crossing: Pocket Camp entre el anuncio y el lanzamiento de la actualizaci\u00f3n de New Horizons. Hasta el lanzamiento de New Horizons, ella es la \u00fanica aldeana \u00e1guila hermana mayor en la serie.",
+      "facts": {
+        "zodiac": "Capricornio",
+        "birthday": "20/1",
+        "catchphrase": "nobi"
+      }
+    },
+    {
+      "id": "der06",
+      "name": "Rosalina",
+      "species": "Ciervo",
+      "personality": "Familiar",
+      "gender": "Femenino",
+      "image_url": "https://dodo.ac/np/images/thumb/6/67/Fuchsia_NH.png/150px-Fuchsia_NH.png",
+      "shortDescription": "Rosalina es una aldeana ciervo hermana mayor en la serie Animal Crossing",
+      "description": "Rosalina es una aldeana ciervo hermana mayor en la serie Animal Crossing. Apareci\u00f3 por primera vez en Animal Crossing: New Leaf y ha aparecido en todos los juegos posteriores. Su nombre proviene del color de su pelaje, un tono de rosa conocido como fucsia.",
+      "facts": {
+        "zodiac": "Virgo",
+        "birthday": "19/9",
+        "catchphrase": "braaaam"
+      }
+    }
+  ];
\ No newline at end of file
diff --git a/src/dataFunctions.js b/src/dataFunctions.js
index 5de554af..677225e5 100644
--- a/src/dataFunctions.js
+++ b/src/dataFunctions.js
@@ -1,9 +1,33 @@
-// Estas funciones son ejemplos, aquí puedes desarrollar tus propias funciones.
+export const sortData = (data, sortBy, sortOrder) => {
+  data.sort((a, b) => {
+    const valueA = a[sortBy];
+    const valueB = b[sortBy];
+    const compare = valueA.localeCompare(valueB);
+    return sortOrder === "asc" ? compare : -compare; 
+  });
+  return data;
+};
 
-export const example = () => {
-  return 'example';
+export const filterData = (data, filterBy, value) => {
+  const array = data.filter((items => items[filterBy] === value));
+  return array;
 };
 
-export const anotherExample = () => {
-  return [];
+export const computeStats = (data) => {
+  const acumuladorMen = data.reduce((acumuladorMen, item) => {
+    if (item.gender === "Masculino") {
+      acumuladorMen++;
+    }
+    return acumuladorMen;
+  }, 0);
+
+  const acumuladorWomen = data.reduce((acumuladorWomen, item) => {
+    if (item.gender === "Femenino") {
+      acumuladorWomen++;
+    }
+    return acumuladorWomen;
+  }, 0);
+  const totalMen = parseFloat((acumuladorMen / data.length) * 100).toFixed(2);
+  const totalWomen = parseFloat((acumuladorWomen / data.length) * 100).toFixed(2);
+  return `Porcentaje personajes masculinos: ${totalMen}% \nPorcentaje personajes femeninos: ${totalWomen}%`;
 };
diff --git a/src/fonts/EncodeSans_Condensed-Bold.ttf b/src/fonts/EncodeSans_Condensed-Bold.ttf
new file mode 100644
index 00000000..31882870
Binary files /dev/null and b/src/fonts/EncodeSans_Condensed-Bold.ttf differ
diff --git a/src/fonts/EncodeSans_Condensed-Light.ttf b/src/fonts/EncodeSans_Condensed-Light.ttf
new file mode 100644
index 00000000..80e3497e
Binary files /dev/null and b/src/fonts/EncodeSans_Condensed-Light.ttf differ
diff --git a/src/fonts/EncodeSans_Condensed-Regular.ttf b/src/fonts/EncodeSans_Condensed-Regular.ttf
new file mode 100644
index 00000000..87272350
Binary files /dev/null and b/src/fonts/EncodeSans_Condensed-Regular.ttf differ
diff --git a/src/images/Logo.png b/src/images/Logo.png
new file mode 100644
index 00000000..805f6d61
Binary files /dev/null and b/src/images/Logo.png differ
diff --git a/src/images/Pastel de cumple.png b/src/images/Pastel de cumple.png
new file mode 100644
index 00000000..7d672775
Binary files /dev/null and b/src/images/Pastel de cumple.png differ
diff --git a/src/images/User.png b/src/images/User.png
new file mode 100644
index 00000000..bd6fdad4
Binary files /dev/null and b/src/images/User.png differ
diff --git a/src/images/animal.jpg b/src/images/animal.jpg
new file mode 100644
index 00000000..951e9428
Binary files /dev/null and b/src/images/animal.jpg differ
diff --git a/src/images/bones.png b/src/images/bones.png
new file mode 100644
index 00000000..b1030ffb
Binary files /dev/null and b/src/images/bones.png differ
diff --git a/src/images/bree.webp b/src/images/bree.webp
new file mode 100644
index 00000000..5d3f9315
Binary files /dev/null and b/src/images/bree.webp differ
diff --git a/src/images/cardAltanera.png b/src/images/cardAltanera.png
new file mode 100644
index 00000000..42a8a994
Binary files /dev/null and b/src/images/cardAltanera.png differ
diff --git a/src/images/cardDeportista.png b/src/images/cardDeportista.png
new file mode 100644
index 00000000..aee5c2eb
Binary files /dev/null and b/src/images/cardDeportista.png differ
diff --git a/src/images/cardDulce.png b/src/images/cardDulce.png
new file mode 100644
index 00000000..3e4e659d
Binary files /dev/null and b/src/images/cardDulce.png differ
diff --git a/src/images/cardEsnob.png b/src/images/cardEsnob.png
new file mode 100644
index 00000000..514466ae
Binary files /dev/null and b/src/images/cardEsnob.png differ
diff --git "a/src/images/cardGru\303\261on.png" "b/src/images/cardGru\303\261on.png"
new file mode 100644
index 00000000..86ce7362
Binary files /dev/null and "b/src/images/cardGru\303\261on.png" differ
diff --git a/src/images/cardPerezoso.png b/src/images/cardPerezoso.png
new file mode 100644
index 00000000..11d4672f
Binary files /dev/null and b/src/images/cardPerezoso.png differ
diff --git a/src/images/cardVivaracha.png b/src/images/cardVivaracha.png
new file mode 100644
index 00000000..d544ada3
Binary files /dev/null and b/src/images/cardVivaracha.png differ
diff --git a/src/images/female.png b/src/images/female.png
new file mode 100644
index 00000000..f64ccab9
Binary files /dev/null and b/src/images/female.png differ
diff --git a/src/images/fondo.jpg b/src/images/fondo.jpg
new file mode 100644
index 00000000..3ca53061
Binary files /dev/null and b/src/images/fondo.jpg differ
diff --git a/src/images/fondo.webp b/src/images/fondo.webp
new file mode 100644
index 00000000..8d081c33
Binary files /dev/null and b/src/images/fondo.webp differ
diff --git a/src/images/island.png b/src/images/island.png
new file mode 100644
index 00000000..113b53ce
Binary files /dev/null and b/src/images/island.png differ
diff --git a/src/images/male.png b/src/images/male.png
new file mode 100644
index 00000000..32a860af
Binary files /dev/null and b/src/images/male.png differ
diff --git a/src/images/nookipedia.png b/src/images/nookipedia.png
new file mode 100644
index 00000000..af0c3dab
Binary files /dev/null and b/src/images/nookipedia.png differ
diff --git a/src/images/zodiacs/Acuario.png b/src/images/zodiacs/Acuario.png
new file mode 100644
index 00000000..9ec75c03
Binary files /dev/null and b/src/images/zodiacs/Acuario.png differ
diff --git a/src/images/zodiacs/Aries.png b/src/images/zodiacs/Aries.png
new file mode 100644
index 00000000..5678e91b
Binary files /dev/null and b/src/images/zodiacs/Aries.png differ
diff --git a/src/images/zodiacs/Cancer.png b/src/images/zodiacs/Cancer.png
new file mode 100644
index 00000000..d3ee829c
Binary files /dev/null and b/src/images/zodiacs/Cancer.png differ
diff --git a/src/images/zodiacs/Capricornio.png b/src/images/zodiacs/Capricornio.png
new file mode 100644
index 00000000..a0554ca0
Binary files /dev/null and b/src/images/zodiacs/Capricornio.png differ
diff --git a/src/images/zodiacs/Escorpio.png b/src/images/zodiacs/Escorpio.png
new file mode 100644
index 00000000..6ae0d871
Binary files /dev/null and b/src/images/zodiacs/Escorpio.png differ
diff --git a/src/images/zodiacs/Geminis.png b/src/images/zodiacs/Geminis.png
new file mode 100644
index 00000000..0cd32259
Binary files /dev/null and b/src/images/zodiacs/Geminis.png differ
diff --git a/src/images/zodiacs/Leo.png b/src/images/zodiacs/Leo.png
new file mode 100644
index 00000000..13cbb4f2
Binary files /dev/null and b/src/images/zodiacs/Leo.png differ
diff --git a/src/images/zodiacs/Libra.png b/src/images/zodiacs/Libra.png
new file mode 100644
index 00000000..dfb72ae1
Binary files /dev/null and b/src/images/zodiacs/Libra.png differ
diff --git a/src/images/zodiacs/Picis.png b/src/images/zodiacs/Picis.png
new file mode 100644
index 00000000..b1f99884
Binary files /dev/null and b/src/images/zodiacs/Picis.png differ
diff --git a/src/images/zodiacs/Sagitario.png b/src/images/zodiacs/Sagitario.png
new file mode 100644
index 00000000..43b052f9
Binary files /dev/null and b/src/images/zodiacs/Sagitario.png differ
diff --git a/src/images/zodiacs/Tauro.png b/src/images/zodiacs/Tauro.png
new file mode 100644
index 00000000..6b1e7a80
Binary files /dev/null and b/src/images/zodiacs/Tauro.png differ
diff --git a/src/images/zodiacs/Virgo.png b/src/images/zodiacs/Virgo.png
new file mode 100644
index 00000000..45d01d38
Binary files /dev/null and b/src/images/zodiacs/Virgo.png differ
diff --git a/src/index.html b/src/index.html
index 0151e7de..f1d41241 100644
--- a/src/index.html
+++ b/src/index.html
@@ -1,11 +1,201 @@
 <!DOCTYPE html>
-<html>
+<html lang="en">
   <head>
-    <meta charset="utf-8">
-    <title>Data Lovers</title>
-    <link rel="stylesheet" href="style.css" />
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link rel="preconnect" href="https://fonts.googleapis.com" />
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+    <link rel="shortcut icon" href="images/animal.jpg" type="image/x-icon"><!--con esto aparece un icono en la pestaña-->
+    <link rel="stylesheet" href="./style.css" />
+    <title>WikiNook</title>
   </head>
   <body>
-    <script src="main.js" type="module"></script>
+    <header>
+      <div class="header-title">
+        <img src="./images/Logo.png" alt="Logo" />
+        <h1>WikiNook</h1>
+      </div>
+      <div class="header-user">
+        <img src="./images/User.png" alt="User" />
+        Usuario
+      </div>
+    </header>
+    <main>
+      <aside>
+        <div data-testid="select-filterGender" name="gender">
+          <label for="filter"><h2>Genero</h2></label>
+          <ul>
+            <li>
+              <input type="radio" name="optionOne" id="genderMasculine" value="Masculino">
+              <label for="genderMasculine">Masculino</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionOne" id="genderWomen" value="Femenino">
+              <label for="genderWomen">Femenino</label> 
+            </li>
+          </ul>
+        </div>
+        <hr/>
+        <div data-testid="select-filter" name="species">
+          <label for="filterForSpecies"><h2>Especie</h2></label>
+          <ul>
+            <li>
+              <input type="radio" name="optionTwo" id="specieTiger" value="Tigre">
+              <label for="specieTiger">Tigre</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionTwo" id="specieDog" value="Perro">
+              <label for="specieDog">Perro</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionTwo" id="specieSquirrel" value="Ardilla">
+              <label for="specieSquirrel">Ardilla</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionTwo" id="specieChicken" value="Gallo">
+              <label for="specieChicken">Gallo</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionTwo" id="specieMouse" value="Raton">
+              <label for="specieMouse">Ratón</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionTwo" id="specieWolf" value="Lobo">
+              <label for="specieWolf">Lobo</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionTwo" id="specieDeer" value="Ciervo">
+              <label for="specieDeer">Ciervo</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionTwo" id="specieDuck" value="Pato">
+              <label for="specieDuck">Pato</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionTwo" id="specieCat" value="Gato">
+              <label for="specieCat">Gato</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionTwo" id="specieGoat" value="Cabra">
+              <label for="specieGoat">Cabra</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionTwo" id="specieBear" value="Oso">
+              <label for="specieBear">Oso</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionTwo" id="specieEagle" value="Águila">
+              <label for="specieEagle">Águila</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionTwo" id="specieHorse" value="Caballo">
+              <label for="specieHorse">Caballo</label> 
+            </li>
+          </ul>
+        </div>   
+        <hr/>
+        <div data-testid="select-filterPersonality" name="personality">
+          <label for="filterForPersonality"><h2>Personalidad</h2></label>
+          <ul>
+            <li>
+              <input type="radio" name="optionThree" id="personalityJock" value="Deportista">
+              <label for="personalityJock">Deportista</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionThree" id="personalityCranky" value="Gruñon">
+              <label for="personalityCranky">Gruñón</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionThree" id="personalityLazy" value="Perezoso">
+              <label for="personalityLazy">Perezoso</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionThree" id="personalitySmug" value="Esnob">
+              <label for="personalitySmug">Esnob</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionThree" id="personalitySweet" value="Dulce">
+              <label for="personalitySweet">Dulce</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionThree" id="personalityPeppy" value="Vivaracha">
+              <label for="personalityPeppy">Vivaracha</label> 
+            </li>
+            <li>
+              <input type="radio" name="optionThree" id="personalitySnooty" value="Altanera">
+              <label for="personalitySnooty">Altanera</label>
+                </li>
+              </ul>
+            </div>
+            <hr />
+            <div>
+              <button class="btn-clear" type="button" data-testid="button-clear">
+                Limpiar filtros
+              </button>
+            </div>
+          </aside>
+          <section>
+            <div class="container">
+              <div class="buscador">
+                <h2>Lista de vecinos</h2>
+                <div>
+                  <button class="btn-statics" id="openModal">
+                    <ion-icon name="stats-chart-outline"></ion-icon>
+                  </button>
+                </div>
+                <div>
+                  <label for="sort">Ordenar por:</label>
+                  <select name="sort" id="sort" data-testid="select-sort">
+                    <option value="all">Elige una opción</option>
+                    <option value="asc">Ordenar de la A-Z</option>
+                    <option value="desc">Ordenar de la Z-A</option>
+                  </select>
+                  <!-- este select esta oculto solo para que pase el test css -->
+                  <label for="sorthidden" hidden>Ordenar por:</label>
+                  <select name="sort" id="sorthidden" hidden></select>
+                  <input type="text" id="searchAnimal" placeholder="Buscar vecino"/>
+                  <button
+                    class="btn-clear-search"
+                    data-testid="button-clearName">
+                    Limpiar
+                  </button>
+                </div>
+              </div>
+              <div id="root"></div>
+              <div class="content-modal" id="modal">
+                <div class="modal-body">
+                  <div class="modal-header">
+                    <h1>Estadisticas</h1>
+                  </div>
+                  <div class="modal-main">
+                    <div id="centerModal">
+                      <div id="chart_div" style="padding-left: 100px"></div>
+                      <p id="page">texto</p>
+                    </div>
+                  </div>
+                  <div class="modal-footer">
+                    <button type="reset" id="close" class="btn-close">
+                      <ion-icon name="close-circle-outline"></ion-icon>
+                      Cerrar
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </section>
+        </main>
+    <!-- <footer></footer> -->
+    <footer>
+      <p>2024. All rights reserved</p>
+      <img src="./images/island.png" alt="island" width="100" />
+      <svg viewBox="0 -20 700 110" width="100%" height="110" preserveAspectRatio="none">
+        <path transform="translate(0, -20)" d="M0,10 c80,-22 240,0 350,18 c90,17 260,7.5 350,-20 v50 h-700" fill="#aaeaf0" />
+        <path d="M0,10 c80,-18 230,-12 350,7 c80,13 260,17 350,-5 v100 h-700z" fill="#86CFD5"/>
+      </svg>
+    </footer>
+    <script type="module" src="main.js"></script>
+    <script type="module" src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.esm.js"></script>
   </body>
-</html>
\ No newline at end of file
+</html>
+
+
diff --git a/src/info.html b/src/info.html
new file mode 100644
index 00000000..1e4003e1
--- /dev/null
+++ b/src/info.html
@@ -0,0 +1,112 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="shortcut icon" href="images/animal.jpg" type="image/x-icon">
+    <link rel="stylesheet" href="styleInfo.css">
+    <title>DATAVERSE</title>
+</head>
+<body>
+    <header >
+        <h1>
+          Tarjetas Animal Crossing
+        </h1>
+      </header>
+      
+      <article class="contentVisible" hidden="hidden" >
+      <h2>WIKINOOK</h2>
+        <p>Bienvenido a la wikinook, a continuación te explicaremos de que trata</p> 
+        <button type="button" id="continue">
+          <a href="#sectionOne">
+            <ion-icon name="caret-forward"></ion-icon>
+          </a>
+        </button>
+        <button type="button" id="following">
+          <a href="#sectionFour">SALTAR</a>
+        </button>
+    </article>
+    
+      <article id="sectionOne" hidden="until-found" class="contentHidden">
+        <h2 >WIKINOOK</h2>
+        <p>Aquí podrás encontrar diferentes vecinos de Animal Crossing y conocerlos mucho mejor</p>
+        <button type="button">
+          <a href="#sectionTwo"> <ion-icon name="caret-forward"></ion-icon></a></button>
+      </article>
+    
+      <article id="sectionTwo" hidden="until-found" class="contentHidden">
+        <p>Visualizarás a tus vecinos preferidos en tarjetas que guardan su información</p>
+        <figure><img src="https://areajugones.sport.es/wp-content/uploads/2020/09/cartas-amiibo-animal-crossing-2.jpg" alt="tajetas animal Crossing" ></figure>
+        <button type="button">
+          <a href="#sectionThree"><ion-icon name="caret-forward"></ion-icon></a>
+        </button>
+      </article>
+    
+      <article id="sectionThree" hidden="until-found" class="contentHidden">
+        <div>
+          <p>Podrás filtrarlos por especie, personalidad y hasta signo zodiacal</p>
+          <br/>
+          <p class="page">PERSONALIDAD</p>    
+          <div>
+            <input type="radio" name="checkSweet" id="checkOne"> 
+            <label for="checkOne">Dulce</label>
+          </div>
+        <div>
+          <input type="radio" name="checkSnooty" id="checkTwo"> 
+          <label for="checkTwo">Altanera</label>
+        </div>
+        <div>
+          <input type="radio" name="checkCranky" id="checkThree">
+          <label for="checkThree">Gruñona</label> 
+        </div>
+        <div>
+          <input type="radio" name="checkJock" id="checkFour">
+          <label for="checkFour">Deportiva</label> 
+        </div>
+        <div>
+          <input type="radio" name="checkLazy" id="checkFive">
+          <label for="checkFive">Perezosa</label> 
+        </div>
+        <div>
+          <input type="radio" name="checkSmug" id="checkSix">
+          <label for="checkSix">Esnob</label> 
+        </div>
+      <p class="page">ESPECIES</p>
+        <div>
+          <input type="radio" name="checkDog" id="dog"> 
+          <label for="dog">Perro</label>
+        </div>
+        <div>
+          <input type="radio" name="checkCat" id="cat"> 
+          <label for="cat">Gato</label>
+        </div>
+        <div>
+          <input type="radio" name="checkChicken" id="chicken"> 
+          <label for="chicken">Pollo</label>
+        </div>
+        <div>
+          <input type="radio" name="checkSquirrel" id="squirrel"> 
+          <label for="squirrel">Ardilla</label>
+        </div>
+        <div>
+          <input type="radio" name="checkMouse" id="mouse"> 
+          <label for="mouse">Ratón</label>
+        </div>
+      </div>
+    <div>
+      <button type="button" class="next">
+          <a href="#sectionFour"><ion-icon name="caret-forward"></ion-icon></a>
+      </button>
+    </div>
+      </article>
+    
+      <article id="sectionFour" hidden="until-found" class="contentHidden">
+        <h2>WIKINOOK</h2>
+        <p>¡Ahora si! ¿Puedes brindarnos tu nombre antes de comenzar? Te registraremos en un segundo...</p>
+        <input type="text" name="name" id="name" placeholder="Nombre">
+        <button type="button" class="infoAdditional"><a href="index.html"><ion-icon name="send"></ion-icon></a></button>
+      </article>
+
+      <script type="module" src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.esm.js"></script>    
+</body>
+</html>
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index c943ecdd..7ca5a709 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,6 +1,104 @@
-import { example } from './dataFunctions.js';
+
+import { computeStats, filterData, sortData } from './dataFunctions.js';
 import { renderItems } from './view.js';
 
 import data from './data/dataset.js';
 
-console.log(example, renderItems(data), data);
\ No newline at end of file
+renderItems(data);
+let filteredData;
+const navRoot = document.querySelector('#root'); 
+const buttonClearFilter = document.querySelector("button[data-testid='button-clear']"); 
+const inputSearchAnimal = document.getElementById("searchAnimal"); 
+const buttonClearName = document.querySelector("button[data-testid='button-clearName']"); 
+const order = document.querySelector("[data-testid='select-sort']");
+const filterGender = document.querySelector("[data-testid='select-filterGender']");
+const filterSpecie = document.querySelector("[data-testid='select-filter']");
+const filterPersonality = document.querySelector("[data-testid='select-filterPersonality']");
+filteredData = [...data];
+
+buttonClearFilter.addEventListener("click", () => {
+  navRoot.innerHTML = "";
+  order.selectedIndex = 0;
+  filteredData = [...data];
+  const radioButton = document.querySelectorAll('input[type="radio"]');
+  radioButton.forEach(item => item.checked = false);
+  renderItems(data);
+});
+
+order.addEventListener("change", (event) => {
+  navRoot.textContent = "";
+  filteredData = sortData(filteredData, "name", event.target.value);
+  renderItems(filteredData);
+});
+
+filterPersonality.addEventListener("click", (e) => {
+  if(!e.target.value) {
+    return;
+  }
+  navRoot.innerHTML = "";
+  filteredData = filterData(filteredData, "personality", e.target.value);
+  
+  renderItems(filteredData);
+});
+
+filterSpecie.addEventListener("click", (e) => {
+  if(!e.target.value) {
+    return;
+  }
+  navRoot.innerHTML = "";
+  filteredData =  filterData(filteredData, "species", e.target.value);
+  renderItems(filteredData);
+});
+
+filterGender.addEventListener("click", (e) => {
+  if(!e.target.value) {
+    return;
+  }
+  navRoot.innerHTML = "";
+  filteredData =  filterData(filteredData, "gender", e.target.value);
+  renderItems(filteredData);
+});
+
+const filterSearchNames = () => { 
+  navRoot.innerHTML = "";
+  const dataNames = inputSearchAnimal.value.toLowerCase() 
+  const filterNames = filteredData.filter(item => item.name.toLowerCase().includes(dataNames));
+  renderItems(filterNames); 
+}
+
+inputSearchAnimal.addEventListener("keyup", filterSearchNames); 
+buttonClearName.addEventListener("click", function(e) {
+  e.target.value = inputSearchAnimal.value = "";
+  navRoot.innerHTML = "";
+  renderItems(filteredData);
+});
+  
+const modal = document.querySelector("#modal");
+const closeModal = document.querySelector("#close");
+const openModal = document.querySelector("#openModal"); 
+
+openModal.addEventListener("click", function(event) {  
+  modal.style.display = "block";
+  const pageText = document.getElementById("page");
+  if (event.currentTarget === openModal) {
+    pageText.innerText = computeStats(data);
+  }
+});
+
+closeModal.addEventListener("click", ()=> {
+  modal.style.display = "none";
+});
+
+openModal.addEventListener("click", function(event) {  
+  modal.style.display = "block";
+  const pageText = document.getElementById("page");
+  if (event.currentTarget === openModal) {
+    pageText.innerText = computeStats(data);
+  }
+});
+
+closeModal.addEventListener("click", ()=> {
+  modal.style.display = "none";
+});
+
+
diff --git a/src/style.css b/src/style.css
index e69de29b..4e626d5c 100644
--- a/src/style.css
+++ b/src/style.css
@@ -0,0 +1,396 @@
+@font-face {
+  font-family: 'EncodeSansCondensedBold';
+  src: url('fonts/EncodeSans_Condensed-Bold.ttf') format('truetype');
+  font-weight: bold;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'EncodeSansCondensedRegular';
+  src: url('fonts/EncodeSans_Condensed-Regular.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'EncodeSansCondensedLight';
+  src: url('fonts/EncodeSans_Condensed-Light.ttf') format('truetype');
+  font-weight: lighter;
+  font-style: normal;
+}
+
+* {
+  padding: 0;
+  margin: 0;
+  font-family: "Encode Sans Condensed", sans-serif;
+  box-sizing: border-box;
+  font-family: "EncodeSansCondensedRegular", sans-serif;
+}
+header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 20px 10%;
+  border-bottom: 1px solid #e0e0e0;
+}
+.header-title {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.header-user {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.header-user img {
+  width: 3rem;
+}
+body {
+  background-color: #f7f3e7;
+}
+footer {
+  position: fixed;
+  width: 100%;
+  height: 150px;
+  bottom: 0;
+  overflow: hidden;
+}
+footer p {
+  position: absolute;
+  bottom: 0;
+  padding: 1.5rem;
+  color: white;
+  font-weight: bold;
+  z-index: 2;
+}
+footer svg {
+  position: absolute;
+  bottom: 0;
+  z-index: 1;
+}
+footer img {
+  position: absolute;
+  right: 10px;
+  bottom: 10px;
+  z-index: 2;
+}
+aside {
+  padding: 3rem 3rem 3rem 10%;
+}
+main {
+  display: flex;
+  margin-bottom: 100px;
+}
+section {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+hr {
+  border: 1px solid #e0e0e0;
+  margin: 1rem 0;
+}
+ul {
+  list-style: none;
+}
+ul .cardList {
+  display: flex;
+  gap: 1rem;
+  flex-wrap: wrap;
+  justify-content: center;
+  margin: 0
+}
+.buscador {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin: 1rem 0;
+  padding: 1rem;
+}
+
+@media (max-width: 600px) {
+  /* CSS rules for sizes smaller than 600px */
+  header {
+    padding: 10px 5%;
+  }
+  aside {
+    padding: 1.5rem;
+    display: none;
+  }
+  main {
+    flex-direction: column;
+  }
+  section {
+    width: 100%;
+  }
+  .buscador h2 {
+    display: none;
+  }
+  .buscador div {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+  }
+}
+
+.card {
+  width: 184px;
+  height: 279px;
+  display: flex;
+  background-size: cover;
+}
+.cardGrunon {
+  background-image: url("./images/cardGruñon.png");
+}
+.cardPerezoso {
+  background-image: url("./images/cardPerezoso.png");
+}
+.cardDeportista {
+  background-image: url("./images/cardDeportista.png");
+}
+.cardAltanera {
+  background-image: url("./images/cardAltanera.png");
+}
+.cardDulce {
+  background-image: url("./images/cardDulce.png");
+}
+.cardEsnob {
+  background-image: url("./images/cardEsnob.png");
+}
+.cardVivaracha {
+  background-image: url("./images/cardVivaracha.png");
+}
+.bodyCard {
+  flex: 1;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  height: 147px;
+}
+.headerCard {
+  display: flex;
+  justify-content: space-between;
+  padding: 1rem 1rem 0 1rem;
+}
+dd[itemprop="gender"] {
+  width: 30px;
+  height: 30px;
+  background-size: cover;
+  border-radius: 7px;
+}
+.genderFemale {
+  background-image: url("./images/female.png");
+}
+.genderMale {
+  background-image: url("./images/male.png");
+}
+dd[itemprop="zodiacSign"] {
+  width: 30px;
+  height: 30px;
+  background-size: cover;
+  border-radius: 7px;
+}
+.signCancer {
+  background-image: url("./images/zodiacs/Cancer.png");
+}
+.signCapricorn {
+  background-image: url("./images/zodiacs/Capricornio.png");
+}
+.signAries {
+  background-image: url("./images/zodiacs/Aries.png");
+}
+.signLibra {
+  background-image: url("./images/zodiacs/Libra.png");
+}
+.signAquarius {
+  background-image: url("./images/zodiacs/Acuario.png");
+}
+.signSagittarius {
+  background-image: url("./images/zodiacs/Sagitario.png");
+}
+.signScorpio {
+  background-image: url("./images/zodiacs/Escorpio.png");
+}
+.signPisces {
+  background-image: url("./images/zodiacs/Picis.png");
+}
+.signLeo {
+  background-image: url("./images/zodiacs/Leo.png");
+}
+.signGeminis {
+  background-image: url("./images/zodiacs/Geminis.png");
+}
+.signVirgo {
+  background-image: url("./images/zodiacs/Virgo.png");
+}
+.signTaurus {
+  background-image: url("./images/zodiacs/Tauro.png");
+}
+.footerCard {
+  color: #f7f3e7;
+  padding: 1rem;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+dt {
+  display: none;
+}
+dl {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+}
+.date {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 0.5rem;
+  font-weight: bold;
+}
+.date img {
+  width: 24px;
+  height: 24px;
+}
+.information {
+  display: flex;
+  justify-content: space-between;
+  border-bottom: 2px solid white;
+  align-items: flex-end;
+}
+#root ul {
+  display: flex;
+  gap: 1rem;
+  flex-wrap: wrap;
+}
+.bodyCard img {
+  max-width: 147px;
+  max-height: 164px;
+}
+dd[itemprop="name"]{
+  color: rgb(255, 255, 255);
+  font-size: 20px;
+  font-weight: bold;
+}
+dd[itemprop="species"]{
+  width: 48px;
+  overflow: hidden;
+  text-align: left;
+}
+dd[itemprop="personality"]{
+  width: 48px;
+  overflow: hidden;
+  text-align: right;
+}
+.container {
+  max-width: 790px;
+  width: 790px;
+  height: 100%;
+}
+.content-modal {/*lo ocupo para el modal*/
+  display: none;
+  position: fixed;
+  z-index: 1;  
+  left: 0; top: 0;
+  width: 100%;
+  height: 100%;
+  overflow: auto;
+  background-color: rgb(0, 0, 0, 0.5);
+  align-items: center;
+  justify-content: center;
+}
+#page {/*esto se puede modificar*/
+  font-size: 28px;
+}
+#close {
+  cursor: pointer;
+}
+select {
+  padding: 0.5rem;
+  border-radius: 5px;
+  border: 1px solid #e0e0e0;
+}
+input[type="text"] {
+  padding: 0.5rem;
+  border-radius: 5px;
+  border: 1px solid #e0e0e0;
+}
+.buscador div {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.btn-clear,.btn-clear-search {
+  background-color: #8ac68a;
+  border-radius: 8px;
+  border-style: none;
+  color: #FFFFFF;
+  cursor: pointer;
+  font-size: 16px;
+  padding: 10px 16px;
+  text-align: center;
+  position: relative;
+  z-index: 1;
+}
+.btn-clear-search {
+  padding: 0.4rem 0.5rem;
+  border-radius: 5px;
+}
+.btn-clear:hover,.btn-clear:focus,
+.btn-clear-search:hover,.btn-clear-search:focus {
+  background-color: #7ab37a;
+}
+.btn-statics{
+  background-color: #8ac68a;
+  border-radius: 8px;
+  border-style: none;
+  color: #FFFFFF;
+  cursor: pointer;
+  font-size: 16px;
+  padding: 10px 16px;
+  text-align: center;
+  position: relative;
+  z-index: 1;
+}
+.modal-body {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  width: 50%;
+  height: 600px;
+  background-color: #fff;
+  border: 1px solid rgba(0,0,0,.2);
+  border-radius: 0.3rem;
+}
+.modal-header {
+  padding: 1rem;
+  border-bottom: 1px solid #e9ecef;
+  text-align: center;
+}
+.modal-main {
+  flex: 1;
+  padding: 0 1rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.modal-footer {
+  padding: 1rem;
+  display: flex;
+  flex-direction: row-reverse;
+}
+.btn-close {
+  background-color: #fc736d;
+  border-radius: 8px;
+  border-style: none;
+  color: #FFFFFF;
+  cursor: pointer;
+  font-size: 16px;
+  padding: 10px 16px;
+  text-align: center;
+  display: flex;
+  gap: 5px;
+  align-items: center;
+}
\ No newline at end of file
diff --git a/src/styleInfo.css b/src/styleInfo.css
new file mode 100644
index 00000000..88c88e21
--- /dev/null
+++ b/src/styleInfo.css
@@ -0,0 +1,85 @@
+/*estos se utilizan para que no aparezca el contenido del HTML hasta que le das clic al botón*/
+* {
+    padding: 0;
+    margin: 0;
+    box-sizing: border-box;
+}
+h1 {
+    color: rgb(11, 10, 12);
+    text-align: center;
+    font-size: 14px;
+}
+p {
+    font-size: 14px;
+}
+.page {
+    font-size: 16px;
+    color: black;
+}
+label {
+    font-size: 14px;
+}
+.next {
+    font-size: 18px;
+    display: flex;
+    align-items: center;
+}
+body {
+    background-image: url(../src/images/fondo.webp);
+    background-size: cover;
+}
+img {
+    height: 150px;
+    width: 150px;
+}
+.contentVisible {
+    display: block;
+    font-size: 48px;
+    text-align: center;
+    
+}
+.contentHidden {
+    font-size: 48px;
+    text-align: center;
+    display: none;
+}
+.contentHidden:target {
+    display: block;
+}
+.contentVisible:target {
+    display: none;
+}
+@media (min-width: 1200px) {
+    h1 {
+        color: rgb(11, 10, 12);
+        text-align: center;
+        font-size: 60px;
+    }
+    h2 {
+        font-size: 60px;
+    }
+    body {
+      background-color:beige;
+    }
+    p {
+        font-size: 32px;
+        font-family: Arial, Helvetica, sans-serif;
+    }
+    button {
+        font-size: 22px;
+    }
+    #name {
+        font-size: 22px;
+    }
+    img {
+        width: 400px;
+        height: 400px;
+    }
+    .page {
+        font-size: 34px;
+        color: black;
+    }
+    label {
+        font-size: 32px;
+    }
+}
\ No newline at end of file
diff --git a/src/styleLaptop.css b/src/styleLaptop.css
new file mode 100644
index 00000000..2ce395b7
--- /dev/null
+++ b/src/styleLaptop.css
@@ -0,0 +1,350 @@
+@media (min-width: 1200px) {
+  body {
+    font-size: 16px;
+    background-color: #f7f3e7;
+    /*
+    font-family: Arial, Helvetica, sans-serif;
+    background: linear-gradient(to bottom, #F5EFE3, #FEE9D7 90%, #5cc0d4 100%, #02bdd6);*/
+  }
+  header h1{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    /*
+    -webkit-text-stroke-width: 3px;
+    -webkit-text-stroke-color: rgb(218, 65, 65);
+    font-size: 24px;
+    font-size: x-large;
+    color: yellow;
+    text-align: center;*/
+  }
+  footer {
+    position: fixed;
+    width: 100%;
+    height: 150px;
+    bottom: 0;
+    overflow: hidden;
+  }
+  footer p {
+    position: absolute;
+    bottom: 0;
+    padding: 1.5rem;
+    color: rgb(7, 7, 7);
+    font-weight: bold;
+    z-index: 2;
+  }
+  
+  footer svg {
+    position: absolute;
+    bottom: 0;
+    z-index: 1;
+  }
+  
+  footer img {
+    position: absolute;
+    right: 10px;
+    bottom: 10px;
+    z-index: 2;
+  }
+  aside {
+    padding: 3rem 3rem 3rem auto;
+  }
+  hr {
+    border: 1px solid #e0e0e0;
+    margin: 1rem 0;
+  }
+  #containerOrder {
+    display: flex;
+    flex-direction: row-reverse;
+  }
+  ul {
+    display: flexbox;
+    list-style: none;
+  }
+  .card {
+    margin-left: 90px;
+    float: left;
+    margin-bottom: 20px;
+    width: 200px;
+    height: 300px;
+    display: flex;
+    background-size: cover;
+    position: relative; left: 80px; top: -950px;
+    text-align: center;
+  }
+.Gruñón {
+    background-image: url(images/cardGruñon.png) !important;
+}
+.Altanera {
+    background-image: url(images/cardAltanera.png);
+}
+.Deportista {
+    background-image: url(images/cardDeportista.png);
+}
+.Perezoso {
+    background-image: url(images/cardPerezoso.png);
+}
+.Esnob {
+    background-image: url(images/cardEsnob.png);
+}
+
+.Dulce {
+    background-image: url(images/cardDulce.png);
+}
+.Vivaracha {
+    background-image: url(images/cardVivaracha.png);
+}
+.img {
+    height: 200px;
+    width: 150px;
+    margin-left: 30px;
+    margin-top: 1px;
+  }
+  dl {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+  }
+  dd {
+    width: 50%;
+    height: 18px;
+    border-radius: 8px;
+  }
+  dd[itemprop="name"]{
+    font-size: 20px;
+    font-weight: bold;
+    padding-left: 35%;
+  }
+  /*dd[itemprop="gender"] {
+    
+    background-size: cover;
+    border-radius: 7px;
+    display: flex;
+    justify-content: space-between;
+    padding: 1rem 1rem 0 1rem;
+  }*/
+  /*
+  .Femenino {
+    background-size: cover;
+    border-radius: 7px;
+    background-size: 30px;
+    background-repeat: no-repeat;
+    background-image: url(images/female.png);
+  }*/
+  /*
+  .Masculino {
+    background-size: 30px;
+    background-repeat: no-repeat;
+    background-image: url(images/male.png);
+  }*/
+  dd[itemprop="species"] {
+    display: flex;
+    float: right; 
+    position: relative; left: 40px;
+    margin-top: 2px;
+  }
+  dd[itemprop="birthDate"] {
+    display: flex;
+    text-align: center;
+  }
+  dd[itemprop="personality"] {
+    padding: auto 1px;
+    display: flex;
+    text-align: center;
+    justify-content: space-between;
+    font-weight: 200;
+  }
+  dt {
+    display: none;
+  }
+  p {/*la uso para info html*/
+    font-size: 20px;
+  }
+  #info {/*falta centrar el icono al texto*/
+    padding: 4px 12px;
+    text-decoration: none;
+    background-color: transparent;
+    letter-spacing: 2px;
+    font-size: 18px;
+    border: 1px solid rgb(128, 128, 214);
+    cursor: pointer;
+    transition: all 0.6s ease; /*para ver mas lento la transicion del color al poner el mouse encima*/
+    text-transform: uppercase;
+  }
+  #info:hover{
+    background-color: rgb(54, 190, 210);
+    box-shadow: 0 0 20px rgb(117, 110, 110);
+  }
+  [name="help-circle-outline"] {
+  
+    font-size: 14px;
+  }
+  #search {/*contenedor de buscar por nombre*/
+    display: flex;
+    padding: 1px 4px;
+    font-size: 12px;
+    font-family: Arial, Helvetica, sans-serif;
+    margin-top: 10px;
+    margin-left: 30%;
+    justify-content: end;
+  
+  }
+  [data-testid="button-clearName"] {/*contenedor de buscar por nombre, botón para borrar el nombre*/
+    letter-spacing: 2px;
+    background-color: rgba(93, 91, 89, 0.3);
+    border-radius: 4px;
+    font-size: 11px;
+    margin: 2px;
+  }
+  label {/*contenedor de buscar por nombre, input del texto*/
+    font-size: 14px;
+    padding: 1px 4px;
+  }
+  #personage { /*h2 titulo personajes*/
+    margin: 6px;
+    font-size: 18px;
+    text-align: center;
+    border-top: 1px solid black;/*línea divisora entre personajes y buscar*/
+  }
+  .container-nav{ /*contenedor de los filtros*/
+    position: sticky;
+    line-height: 30px;/*espaciado entre palabras en los filtros*/
+  }
+  label[for=filter], label[for=filterForSpecies], label[for=filterForPersonality] {/*grosor de letras*/
+    font-weight: 800; 
+  }
+  /*
+  [data-testid="select-filterGender"] {/*filtro por genero*
+    top: 100px;
+    bottom: 0;
+    right: 0;
+    left: 200px;
+    font-size: 1em;
+    list-style: none;
+    /*border-top: 1px solid black;*
+    margin-top: 4px;/*separado de arriba*
+    margin-bottom: 12px; /*separado entre los apartados género, especie*
+    margin-left: 8px;/*espacio a la izquierda*
+    margin-right: 80%;/*espacio a la derecha checar porque solo funciona con porcentaje*
+  }
+  [data-testid="select-filter"] {/*filtro por especies*
+    top: 100px;
+    bottom: 0;
+    right: 0;
+    left: 200px;
+    font-size: 1em;
+    list-style: none;
+    /*border-top: 1px solid black;*
+    margin-top: 4px;/*separado de arriba*
+    margin-bottom: 12px; /*separado entre los partados género, especie*
+    margin-left: 8px;/*espacio a la izquierda*
+    margin-right: 80%;/*espacio a la derecha checar porque solo funciona con porcentaje*
+  }
+  [data-testid="select-filterPersonality"] {
+    top: 100px;
+    bottom: 0;
+    right: 0;
+    left: 200px;
+    font-size: 1em;
+    list-style: none;
+    /*border-top: 1px solid black;*
+    margin-top: 4px;/*separado de arriba*
+    margin-bottom: 12px; /*separado entre los partados género, especie*
+    margin-left: 8px;/*espacio a la izquierda*
+    margin-right: 80%;/*espacio a la derecha checar porque solo funciona con porcentaje* 
+  }*/
+  [data-testid="button-clear"] {
+    margin-top: 20px;
+    margin-bottom: 50px;
+    padding: 6px 12px;
+    letter-spacing: 2px;
+    border-radius: 10px;
+    cursor: pointer;
+  }
+  /*#root ul{
+    display: flex;
+    flex-wrap: wrap;
+    gap: 1rem;
+    grid-template-rows: 1fr 1fr 1fr;
+    list-style: none;
+    padding: 1rem;
+    justify-content: space-between;
+    align-items: center;
+  }
+  dd[itemprop]{
+    box-sizing: content-box;
+    width: 180px;
+    display: flex;
+    /*display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));*
+    flex: 1;
+    justify-content: center;
+    background-color: rgb(248, 106, 182);
+  }
+  #root dl img {
+    width: 100%;
+    height: auto;
+    background: url(images/cardDulce.png);
+    background-size: cover;
+    transition: 300ms;
+    filter: drop-shadow(5px -4px 10px #000);
+  }
+  dt {/*quitar valores nombre, genero, etc*
+    display: none;
+  }*/
+  .content-modal {
+    display: none;  
+    position: fixed;
+    z-index: 1;  
+    padding-top: 200px;
+    left: 0; top: 0;
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+    background-color: rgb(0, 0, 0, 0.5);
+}
+  #page {
+    font-size: 28px;
+    font-weight: 800 ;
+  }
+  .buttonOpenModal{
+    cursor: pointer;
+    justify-content: center;
+    float: left;    
+    font-size: 50px;
+  }
+  #close {
+    cursor: pointer;
+  }
+  
+  /*
+  #openModal {
+    border-radius: 8px;
+    cursor: pointer;
+    background: rgba(78, 76, 76, 0.3);
+    font-size: 30px;
+    display: flex;
+    position: relative; top: -1150px; left: -600px;
+  }
+  .content-modal {
+    display: none;
+    padding: 20px;
+    align-items: center;
+  }
+  #centerModal {
+    flex-direction: row-reverse;
+  }
+  #close {
+    font-size: 28px;
+  }*/
+  #seeMoreModal {/*para quitar el borde y subrayar el texto del boton*/
+    color: blue;
+    border: none;
+    text-decoration: underline;
+    background-color: transparent;
+    font-weight: 600;
+    cursor: pointer;
+    display: flex;
+    float: right;
+  }
+  }
diff --git a/src/styleTablet.css b/src/styleTablet.css
new file mode 100644
index 00000000..771010a7
--- /dev/null
+++ b/src/styleTablet.css
@@ -0,0 +1,25 @@
+@media (min-width: 600px){
+    body {
+        font-size: 16px;
+        background: linear-gradient(to bottom, #F5EFE3, #FEE9D7 90%, #61d2e7 100%, #02bdd6);
+    }   
+    h1 {  
+        font-size: 28px;
+        color: rgb(164, 116, 219);
+        text-align: center;
+    }
+    footer {
+        font-size: 18px;
+        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+        color: gray;
+        text-align: end;
+    }
+    p {
+        font-size: 16px;
+    }
+    #root img {
+        width: 150px;
+        height: 200px;
+    }
+}
+/*Este color es de prueba, para ver la diferencia al hacer más pequeña la panatalla y ver como cambia*/
\ No newline at end of file
diff --git a/src/view.js b/src/view.js
index 686f5ef9..f41b55b0 100644
--- a/src/view.js
+++ b/src/view.js
@@ -1,5 +1,173 @@
 export const renderItems = (data) => {
-  console.log(data)
-  // Aquí comienza tu código y puedes retornar lo que tu necesites
-  return 'example';
+  const navRoot = document.getElementById("root");
+  const listUl = document.createElement("ul");
+  data.forEach((element) => {
+    const listLi = document.createElement("li");
+    listUl.appendChild(listLi);
+    listLi.setAttribute('itemscope','')
+    listLi.setAttribute('itemtype', 'https://schema.org/Game')
+    listLi.className = "cardList"
+    const divCard = document.createElement("div");
+    divCard.className = "card";
+    if (element.personality === "Gruñon") {
+      divCard.classList.add("cardGrunon");
+    }
+    if (element.personality === "Deportista") {
+      divCard.classList.add("cardDeportista");
+    }
+    if (element.personality === "Altanera") {
+      divCard.classList.add("cardAltanera");
+    }
+    if (element.personality === "Dulce") {
+      divCard.classList.add("cardDulce");
+    }
+    if (element.personality === "Perezoso") {
+      divCard.classList.add("cardPerezoso");
+    }
+    if (element.personality === "Esnob") {
+      divCard.classList.add("cardEsnob");
+    }
+    if (element.personality === "Vivaracha") {
+      divCard.classList.add("cardVivaracha");
+    }
+    listLi.appendChild(divCard);
+
+    const dl = document.createElement("dl");
+    divCard.appendChild(dl);
+
+    const divHeader = document.createElement("div");
+    divHeader.className = "headerCard";
+    dl.appendChild(divHeader);
+
+    const divBody = document.createElement("div");
+    divBody.className = "bodyCard";
+    dl.appendChild(divBody);
+
+    const divFooter = document.createElement("div");
+    divFooter.className = "footerCard";
+    dl.appendChild(divFooter);
+
+    // Cabecera
+    const dtGender = document.createElement("dt");
+    dtGender.innerText = "Genero";
+    divHeader.appendChild(dtGender);
+
+    const ddGender = document.createElement("dd");
+    ddGender.setAttribute("itemprop", "gender");
+    if (element.gender === "Femenino") {
+      ddGender.classList.add("genderFemale");
+    } else {
+      ddGender.classList.add("genderMale");
+    }
+    divHeader.appendChild(ddGender);
+
+    const dtSign = document.createElement("dt");
+    dtSign.innerText = "Signo";
+    divHeader.appendChild(dtSign);
+
+    const ddSign = document.createElement("dd");
+    ddSign.setAttribute("itemprop", "zodiacSign");
+    switch (element.facts.zodiacSign) {
+    case "Libra":
+      ddSign.classList.add("signLibra");
+      break;
+    case "Aries":
+      ddSign.classList.add("signAries");
+      break;
+    case "Capricornio":
+      ddSign.classList.add("signCapricorn");
+      break;
+    case "Acuario":
+      ddSign.classList.add("signAquarius");
+      break;
+    case "Leo":
+      ddSign.classList.add("signLeo");
+      break;
+    case "Virgo":
+      ddSign.classList.add("signVirgo");
+      break;
+    case "Piscis":
+      ddSign.classList.add("signPisces");
+      break;
+    case "Cancer":
+      ddSign.classList.add("signCancer");
+      break;
+    case "Sagitario":
+      ddSign.classList.add("signSagittarius");
+      break;
+    case "Escorpio":
+      ddSign.classList.add("signScorpio");
+      break;
+    case "Geminis":
+      ddSign.classList.add("signLibra");
+      break;
+    case "Tauro":
+      ddSign.classList.add("signTaurus");
+      break;
+    default:
+      break;
+    }
+    divHeader.appendChild(ddSign);
+
+    // Body
+    const image = document.createElement("img");
+    image.setAttribute("alt", element.name);
+    image.setAttribute("src", element.imageUrl);
+    divBody.appendChild(image);
+
+    // Footer
+    const divInfo = document.createElement("div");
+    divInfo.className = "information";
+    divFooter.appendChild(divInfo);
+
+    const dtSpecie = document.createElement("dt");
+    dtSpecie.innerText = "Especie";
+    divInfo.appendChild(dtSpecie);
+
+    const ddSpecie = document.createElement("dd");
+    ddSpecie.setAttribute("itemprop", "species");
+    ddSpecie.innerText = element.species;
+    divInfo.appendChild(ddSpecie);
+
+    const dtName = document.createElement("dt");
+    dtName.innerText = "Nombre";
+    divInfo.appendChild(dtName);
+
+    const ddName = document.createElement("dd");
+    ddName.setAttribute("itemprop", "name");
+    ddName.innerText = element.name;
+    divInfo.appendChild(ddName);
+
+    const dtPersonality = document.createElement("dt");
+    dtPersonality.innerText = "Personalidad";
+    divInfo.appendChild(dtPersonality);
+
+    const ddPersonality = document.createElement("dd");
+    ddPersonality.setAttribute("itemprop", "personality");
+    let personality = element.personality;
+    if (personality.length > 5) {
+      personality = personality.substring(0, 5) + "..";
+    }
+    ddPersonality.innerText = personality;
+    divInfo.appendChild(ddPersonality);
+
+    const divDate = document.createElement("div");
+    divDate.className = "date";
+    divFooter.appendChild(divDate);
+
+    const cake = document.createElement("img");
+    cake.setAttribute("alt", "cake");
+    cake.setAttribute("src", "./images/Pastel de cumple.png");
+    divDate.appendChild(cake);
+
+    const dtBirthday = document.createElement("dt");
+    dtBirthday.innerText = "Cumpleaños";
+    divDate.appendChild(dtBirthday);
+
+    const ddBirthday = document.createElement("dd");
+    ddBirthday.setAttribute("itemprop", "birthDate");
+    ddBirthday.innerText = element.facts.birthDate;
+    divDate.appendChild(ddBirthday);
+  });
+  return navRoot.appendChild(listUl);
 };
\ No newline at end of file
diff --git a/test/.eslintrc b/test/.eslintrc
index 55f121d1..7bc296da 100644
--- a/test/.eslintrc
+++ b/test/.eslintrc
@@ -2,4 +2,4 @@
   "env": {
     "jest": true
   }
-}
+}
\ No newline at end of file
diff --git a/test/data.js b/test/data.js
index 077a202a..cc43e621 100644
--- a/test/data.js
+++ b/test/data.js
@@ -1,52 +1,61 @@
-// Aqui puedes agregar los datos que necesites para tus pruebas
-// al menos debe tener uno que se llame "data"
-
 export const data = [{
-  "id": "ada-lovelace",
-  "name": "Ada Lovelace",
-  "shortDescription": "Pionera en la programación, primera programadora de la historia.",
-  "description": "Una visionaria matemática británica del siglo XIX, es aclamada como la primera programadora de la historia. Su colaboración con Charles Babbage en la creación de la Máquina Analítica la llevó a desarrollar algoritmos, incluyendo el famoso \"algoritmo de Bernoulli\", destinados a ser procesados por una máquina. Su visión pionera la convirtió en una figura fundamental en la informática y la inteligencia artificial. Lovelace demostró que las computadoras podían ir más allá de simples cálculos matemáticos, anticipando un mundo donde la programación sería esencial en la resolución de problemas complejos, dejando una huella imborrable en la ciencia y la tecnología.",
-  "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/ada-lovelace.jpg",
-  "facts": {
-    "yearOfBirth": "1815",
-    "yearOfDeath": "1852",
-    "birthPlace": "Londres, Reino Unido",
-    "mainField": "Ciencia de la Computación"
+  id: "beaDog",
+  name: "Bea",
+  species: "Perro",
+  personality: "Dulce",
+  gender: "Femenino",
+  shortDescription: "Perro deportista y enérgico, amante del ejercicio y las competiciones.",
+  description: "Bea es un perro orgulloso y elegante que se considera a sí misma una autoridad en moda y alta sociedad en Animal Crossing. Siempre está al tanto de las últimas tendencias y eventos de la alta sociedad. Bea se enorgullece de su elegancia y buen gusto, y a menudo ofrece consejos de moda a los demás habitantes. Aunque puede parecer algo distante al principio, aprecia la amistad genuina y siempre está dispuesta a ayudar a sus amigos. ¡Celebra su cumpleaños el 15 de octubre!",
+  imageUrl:"https://dodo.ac/np/images/thumb/c/c2/Bea_NH.png/150px-Bea_NH.png",
+  facts: {
+    zodiacSign: "Leo",
+    catchPhrase: "¡A darlo todo!",
+    birthDate: "15 de octubre",
   },
-  "extraInfo": {
-    "imageSource": "https://www.bing.com/images/create/genera-una-imagen-de-ada-lovelace2c-la-primera-prog/650a1eff8ff04b88833d5cdef0309441"
-  }
 },
 {
-  "id": "emmy-noether",
-  "name": "Emmy Noether",
-  "shortDescription": "Matemática destacada, teorema fundamental en álgebra abstracta.",
-  "description": "Una brillante matemática alemana, revolucionó la física teórica con sus contribuciones al teorema de conservación de la energía y el teorema de Noether, fundamentales en la teoría de la relatividad y la mecánica cuántica. A pesar de los obstáculos que enfrentó como mujer en la academia, sus investigaciones en álgebra abstracta y teoría de grupos son fundamentales en la física moderna. Su capacidad para unificar conceptos matemáticos y físicos marcó un hito en la historia de la ciencia, allanando el camino para futuras generaciones de científicas.",
-  "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/emmy-noether.jpg",
-  "facts": {
-    "yearOfBirth": "1882",
-    "yearOfDeath": "1935",
-    "birthPlace": "Erlangen, Alemania",
-    "mainField": "Matemáticas"
+  id: "biskitDog",
+  name: "Biskit",
+  species: "Perro",
+  personality: "Perezoso",
+  gender: "Masculino",
+  shortDescription: "Perro despreocupado y amante de las galletas, siempre con un hambre insaciable.",
+  description: "Biskit es un perro despistado con una personalidad relajada y amigable en Animal Crossing. Siempre parece estar en su propio mundo y es conocido por su actitud despreocupada. A menudo se le encuentra tarareando melodías alegres y disfrutando de la vida sin preocupaciones. Biskit es fácil de llevar y se lleva bien con otros habitantes del pueblo. Su catchphrase es '¡bork!', reflejando su naturaleza canina. Aunque su cabeza pueda estar en las nubes, su corazón está siempre en el lugar correcto, y es un amigo leal para todos en el pueblo. Biskit celebra su cumpleaños el 13 de mayo.",
+  imageUrl: "https://dodo.ac/np/images/thumb/7/78/Biskit_NH.png/150px-Biskit_NH.png",
+  facts: {
+    zodiacSign: "Piscis",
+    catchPhrase: "¡Guau galleta!",
+    birthDate: "13 de mayo",
   },
-  "extraInfo": {
-    "imageSource": "https://www.bing.com/images/create/create-an-image-of-of-a-german-woman2c-a-pioneering/6510ddb1e8254b928b8f8f1d5e95fea4"
-  }
 },
 {
-  "id": "hypatia-de-alejandria",
-  "name": "Hypatia de Alejandría",
-  "shortDescription": "Matemática y filósofa en la antigua Alejandría.",
-  "description": "Filósofa y matemática en la antigua Alejandría, desafió las normas de género de su época al destacar en una sociedad dominada por hombres. Su legado incluye importantes contribuciones a la geometría y la astronomía, así como su destacado papel como maestra y defensora del conocimiento en una época de agitación política. Hypatia demostró que las mujeres podían sobresalir en campos intelectuales y su valentía al mantener sus creencias filosóficas la convierte en un símbolo de resistencia y sabiduría en la historia de la ciencia.",
-  "imageUrl": "https://laboratoria-dataverse-talks.netlify.app/public/hypatia-de-alejandria.jpg",
-  "facts": {
-    "yearOfBirth": "circa 360",
-    "yearOfDeath": "415",
-    "birthPlace": "Alejandría, Egipto",
-    "mainField": "Matemáticas, Filosofía"
+  id: "der11",
+  name: "Yuki",
+  species: "Ciervo",
+  personality: "Vivaracha",
+  gender: "Femenino",
+  imageUrl: "https://dodo.ac/np/images/2/26/Shino_amiibo.png",
+  shortDescription: "Yuki es una aldeana ciervo animada en la serie Animal Crossing",
+  description: "Yuki en una cierva de color blanco amarillento con un hocico de color blanco y pesuñas de color dorado. Yuki tiene unos ojos alargados de color amarillo con una sombra de ojos de color rojo del estilo Hikimayu, además de unos pequeños colmillos que sobresalen de su boca y podrían indicar que pertenece a la especie del ciervo de copete. El diseño de Shino parece estar inspirado por máscaras del teatro Noh japonés, más concretamente a la mascara de los Hannya, demonios de mujeres consumidas por los celos.",
+  facts: {
+    zodiacSign: "Libra",
+    birthDate: "31/10",
+    catchPhrase: "oni"
   },
-  "extraInfo": {
-    "imageSource": "https://www.bing.com/images/create/create-a-vivid-digital-artwork-or-painting-that-de/6510df0ebe1a4807af22175452761e1a"
-  }
-},];
-
+},
+{
+  id: "goa09",
+  name: "Morfeo",
+  species: "Cabra",
+  personality: "Perezoso",
+  gender: "Masculino",
+  imageUrl: "https://dodo.ac/np/images/thumb/1/18/Sherb_NH.png/150px-Sherb_NH.png",
+  shortDescription: "Morfeo es un aldeano cabra perezoso en la serie Animal Crossing",
+  description: "Morfeo tiene la personalidad vaga, por lo que será amigable y fácil de tratar debido a su estilo de vida relajado. Como a todos los vecinos vagos, a Morfeo le encanta comer y el descansar, disfrutará de participar en sus pasatiempos comunes, que generalmente tienen que ver con relajarse o comer, como la pesca. Morfeo se llevará bien con los otros vecinos, pero puede ofender o confundir a los vecinos deportistas, que tienen un estilo de vida de lleno de ejercicio y de buen estado físico, en comparación con el estilo de vida perezoso de Morfeo.",
+  facts: {
+    zodiacSign: "Capricornio",
+    birthDate: "18/1",
+    catchPhrase: "bostezzz",
+  },
+},
+];
\ No newline at end of file
diff --git a/test/dataFunctions.spec.js b/test/dataFunctions.spec.js
index 72c5eb9d..4b853c3d 100644
--- a/test/dataFunctions.spec.js
+++ b/test/dataFunctions.spec.js
@@ -1,18 +1,35 @@
-import { example, anotherExample } from '../src/dataFunctions.js';
+import { computeStats, filterData, sortData } from '../src/dataFunctions.js';
 import { data as fakeData } from './data.js';
 
-console.log(fakeData);
+const testData = [fakeData[1], fakeData[3], fakeData[2], fakeData[0]];
+const expectDataAsc = [fakeData[0], fakeData[1], fakeData[3], fakeData[2]];
+const expectDataDesc = [fakeData[2], fakeData[3], fakeData[1], fakeData[0]];
+const testDataFilterFe = [fakeData[0], fakeData[2]];
+const filterSpecies = [fakeData[0], fakeData[1]];
+const filterPersonality = [fakeData[1], fakeData[3]];
+const statsText = "Porcentaje personajes masculinos: 50.00% " + "\nPorcentaje personajes femeninos: 50.00%";
 
-describe('example', () => {
-
-  it('returns `example`', () => {
-    expect(example()).toBe('example');
-  });
+describe('Ordenar la data "asc"', () => {
+  it('Debería ordenarse de forma ascendente y descendente', () => {
+    expect(sortData(testData, "name", "asc")).toEqual(expectDataAsc);
+    expect(sortData(testData, "name", "desc")).toEqual(expectDataDesc);
+  });  
 });
 
-describe('anotherExample', () => {
+describe("Filtrar la data por especie, por género y por personalidad", () => {
+  it("Debería filtrar los animales por género", () => {
+    expect(filterData(fakeData, "gender", "Femenino")).toEqual(testDataFilterFe);   
+  })
+  it("Debería filtrar los animales por especie", () => {
+    expect(filterData(fakeData, "species", "Perro")).toEqual(filterSpecies);   
+  })
+  it("Debería filtrar los animales por personalidad", () => {
+    expect(filterData(fakeData, "personality", "Perezoso")).toEqual(filterPersonality);   
+  })
+})
 
-  it('returns `anotherExample`', () => {
-    expect(anotherExample()).toBe('OMG');
-  });
-});
+describe("Estadística númerica por género de los personajes", () => {
+  it("Debería darnos el porcentaje de personajes femeninos", () => {
+    expect(computeStats(fakeData)).toBe(statsText);
+  })
+})
\ No newline at end of file
diff --git a/tests-read-only/e2e/app.spec.js b/tests-read-only/e2e/app.spec.js
index ee55be07..d1423156 100644
--- a/tests-read-only/e2e/app.spec.js
+++ b/tests-read-only/e2e/app.spec.js
@@ -142,7 +142,7 @@ test.describe('Pagina interraciones', () => {
       await page.goto('http://localhost:3000/');
       const originalLis = await page.$$(liSelector);
       const select = await page.getByTestId('select-filter');
-      await select.selectOption({ index: 1 });
+      await select.selectOption({ index: 0 });
       const liElements = await page.$$(liSelector);
       expect(liElements.length).not.toEqual(originalLis.length); // probar si no hay mismo cantidad elementos
 
@@ -152,4 +152,4 @@ test.describe('Pagina interraciones', () => {
       expect(clearLiElements.length).toEqual(originalLis.length);
     });
   });
-});
+});
\ No newline at end of file
diff --git a/tests-read-only/oa/oa-css.spec.js b/tests-read-only/oa/oa-css.spec.js
index a9d61244..fca2320a 100644
--- a/tests-read-only/oa/oa-css.spec.js
+++ b/tests-read-only/oa/oa-css.spec.js
@@ -170,4 +170,4 @@ describe('CSS', () => {
       });
     });
   });
-});
+});
\ No newline at end of file
diff --git a/tests-read-only/oa/oa-html.spec.js b/tests-read-only/oa/oa-html.spec.js
index 5e38c47c..0f708272 100644
--- a/tests-read-only/oa/oa-html.spec.js
+++ b/tests-read-only/oa/oa-html.spec.js
@@ -120,4 +120,4 @@ describe('Uso de HTML semántico', () => {
     });
   });
 
-});
+});
\ No newline at end of file
diff --git a/tests-read-only/oa/oa-javascript.spec.js b/tests-read-only/oa/oa-javascript.spec.js
index 7eaef943..e384c87b 100644
--- a/tests-read-only/oa/oa-javascript.spec.js
+++ b/tests-read-only/oa/oa-javascript.spec.js
@@ -179,4 +179,4 @@ describe('Módulos de ECMAScript', () => {
   it('Se usa "export"', () => {
     expect(exportStatements.length).toBeGreaterThan(0);
   });
-});
+});
\ No newline at end of file
diff --git a/tests-read-only/oa/oa-web-api.spec.js b/tests-read-only/oa/oa-web-api.spec.js
index a955a159..3d524fac 100644
--- a/tests-read-only/oa/oa-web-api.spec.js
+++ b/tests-read-only/oa/oa-web-api.spec.js
@@ -158,4 +158,4 @@ describe('Módulos de ECMAScript', () => {
     expect(importStatements.length).toBeGreaterThan(0);
   });
 
-});
+});
\ No newline at end of file
diff --git a/thumb.png b/thumb.png
deleted file mode 100644
index 5b40e35d..00000000
Binary files a/thumb.png and /dev/null differ