diff --git a/src/lib/components/carousel-vertical.svelte b/src/lib/components/carousel-vertical.svelte
index e451b8e..394d72c 100644
--- a/src/lib/components/carousel-vertical.svelte
+++ b/src/lib/components/carousel-vertical.svelte
@@ -13,7 +13,6 @@
 	}
 
 	function handleKeyDown(event, url) {
-		console.log(event);
 		if (event.key === "Enter" || event.key === " ") {
 			redirectTo(url);
 		}
diff --git a/src/lib/json/hub.json b/src/lib/json/hub.json
index d54c700..a41d44f 100644
--- a/src/lib/json/hub.json
+++ b/src/lib/json/hub.json
@@ -1,10 +1,12 @@
 {
     "welcomeTitle": "Bienvenue sur Etheryo",
     "welcomeSubtitle": "'Etheryo' provient du mot 'Éther'/'Æther' dans la mythologie grec ainsi que de mon propre prénom. Le but de ce site web est de montrer mes créations. Qu'elles soient artistiques, philosophiques ou scientifiques, elles reflettent tout ce que je veux apporter au monde.",
+    "cover": "https://share.etheryo.fr/rando/2024.07.28/IMG20240728141949_min.jpg",
     "who": "Qui suis-je ?",
     "person": {
         "name": "Yohan Boujon",
         "pronouns": "il/lui",
+        "picture": "https://share.etheryo.fr/personal/yohan/pfp.jpg",
         "description": "Informatics and electronics engineer",
         "knowme": "Me Connaître"
     },
@@ -53,14 +55,14 @@
             "urlcompressed": "https://cloud.etheryo.fr/s/azb63ct3bGn84Da/download?path=&files=IMG20240728150532_compressed.jpg",
             "url": "https://share.etheryo.fr/rando/2024.07.28/IMG20240728150532.jpg",
             "title": "Tarnished Peak (afterwar)",
-            "localisation": "Ben More, Écosse",
+            "localisation": "Cruach Adrain, Écosse",
             "description": "L'appel à l'aventure était trop fort. Je ne voulais plus m'arrêter, mais comme à mon habitude, mon corps ne pouvait suivre mes pensées. Je me suis posé pendant plusieurs minutes devant cette falaise, me demandant ce qu'il y'avait derrière. Les nuages flottants et changeant de place à la vitesse du vent était un reflet de mes émotions qui changeaient."
         },
         {
             "urlcompressed": "https://cloud.etheryo.fr/s/azb63ct3bGn84Da/download?path=&files=IMG20240728142327_compressed.jpg",
             "url": "https://share.etheryo.fr/rando/2024.07.28/IMG20240728142327.jpg",
             "title": "Whitewashed",
-            "localisation": "Ben More, Écosse",
+            "localisation": "Cruach Adrain, Écosse",
             "description": "Photo modifiée pour ajouter cet effet de brume lointaine. Le ciel était bien bleu mais les nuages cachaient cette lumière et laissait paraître une ambiance blanchâtre."
         },
         {
@@ -69,7 +71,13 @@
             "title": "Compagnons",
             "localisation": "Lac d'Oô, France",
             "description": "Lors de notre petit periple avec quelques camarades de l'INSA nous avons décidé de nous balader vers l'autre bout du lac. Cette photo est une prise de vue de loin par ma part de mes camarades, observant leurs divers déplacements devant le coucher du soleil."
-        
+        },
+        {
+            "urlcompressed": "https://cloud.etheryo.fr/s/azb63ct3bGn84Da/download?path=&files=IMG20240728155726_compressed.jpg",
+            "url": "https://share.etheryo.fr/rando/2024.07.28/IMG20240728155726.jpg",
+            "title": "Replica",
+            "localisation": "Cruach Adrain, Écosse",
+            "description": "'Replca' ou 'Replique' montre la nature fractale des collines écossaises."
         }
     ]
 }
\ No newline at end of file
diff --git a/src/lib/ts/photo.ts b/src/lib/ts/photo.ts
new file mode 100644
index 0000000..d5d33c1
--- /dev/null
+++ b/src/lib/ts/photo.ts
@@ -0,0 +1,15 @@
+type Photo = {
+    urlcompressed: string;
+    url: string;
+    title: string;
+    localisation: string,
+    description: string,
+};
+
+export function filterPhotos(photos: Photo[], chunkSize = 3): Photo[][] {
+    const chunks: Photo[][] = [];
+    for (let i = 0; i < photos.length; i += chunkSize) {
+        chunks.push(photos.slice(i, i + chunkSize));
+    }
+    return chunks;
+}
\ No newline at end of file
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 1ed995a..4695358 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -9,17 +9,43 @@
 	import HoverCard from "$lib/components/hover-card.svelte";
 
 	import topics from "$lib/ts/topic.ts";
+	import { filterPhotos } from "$lib/ts/photo.ts";
 
 	import hubjson from "$lib/json/hub.json";
+	import { onMount } from "svelte";
 
-	let hub_cover =
-		"https://share.etheryo.fr/rando/2024.07.28/IMG20240728141949_min.jpg";
-	let profile_pic = "https://share.etheryo.fr/personal/yohan/pfp.jpg";
+	let photoList = filterPhotos(hubjson.photos);
+	$: index = 0;
+
+	function swipeCanva(event, canva) {
+		const id = index;
+		const width = window.innerWidth / 2;
+		const animTranslate = active > id ? [width, -width] : [-width, width];
+
+		anime({
+			targets: pageDiv,
+			translateX: animTranslate[0],
+			opacity: 0,
+			duration: 300,
+			easing: "easeInQuad",
+			complete: function () {
+				active = id;
+				pageDiv.style.transform = `translateX(${animTranslate[1]}px)`;
+				anime({
+					targets: pageDiv,
+					translateX: 0,
+					opacity: 1,
+					duration: 300,
+					easing: "easeOutQuad",
+				});
+			},
+		});
+	}
 </script>
 
 <div class="main-banner">
 	<CoverImg
-		cover={hub_cover}
+		cover={hubjson.cover}
 		darken={true}
 		title={hubjson.welcomeTitle}
 		subtitle={hubjson.welcomeSubtitle}
@@ -32,7 +58,7 @@
 	<div class="flex w-100 justify-center">
 		<div class="content">
 			<Person
-				picture={profile_pic}
+				picture={hubjson.person.picture}
 				name={hubjson.person.name}
 				pronouns={hubjson.person.pronouns}
 				description={hubjson.person.description}
@@ -69,7 +95,7 @@
 		<p>{hubjson.photo.description}</p>
 	</div>
 	<div class="flex w-100 justify-center">
-		{#each hubjson.photos as photo}
+		{#each photoList[index] as photo}
 			<HoverCard
 				picture={photo.urlcompressed}
 				picturefull={photo.url}
@@ -79,4 +105,16 @@
 			/>
 		{/each}
 	</div>
+	<button
+		on:click={() => {
+			if (index >= 1) index--;
+			
+
+		}}>&lt;</button
+	>
+	<button
+		on:click={() => {
+			if (index < photoList.length - 1) index++;
+		}}>&gt;</button
+	>
 </div>