-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
80 lines (72 loc) · 3.41 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Brian Sander – UX & Product Designer</title>
<meta name="description" content="The online portfolio of Brian Sander, A digital product designer based in northern California">
<meta name="author" content="Brian Sander">
<link href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;700;900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="css/main.css?v=2.0">
<link rel="stylesheet" href="css/font.css?v=1.0">
</head>
<body>
<div class="container">
<nav class="nav">
<span class="nav__button -logo">B</span>
<button navTo="work" class="nav__button">Work</button>
<button navTo="about" class="nav__button">About</button>
<button navTo="contact" class="nav__button">Contact</button>
</nav>
<main>
<div class="intro">
Designer and<div class="swapper"></div>
</div>
</main>
<footer class="footer">
© 2023 Brian Sander
</footer>
</div>
<div class="shadeContent">
<section content="work" class="shadeContent__container">
<h1 class="shadeContent__title">Work</h1>
<div>
<h2 class="shadeContent__header -rainbowText">
Currently I'm
<span class="-nextLine">
at Meta
</span></h2>
<p class="shadeContent__body">Designing the future of AR at Meta's Reality Labs. Previously I've had the pleasure of working with the fine folk at Udemy, AKQA, EY, Highfive, and more. I'm open to critiques, mentoring, and fun side projects. Reach out if that's you.</p>
</div>
</section>
<section content="about" class="shadeContent__container">
<h1 class="shadeContent__title">About</h1>
<div>
<h2 class="shadeContent__header -rainbowText">
Stay a while,
<span class="-nextLine">
and listen.
</span></h2>
<p class="shadeContent__body">
I’m relentless. I do the hard work. I care about forging experiences that better people’s lives. I believe the best work comes from the interplay of evidence, experience, motion, and collaboration. Time to time you can find me bringing my designs to life in code.
</p>
<p class="shadeContent__body">
When I'm not doing all that I'm usually gaming, drawing, climbing walls, or at karoake. I'm always learning and lately my obsessions are motion graphics and 3D Modelling. I’ve also taken a huge liking to environment design and have started to create my own worlds in Cinema4d. Other than that you can find me reading a book, or more recently ChatGPT reponses. Oh and I love sci-fi flicks, only second to my collection of kicks.
</p>
</div>
</section>
<section content="contact" class="shadeContent__container">
<h1 class="shadeContent__title">Contact</h1>
<div>
<h2 class="shadeContent__header -rainbowText">
Let's connect,
<span class="-nextLine">
or whatever.
</span></h2>
<p class="shadeContent__body">You can find me on <a href="https://www.instagram.com/bsandsdamans/">Instagram</a>, <a href="https://twitter.com/briansanderjr">Twitter</a>, <a href="https://codepen.io/bsander">Codepen</a>, and <a href="https://www.linkedin.com/in/briansanderjr">Linkedin</a>. There's always <a href="mailto:hi@briansander.com">email</a> if you're more traditional.</p>
</div>
</section>
</div>
<div class="shade"></div>
<script src="js/script.js"></script>
</body>
</html>