-
Notifications
You must be signed in to change notification settings - Fork 0
/
Gallery.html
135 lines (117 loc) · 6.74 KB
/
Gallery.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
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
<!DOCTYPE HTML>
<!--
Phantom by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<title>Gallery - James Diefenbach</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="assets/css/main.css" />
<link href='https://fonts.googleapis.com/css?family=Nabla' rel='stylesheet'>
<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
<link href="https://api.fontshare.com/v2/css?f[]=supreme@400&f[]=technor@600&f[]=nunito@400&f[]=melodrama@500&display=swap" rel="stylesheet">
</head>
<body class="is-preload">
<!-- Wrapper -->
<div id="wrapper">
<!-- Header -->
<header id="header">
<div class="inner">
<!-- Logo -->
<a href="index.html" class="logo">
<span class="symbol"><img src="images/logo.svg" alt="" /></span><span class="title">PORTFOLIO</span>
</a>
<!-- Nav -->
<nav>
<ul>
<li><a href="#menu">Menu</a></li>
</ul>
</nav>
</div>
</header>
<!-- Menu -->
<nav id="menu">
<h2>Menu</h2>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="Traditional.html">Traditional Resume</a></li>
<li><a href="Transcript.html">Academic Transcript</a></li>
<li><a href="Gallery.html">Gallery</a></li>
</ul>
</nav>
<!-- Main -->
<div id="main">
<div class='image_box' style="background-attachment: fixed; background-image: url('images/BG_Fog.webp'); overflow: hidden;">
<div style="height: 200px; width: 100%;"></div>
<div style="overflow: hidden; height: 300px; width: 100%;">
<h1 style="padding-top: 1em; font-family: 'Nabla';font-size: 6em;" >
<span class="nabla">G</span><span class="nabla">A</span><span class="nabla">L</span><span class="nabla">L</span><span class="nabla">E</span><span class="nabla">R</span><span class="nabla">Y</span>
</h1>
<h2 id="outline">3D Modelling & 2D Work</h3>
</div>
<div style="height: 200px; width: 100%;"></div>
</div>
<div class="inner">
<div style="padding-top: 2em; overflow: hidden;">
<p><span class="image left"><img style = "max-height: 200px;" src="images/Gallery_Monkey.png" alt="" /></span>
I’ve used blender to create <strong>procedural models and materials</strong>, alongside models / materials made with a variety of approaches. I’ve experimented with making materials using photos of real-life materials and handmade touches, and using parameters to try out photo-realistic materials using both Eevee and Cycles. There are some procedural / infinite loops using instances to create multiple copies (enough to loop without noticing) of objects without causing unnecessary render stress.
</p>
</div>
<div style="overflow: hidden;">
<p><span class="image right"><img style = "max-height: 200px;" src="images/Gallery_Dragonball01.PNG" alt="" /></span>
I’ve experimented with Illustrator to create <strong>Vector art in 2D</strong>, in addition to creating patterns and using filters such as Gaussian Blur to create glass / fog effects. I made many scrap logos, icons and patterns in addition to using some vector-based work in my personal projects such as in my team’s <a href="Competitions.html#2022_Hackathon">2022 Hackathon</a>.
Additionally, I have some work with prototyping <strong>UI & UX</strong>, as seen in the aforementioned hackathon, and my <a href="GameDev.html">Game Development</a> work.
</p>
</div>
<h3 id="outline">Old Hobby Work</h3>
<div class="box alt">
<div class="row gtr-uniform">
<div class="col-4"><span class="image fit"><img src="images/Gallery_SharkEgg.JPG" alt="" /></span></div>
<div class="col-4"><span class="image fit"><img src="images/Gallery_IceBlocks.JPG" alt="" /></span></div>
<div class="col-4"><span class="image fit"><img src="images/Gallery_Room.JPG" alt="" /></span></div>
<div class="col-4"><span class="image fit"><img src="images/Gallery_Sunset.gif" alt="" /></span></div>
<div class="col-4"><span class="image fit"><img src="images/Gallery_OrganicTunnel.gif" alt="" /></span></div>
<div class="col-4"><span class="image fit"><img src="images/Gallery_Donut.gif" alt="" /></span></div>
<div class="col-4"><span class="image fit"><img src="images/Gallery_Materials01.JPG" alt="" /></span></div>
<div class="col-4"><span class="image fit"><img src="images/Gallery_Materials02.JPG" alt="" /></span></div>
<div class="col-4"><span class="image fit"><img src="images/Gallery_Lamp.PNG" alt="" /></span></div>
<div class="col-4"><span class="image fit"><img src="images/Gallery_Dragonball02.PNG" alt="" /></span></div>
<div class="col-4"><span class="image fit"><img src="images/Gallery_Pattern01.PNG" alt="" /></span></div>
<div class="col-4"><span class="image fit"><img src="images/Gallery_Pattern02.PNG" alt="" /></span></div>
</div>
</div>
</div>
</div>
<footer id="footer">
<div class="inner">
<section>
<a href = "mailto:jamescdiefenbach@gmail.com">
<h2>Get in touch</h2>
</a>
<form method="post" action="#">
<ul class="icons">
<li><a href="#" class="icon brands style2 fa-twitter"><span class="label">Twitter</span></a></li>
<li><a href="https://www.facebook.com/james.diefenbach.1/" class="icon brands style2 fa-facebook-f"><span class="label">Facebook</span></a></li>
<li><a href="https://www.instagram.com/james_dief/" class="icon brands style2 fa-instagram"><span class="label">Instagram</span></a></li>
<li><a href="https://github.com/Tinylad" class="icon brands style2 fa-github"><span class="label">GitHub</span></a></li>
<li><a href="mailto:jamescdiefenbach@gmail.com" class="icon solid style2 fa-envelope"><span class="label">Email</span></a></li>
</ul>
<span></span>
</section>
<ul class="copyright">
<li>© James Diefenbach 2022. All rights reserved</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
</ul>
</div>
</footer>
</div>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>