-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
142 lines (127 loc) · 6.95 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
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
<!DOCTYPE HTML>
<!--
Strata by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<title>Noel Castillon's Portfolio</title>
<link rel="shortcut icon" type="image/jpg" href="images/favicon.ico"/>
<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" />
</head>
<body class="is-preload">
<!-- Header -->
<header id="header">
<div class="inner">
<a href="#" class="image avatar"><img src="images/avatar.jpg" alt="" /></a>
<h1><strong>Hello! I'm Noel</strong>, <br />your next software engineer.</h1>
</div>
</header>
<!-- Main -->
<div id="main">
<!-- One -->
<section id="one">
<header class="major">
<h2>Committed to developing human-centered spaces in tech <i class="icon fa-hand-peace"></i></h2>
</header>
<p>I'm a software engineer with a passion for equity in tech. Tayloring user-first experiences is essential to my work, and I am in constant pursuit of how this can be achieved at any scale, market, or industry. My experience co-founding a startup has given me to resolve to create solutions to large problems, even if it means developing a product from the ground floor. I have a passion for community and am always seeking ways to gain and share knowledge with those around me. I am resourceful, collaborative, meticulous, and I'd love to collaborate with you!</p>
<!-- <ul class="actions">
<li><a href="#" class="button">Learn More</a></li>
</ul> -->
</section>
<!-- Two -->
<section id="two">
<h2>Recent Work</h2>
<div class="row">
<article class="col-6 col-12-xsmall work-item">
<a href="images/fulls/01.gif" class="image fit thumb"><img src="images/thumbs/01.gif" alt="" /></a>
<h3><a href="http://armandoscatering2go.com/welcome/" target="_blank">Armando's Catering</a></h3>
<p>Website commissioned for Armando's Catering in order to promote their event catering and food delivery services in Central California.</p>
</article>
<article class="col-6 col-12-xsmall work-item">
<a href="images/fulls/02.gif" class="image fit thumb"><img src="images/thumbs/02.gif" alt="" /></a>
<h3><a href="https://sidewalksidekick.com/" target="_blank">Sidewalk Sidekick</a></h3>
<p>Social enterprise tech startup I co-founded and pitched at GiveBackHack Columbus 2022 where the idea was awarded starter funding. In active development with an app-store release slated for 2024.</p>
</article>
<article class="col-6 col-12-xsmall work-item">
<a href="images/fulls/03.gif" class="image fit thumb"><img src="images/thumbs/03.gif" alt="" /></a>
<h3><a href="https://emilydickinsoninspace.netlify.app/" target="_blank">Emily Dickinson in Space</a></h3>
<p>Web application that pulls Emily Dickinson poems over images of space from Unsplash's API. Intended as a teaching tool for secondary ELA classes.</p>
</article>
<article class="col-6 col-12-xsmall work-item">
<a href="images/fulls/04.gif" class="image fit thumb"><img src="images/thumbs/04.gif" alt="" /></a>
<h3><a href="https://cbuscodeandcoffee.com/" target="_blank">Columbus Code & Coffee</a></h3>
<p>Biweekly meetup I co-founded for code and tech enthusiasts in central Ohio as part of a nationwide grassroots community. 600+ members strong and has partnered with groups such as GiveBackHack and Google Developer Groups to promote community events that are inclusive, enriching, and engaging.</p>
</div>
<h2>My services</h2>
<p>In order to build you a quality website or application that matches your vision, my work follows the listed procedure in order to deliver a successful product:</p>
<ol>
<li><b>Consultation: </b>To begin, we'll start off will a simple conversation and we'll explore what this project is about!</li>
<li><b>Proposal: </b>A project proposal will be drafted, including visual preview, which will help us to discern a plan of action to pursue.</li>
<li><b>Creation: </b>We'll be in constant communication where I update you on the project status throughout development.</li>
<li><b>Launch & Support: </b>The product is ready for launch with ongoing support to ensure utmost quality.</li>
</ol>
</section>
<!-- Three -->
<section id="three">
<h2>Get In Touch</h2>
<div class="row">
<div class="col-8 col-12-small">
<form method="post" action="mailto:noelcastillon1@gmail.com">
<div class="row gtr-uniform gtr-50">
<div class="col-6 col-12-xsmall"><input type="text" name="name" id="name" placeholder="Name" /></div>
<div class="col-6 col-12-xsmall"><input type="email" name="email" id="email" placeholder="Email" /></div>
<div class="col-12"><textarea name="message" id="message" placeholder="Message" rows="4"></textarea></div>
</div>
</form>
<ul class="actions">
<li><input type="submit" value="Send Message" /></li>
</ul>
</div>
<div class="col-4 col-12-small">
<ul class="labeled-icons">
<!-- <li>
<h3 class="icon solid fa-home"><span class="label">Address</span></h3>
1234 Somewhere Rd.<br />
Nashville, TN 00000<br />
United States
</li> -->
<li>
<h3 class="icon solid fa-mobile-alt"><span class="label">Phone</span></h3>
<a href="tel:6143041372">(614) 304-1372</a>
</li>
<li>
<h3 class="icon solid fa-envelope"><span class="label">Email</span></h3>
<a href="mailto:noelcastillon1@gmail.com">noelcastillon1@gmail.com</a>
</li>
</ul>
</div>
</div>
</section>
</div>
<!-- Footer -->
<footer id="footer">
<div class="inner">
<ul class="icons">
<li><a href="mailto:noelcastillon1@gmail.com" class="icon solid fa-envelope"><span class="label">Email</span></a></li>
<li><a href="https://linkedin.com/in/noel-castillon/" class="icon brands fa-linkedin"><span class="label">LinkedIn</span></a></li>
<li><a href="https://github.com/noelcastillon1" class="icon brands fa-github"><span class="label">Github</span></a></li>
<li><a href="https://twitter.com/noelIsCoding" class="icon brands fa-twitter"><span class="label">Twitter</span></a></li>
</ul>
<ul class="copyright">
<li>© Noel Castillon</li><li>Design: <a href="http://html5up.net">HTML5 UP</a></li>
</ul>
</div>
</footer>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.poptrox.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>