Skip to content

Commit 0ec9d68

Browse files
committed
uploaded deleted projects
1 parent 703bb16 commit 0ec9d68

File tree

12 files changed

+569
-0
lines changed

12 files changed

+569
-0
lines changed
91.2 KB
Binary file not shown.
85.8 KB
Binary file not shown.
40.3 KB
Binary file not shown.

Retro-Design/index.html

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Document</title>
7+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/locomotive-scroll@3.5.4/dist/locomotive-scroll.css">
8+
<link rel="stylesheet" href="style.css">
9+
</head>
10+
<body>
11+
<div id="main">
12+
<div id="page1">
13+
<div id="nav">
14+
<h5>Amsterdam, NL</h4>
15+
<img src="https://uploads-ssl.webflow.com/5f2429f172d117fcee10e819/5f7f87c8b81a6e7a214312f0_header.svg">
16+
<div id="icon"><img src="/menu.png"></div>
17+
</div>
18+
<div id="parta">
19+
<div id="ele1">
20+
<div id="img-div">
21+
<img src="https://assets.website-files.com/5f9085a4041dd5427c5ac8ae/615d9672cc65f12c9ab25f21_thumbnail-small.jpeg?">
22+
</div>
23+
24+
<h3>Avro | Ko <span>New</span></h3><br>
25+
<p>AvroKO is an award-winning global design firm, established itself as a global leader in interior architecture for hospitality, restaurant and bars.</p>
26+
</div>
27+
<div id="ele2">
28+
<h1>All Work!</h1>
29+
<p>A Featured selection the latest work- of the last years.</p>
30+
<h6><span>TIP!</span> Drag sideways to navigate</h6>
31+
</div>
32+
<div id="ele3">
33+
<div id="img-div">
34+
<img src="https://assets.website-files.com/5f9085a4041dd5427c5ac8ae/645b5439577bd35377de8c43_thumbnail-small.webp?">
35+
</div>
36+
37+
<h3>The Roger Hub <span>New</span></h3><br>
38+
<p>The Roger Hub is an immersive web experience showcasing the tennis-inspired 'On' sneakers, a collaboration born out of a partnership with the legendary Roger Federer.</p>
39+
</div>
40+
</div>
41+
<h1>Miranda</h1>
42+
</div>
43+
<div id="page2">
44+
<div id="page2-1">
45+
<h3>Interactive</h3>
46+
<h1>Artist</h1>
47+
<img src="https://uploads-ssl.webflow.com/5f2429f172d117fcee10e819/605c6ce3bc0c7d1cd4ca847e_avatar-star-p-800.jpeg">
48+
<p><span>A</span>s a multidisciplinary freelancer, I'm passionate about creating iconic digital experiences through motion, typography, and creative coding for companies and agencies around the world.</p>
49+
</div>
50+
<div id="page2-2">
51+
<img src="https://uploads-ssl.webflow.com/5f2429f172d117fcee10e819/605c62f4c78c4ba46a1268be_avatar-1-p-1600.jpeg">
52+
<h1>digital art director interactive designer creative designer creative developer based in amsterdam,nl</h1>
53+
</div>
54+
</div>
55+
<div id="page3">
56+
<div id="pag33">
57+
<h1>website</h1>
58+
<img src="https://uploads-ssl.webflow.com/5f2429f172d117fcee10e819/60474834660f934090d42877_stamp.png">
59+
</div>
60+
61+
<div id="page3-1">
62+
<div id="elee1">
63+
<h4>UPCOMING NEXT</h4>
64+
<p>Fresh entry - A selected work from the latest digital releases.</p>
65+
<h6><span>TIP!</span> Click on the image to explore</h6>
66+
</div>
67+
<div id="elee2">
68+
<div id="imgg-div">
69+
<img src="https://assets.website-files.com/5f9085a4041dd5427c5ac8ae/645b5c79f349770ebcc28ec4_thumbnail-small.webp?">
70+
</div>
71+
72+
<h3>UNEXPECTED TIME</h3><br>
73+
<p>Unexpected Time is a classic-furitistic gamification web experience showcasing the lost history & culture in a world dominated by the virtual reality.</p>
74+
</div>
75+
<div id="elee3">
76+
<h3>THINK, CREATE</h3>
77+
<h2>DELIVER</h2>
78+
<p><span>A</span> strong project is created by deep collaboration. I design, develop, and deliver websites that drive results and win awards.<br> Like an artisan, I like to start from raw matter and give life to an iconic product that makes your brand stand out, starting from a Visual Strategy that guide the clent's vision to reality.</p>
79+
<div id="circle">
80+
<img src="https://uploads-ssl.webflow.com/5f2429f172d117fcee10e819/61001a3509319b6ae39e156b_arrow-long.svg">
81+
<h6>All work</h6>
82+
</div>
83+
84+
</div>
85+
<img src="https://uploads-ssl.webflow.com/5f2429f172d117fcee10e819/605c679f33f67d3dd00b04b4_avatar-3.jpeg">
86+
</div>
87+
<div id="page3-2">
88+
<h3>Let's create something together <span>Email Me</span></h3>
89+
<h3>Let's create something together <span>Email Me</span></h3>
90+
</div>
91+
</div>
92+
93+
</div>
94+
95+
<script src="https://cdn.jsdelivr.net/npm/locomotive-scroll@3.5.4/dist/locomotive-scroll.js"></script>
96+
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.2/gsap.min.js" integrity="sha512-16esztaSRplJROstbIIdwX3N97V1+pZvV33ABoG1H2OyTttBxEGkTsoIVsiP1iaTtM8b3+hu2kB6pQ4Clr5yug==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
97+
98+
<script src="script.js"></script>
99+
</body>
100+
</html>

Retro-Design/menu.png

4.45 KB
Loading

Retro-Design/script.js

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
const scroll = new LocomotiveScroll({
2+
el: document.querySelector('#main'),
3+
smooth: true
4+
});
5+
var tl = gsap.timeline()
6+
7+
tl.to("#page1",{
8+
y:"100vh",
9+
scale: 0.5,
10+
duration: 0,
11+
})
12+
tl.to("#page1",{
13+
y: "30vh",
14+
duration: 1,
15+
delay: 0.5,
16+
})
17+
tl.to("#page1",{
18+
y:"0vh",
19+
rotate: 360,
20+
scale:1
21+
22+
})

0 commit comments

Comments
 (0)