-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtemplate.html
335 lines (310 loc) · 18.4 KB
/
template.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
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<link rel="icon" href="favicon.ico">
<title>Nico Aldana | [TEMPLATE]</title>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="https://kit.fontawesome.com/7f5334cc97.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<!-- Custom styles for this template -->
<link href="css/style.css" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
<style>
@import url('https://fonts.googleapis.com/css2?family=Raleway:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
</style>
</head>
<body id="page-top">
<!-- Navigation -->
<nav class="navbar navbar-default">
<div class="container">
<!-- Toggle Navigation -->
<div class="navbar-header page-scroll">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand page-scroll" href="index.html"><img src="images/logo.png" alt="Nico Aldana"></a>
</div>
<!-- Nav Links -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li class="hidden">
<a href="#page-top"></a>
</li>
<li>
<a class="page-scroll" href="index.html#about">About</a>
</li>
<li>
<a class="page-scroll" href="index.html#portfolio">Portfolio</a>
</li>
<li>
<a class="page-scroll" href="index.html#contact">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<section id="details" class="mz-module">
<div class="container light-bg">
<div class="header-image">
<img src="images/headers/demi.jpg" alt="Header Image">
<a href="/index.html#portfolio">
<div class="top-left">
<i class="fa-regular fa-arrow-left"></i> Back to Portfolio
</div>
</a>
<div class="text-overlay">
<div class="text-container">
<h1>Title</h1>
<h3>Subtitle</h3>
</div>
</div>
</div>
<div class="modal-works"><span>CAD Modeling</span><span>Analysis</span><span>Machining</span><span id="in-progress">In Progress</span></div>
<div class="row my-5">
<div class="col-md-6">
<h2>The Problem</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Dolor dolores et rem reiciendis odio eaque veritatis. Ut accusamus eos, praesentium laborum odio beatae, esse veniam maiores consectetur provident, porro fugit.</p>
</div>
<div class="col-md-6">
<img src="/images/headshot.jpg" class="img-embed" alt="">
</div>
</div>
<div class="row my-5">
<div class="col-lg-12">
<h2>Our Solution</h1>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Dolor dolores et rem reiciendis odio eaque veritatis. Ut accusamus eos, praesentium laborum odio beatae, esse veniam maiores consectetur provident, porro fugit.</p>
</div>
</div>
<div class="row my-5">
<div class="col">
<img src="/images/headshot.jpg" class="img-embed" alt="">
</div>
</div>
<div class="row mb-5 pb-5">
<div class="col-md-6">
<h2>Approach</h2>
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Dolor dolores et rem reiciendis odio eaque veritatis. Ut accusamus eos, praesentium laborum odio beatae, esse veniam maiores consectetur provident, porro fugit.</p>
</div>
<div class="col-md-6">
<img src="/images/headshot.jpg" class="img-embed" alt="">
</div>
</div>
</div>
<!-- /.container -->
<div class="text-center">
<a href="/index.html" class="btn btn-primary btn-md">Back to Portfolio</a>
</div>
</section>
<p id="back-top">
<a href="#top"><i class="fa fa-angle-up"></i></a>
</p>
<footer>
<div class="container text-center">
<p><a href="index.html" target="_blank"><span>home</span></a></p>
<p><a href="https://www.linkedin.com/in/nicoaldana/" target="_blank"><span>linkedin</span></a></p>
<p><a href="mailto:[email protected]" target="_blank"><span>email</span></a></p>
</div>
</footer>
<!-- Modal for portfolio item 1 -->
<div class="modal fade" id="Modal-1" tabindex="-1" role="dialog" aria-labelledby="Modal-label-1">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="Modal-label-1">Space Debris Capture</h4>
</div>
<div class="modal-body">
<img src="images/portfolio/portfolio-1.jpg" alt="img01" class="img-responsive" />
<div class="modal-works"><span>CAD Modeling</span><span>Analysis</span><span>Machining</span><span id="in-progress">In Progress</span></div>
<p>In partnership with <a href="https://scienceandtechnology.jpl.nasa.gov/opportunities/academic-partnerships/juci" target="_blank">NASA JPL,</a> our senior design team tackled the issue of <b>orbital space debris.</b></p>
<img src="images/portfolio/sd-1.jpg" alt="img01" class="img-responsive" />
<p>Our goal was to design a mechanism that could safely and effectively capture a piece of space debris that is 10-30 cm in diameter.</p>
<img src="images/portfolio/sd-3.jpg" alt="" class="img-responsive" />
<p>Our design consists of an <b>inner and outer aperture.</b> The outer aperture is mailbox-like and is responsible for the initial grab of the space debris. The inner aperture functions like a garage door between the initial capture area and the storage container (not pictured).</p>
<p>Together, the inner and outer apertures create a grabbing mechanism that can grab and store many pieces of orbital space debris.</p>
<img src="images/portfolio/sd-5.jpg" alt="" class="img-responsive" />
<p>We went through several design iterations before choosing our final design based on manufacturability and material constraints.</p>
<img src="images/portfolio/sd-2.jpg" alt="" class="img-responsive" />
<p>We performed motion studies and impact analysis to guide our manufacturing decisions.</p>
<img src="images/portfolio/sd-4.jpg" alt="" class="img-responsive" />
<p>With mentorship from NASA engineers and Columbia faculty, we were able to begin machining a full-scale prototype!</p>
<div class="modal-row">
<img src="images/portfolio/sd-6.gif" alt="machining-gif" class="img-embed" />
<img src="images/portfolio/sd-7.gif" alt="aperture-gif" class="img-embed" />
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- Modal for portfolio item 2 -->
<div class="modal fade" id="Modal-2" tabindex="-1" role="dialog" aria-labelledby="Modal-label-2">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="Modal-label-2">Bipedal Robot</h4>
</div>
<div class="modal-body">
<img src="images/portfolio/portfolio-2.jpg" alt="img01" class="img-responsive" />
<div class="modal-works"><span>CAD Modeling</span><span>3D Printing</span><span>Robotics</span><span>Python</span></div>
<p>The goal of this project was to create an autonomous walking bipedal robot completely from scratch. We decided to make a design inspired by Baymax from Disney's Big Hero 6.</p>
<div class="modal-row">
<img src="images/portfolio/slaymax-1.jpg" alt="" class="img-embed" />
<img src="images/portfolio/slaymax-2.gif" alt="" class="img-embed" />
</div>
<p>We were responsible for every phase of design—initial sketching, 3D modeling, printing and prototyping, assembly, electronics, and programming.</p>
<div class="modal-row">
<img src="images/portfolio/slaymax-3.jpg" alt="" class="img-embed" />
<img src="images/portfolio/slaymax-4.jpg" alt="" class="img-embed" />
</div>
<p>Every design iteration was a cycle of modeling, simulation, printing, and testing.</p>
<div class="modal-row">
<img src="images/portfolio/slaymax-5.jpg" alt="" class="img-embed" />
<img src="images/portfolio/slaymax-6.jpg" alt="" class="img-embed" />
</div>
<p>Simulations were conducted in pybullet. A hill-climber algorithm were used to determine the best constants for motor actuation.</p>
<div class="modal-row">
<img src="images/portfolio/slaymax-7.jpg" alt="" class="img-embed" />
<img src="images/portfolio/slaymax-9.jpg" alt="" class="img-embed" />
</div>
<p>Our final robot was able to walk at nearly 1 cm/s. In the future, we want to improve this and add cosmetic changes, such as an outer shell.</p>
<img src="images/portfolio/slaymax-8.jpg" alt="" class="img-responsive" />
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- Modal for portfolio item 3 -->
<div class="modal fade" id="Modal-3" tabindex="-1" role="dialog" aria-labelledby="Modal-label-3">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="Modal-label-3">UNDER CONSTRUCTION</h4>
</div>
<div class="modal-body">
<img src="images/portfolio/portfolio-3.jpg" alt="img01" class="img-responsive" />
<div class="modal-works"><span>CAD Modeling</span><span>3D Printing</span><span>Electronics</span><span id="in-progress">IN PROGRESS</span></div>
<p>Check back later for details on this project!</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- Modal for portfolio item 4 -->
<div class="modal fade" id="Modal-4" tabindex="-1" role="dialog" aria-labelledby="Modal-label-4">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="Modal-label-4">Procedurally Generated Lampshade</h4>
</div>
<div class="modal-body">
<img src="images/portfolio/lampshade-1.jpg" alt="img01" class="img-responsive" />
<div class="modal-works"><span>Python</span><span>Blender</span><span>3D Printing</span></div>
<p>With a few user-inputted parameters, this Python script generates a 3D model for a lattice-structured lampshade. The model is rendered within Blender.
<p>We first hand-sketched the shape of our lampshade and determined the best parameters and equations to define it.</p>
<img src="images/portfolio/lampshade-2.jpg" alt="" class="img-responsive" />
<p>Then, we wrote code to generate rings of a specified thickness and radius—arranged layer by layer—into our lampshade shape. The resultant model is then rendered and exported as an STL.</p>
<img src="images/portfolio/lampshade-3.jpg" alt="" class="img-responsive" />
<p>The model is then scaled, sliced, and printed!</p>
<div class="modal-row">
<img src="images/portfolio/lampshade-4.gif" alt="" class="img-embed">
<img src="images/portfolio/lampshade-5.gif" alt="" class="img-embed">
</div>
<img src="images/portfolio/lampshade-6.jpg" alt="" class="img-responsive">
<p>The full code is available on our <a href="https://github.com/reyluno/digital-manufacturing" target="_blank">GitHub repository.</a></p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- Modal for portfolio item 5 -->
<div class="modal fade" id="Modal-5" tabindex="-1" role="dialog" aria-labelledby="Modal-label-5">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="Modal-label-5">Topology Optimization</h4>
</div>
<div class="modal-body">
<img src="images/portfolio/portfolio-5.jpg" alt="img01" class="img-responsive" />
<div class="modal-works"><span>Analysis</span><span>3D Printing</span><span id="in-progress">IN PROGRESS</span></div>
<p>We were challenged to design a desk and chair that was topologically optimized to support the greatest load with minimal mass.</p>
<p>I began by creating two basic initial models in SOLIDWORKS.</p>
<img src="images/portfolio/topology-1.jpg" alt="initial-model" class="img-responsive" />
<p>Then, I imported the models into Altair Inspire and designated the design spaces for optimization.</p>
<img src="images/portfolio/topology-2.jpg" alt="altair-screenshot" class="img-responsive" />
<p>The desk is intended to hold a load of 200 kg on its surface. The chair is designed to hold at least 150 kg, with an additional fifth of that load being placed on the back of the chair.</p>
<p>After optimizing for 30% of their respective initial design space volumes:</p>
<img src="images/portfolio/topology-3.jpg" alt="optimized-models" class="img-responsive" />
<p>After applying a PolyNURBS fit:</p>
<img src="images/portfolio/topology-4.jpg" alt="smoothed-model" class="img-responsive" />
<p>Finally, a usable model! I exported the optimized fits as STEP files for rendering and STL files for printing.</p>
<img src="images/portfolio/topology-5.jpg" alt="renders" class="img-responsive" />
<img src="images/portfolio/topology-6.jpg" alt="prints" class="img-responsive" />
<p>Using Altair Inspire, I can optimize the geometries of any future parts to save material.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- Modal for portfolio item 6 -->
<div class="modal fade" id="Modal-6" tabindex="-1" role="dialog" aria-labelledby="Modal-label-6">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="Modal-label-6">FOUR-BAR LINKAGE</h4>
</div>
<div class="modal-body">
<img src="images/portfolio/linkage-1.gif" alt="linkage-gif" class="img-responsive" />
<div class="modal-works"><span>CAD Modeling</span><span>Robotics</span><span>Analysis</span><span>Electronics</span><span>Machining</span></div>
<p>We were challenged to design an <b>actuated four-bar linkage</b> that could press buttons on game board as fast—and as accurately—as possible.</p>
<img src="images/portfolio/linkage-2.jpg" alt="initial-design" class="img-responsive" />
<p>We began by first calculating the optimal length of each link based on a prototype coupler design. The coupler holds a solenoid that is used to press the buttons.</p>
<img src="images/portfolio/linkage-3.jpg" alt="CAD" class="img-responsive" />
<p>Once the parts were manufactured, it was time to put together the electronics hub. We used a 12V motor, encoder, H-bridge, limit switches, and Arduino to control our linkage.</p>
<img src="images/portfolio/linkage-4.jpg" alt="parts-and-electronics" class="img-responsive" />
<p>Additional constraints, such as total build volume and manufacturing quality, were factored into our performance evaluation.</p>
<img src="images/portfolio/linkage-5.jpg" alt="team-picture" class="img-responsive" />
<p>We achieved a final score of 192 button presses per minute! You can view the full video here.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/SmoothScroll.js"></script>
<script src="js/theme-scripts.js"></script>
</body>
</html>