diff --git a/index.html b/index.html
index 777edf4..62c437b 100644
--- a/index.html
+++ b/index.html
@@ -286,8 +286,8 @@
},
{
src: "videos/project_13.mp4",
- title: "BLOCKS (2023)",
- description: "Proceduralism Religion",
+ title: "cohærens (2024)",
+ description: "Personal project. Coherence is, in general, a state or situation in which all the parts or ideas fit together well so that they form a united whole.",
link: "https:empty"
},
{
@@ -334,9 +334,9 @@
},
{
src: "videos/project_21.mp4",
- title: "Black Hole (2025)",
+ title: "Black Hole (2003)",
description: "Do NOT Enter",
- link: "https://andreyflat.space/blackhole"
+ link: "https://andreyflat.space/timeline"
},
];
videoSources.sort(() => Math.random() - 0.5);
diff --git a/projects.json b/projects.json
index c2be95a..00145d6 100644
--- a/projects.json
+++ b/projects.json
@@ -2,7 +2,7 @@
"2003": [
{
"title": "First Render",
- "description": "Early 3D tests with 3ds max and something else",
+ "description": "VirtualDub experience",
"side": "left",
"preview": {
"type": "image",
@@ -11,7 +11,7 @@
},
{
"title": "Second Render",
- "description": "Tw 3D test",
+ "description": "TBA",
"side": "left",
"preview": {
"type": "image",
@@ -19,8 +19,8 @@
}
},
{
- "title": "Tree Render",
- "description": "Bla 3D test",
+ "title": "Third Render",
+ "description": "TBA",
"side": "right",
"preview": {
"type": "image",
@@ -28,7 +28,263 @@
}
}
],
- "2010": [
+ "2014": [
+ {
+ "title": "Finn Flare",
+ "description": "Motion",
+ "side": "left",
+ "preview": {
+ "type": "video",
+ "url": "/videos/project_20.mp4"
+ }
+ },
+ {
+ "title": "GALS",
+ "description": "Motion",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "LightFest - AEVA",
+ "description": "3D Mapping",
+ "side": "right",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "LightFest - AUTORADIO",
+ "description": "",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "LightFest - Hondroxid",
+ "description": "",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Sergiy Radonejskii",
+ "description": "Motion Design for Stage",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Student Show",
+ "description": "Projection mapping for Plekhanovka",
+ "side": "right",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ }
+ ],
+ "2015": [
+ {
+ "title": "AEROFLOT",
+ "description": "3D Mapping in SPB",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "AMOK",
+ "description": "Personal 3D Project",
+ "side": "right",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "BLACKSTAR",
+ "description": "Content for music clip, Supervisor, Projection Mapping",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Blood Stairs",
+ "description": "3D simulation for Dancing with Stars on TNT",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Burningman Decompression",
+ "description": "Touchdesigner Things",
+ "side": "right",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Cloth Sim",
+ "description": "VFX cloth simulation",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Dancing with Stars",
+ "description": "Projection Mapping",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Durex",
+ "description": "VFX",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Empire V",
+ "description": "Blood Splash for Teaser",
+ "side": "right",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "ERW70",
+ "description": "3D motion for Sportcar",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Intervals Fest",
+ "description": "VJ, Performance",
+ "side": "right",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Johnson&Johnson",
+ "description": "Motion Design",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "KHL",
+ "description": "Mapping",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "LightFest - Samsung",
+ "description": "3D mapping AD",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "MARS",
+ "description": "Projection Mapping on windows",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Moneta",
+ "description": "Motion Design about Hystory of Money",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "MosLift",
+ "description": "Motion Design for Projection Screens",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Sber Energo",
+ "description": "Motion Design",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Sobor",
+ "description": "3D mapping",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "SPACESHIP",
+ "description": "VJ loop for Sila Sveta",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ },
+ {
+ "title": "Wedding",
+ "description": "Interactive VFX",
+ "side": "left",
+ "preview": {
+ "type": "image",
+ "url": "[https://placehold.co/300x200?text=First+Render](https://placehold.co/300x200?text=First+Render)"
+ }
+ }
+ ],
+ "2016": [
{
"title": "Commercial VFX",
"description": "First studio project",
@@ -44,7 +300,7 @@
"side": "right"
}
],
- "2020": [
+ "2017": [
{
"title": "Realtime Sim",
"description": "Procedural FX",
@@ -62,18 +318,18 @@
],
"2025": [
{
- "title": "Bevy Shooter",
- "description": "Procedural game prototype",
- "side": "right",
+ "title": "SPARTAK",
+ "description": "Pre-match show (2025)",
+ "side": "left",
"preview": {
"type": "video",
- "url": "https://filesamples.com/samples/video/mp4/sample_960x400_ocean.mp4"
+ "url": "/videos/project_20.mp4"
}
},
{
- "title": "Shader R&D",
+ "title": "to be continued",
"description": "Raytraced lighting test",
- "side": "left"
+ "side": "right"
}
]
}
diff --git a/timeline.html b/timeline.html
index 2e5ed73..42274b8 100644
--- a/timeline.html
+++ b/timeline.html
@@ -46,9 +46,9 @@
.timeline-container {
position: relative;
- max-width: 1000px;
+ max-width: 1920px;
margin: 4em auto;
- padding: 0 350px;
+ padding: 0 250px;
}
.timeline-line {
@@ -56,13 +56,13 @@
left: 50%;
top: 0;
bottom: 0;
- width: 2px;
+ width: 1px;
background-color: #404040;
transform: translateX(-50%);
}
.year-section {
- margin-bottom: 6em;
+ margin-bottom: 3em;
position: relative;
}
@@ -78,9 +78,15 @@
content: '';
position: absolute;
top: 50%;
+ left: 0;
width: 100%;
- height: 2px;
- background-color: #404040;
+ height: 1px;
+ background: linear-gradient(
+ to right,
+ transparent,
+ #404040,
+ transparent
+ );
}
.year-header h2 {
@@ -110,7 +116,7 @@
.project .card {
background-color: #1a1a1a;
- padding: 1.5em;
+ padding: 1.25em;
border-radius: 0;
transition: background-color 0.3s, transform 0.2s;
max-width: 280px;
@@ -149,8 +155,8 @@
position: absolute;
left: 50%;
transform: translateX(-50%);
- width: 16px;
- height: 16px;
+ width: 8px;
+ height: 8px;
background: #fff;
border: 4px solid #0a0a0a;
border-radius: 50%;
@@ -165,7 +171,7 @@
opacity: 0;
transition: all 0.4s ease;
border-radius: 0;
- box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4);
+ box-shadow: 0 25px 25px rgba(0, 0, 0, 0.25);
pointer-events: none;
background: #000;
z-index: 99;