-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
234 lines (222 loc) · 12.8 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
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Ben Bagley Graphic Designer / Web Developer</title>
<!-- Open Graph Potocol -->
<meta property="og:title" content="Ben Bagley Resume">
<meta property="og:type" content="website">
<meta property="og:image" content="Asset 2@3x.png">
<meta property="og:url" content="https://d31a.github.io/cv/">
<meta property="og:description" content="Ben Bagley is a Graphic Designer and Web Developer located near Birmingham, UK">
<meta property="og:locale" content="en_US">
<meta property="og:site_name" content="Ben Bagley Design">
<!-- Styles -->
<link rel="stylesheet" href="styles.css">
<script src="https://kit.fontawesome.com/13057f98ef.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel='stylesheet' href='https://fonts.googleapis.com/css?family=Roboto'>
</head>
<!-- Body content -->
<body>
<div class="container">
<div class="header">
<div class="logo-block">
<img src="BBdesignlogo.png">
</div>
<div class="bio-info">
<h2 class="w3-xxlarge">Ben Bagley</h2>
<h5 class="w3-margin-bottom w3-opacity"><b>Web Developer / Graphic Designer</b></h5>
<ul>
<li><i class="fa-solid fa-location-dot w3-margin-right w3-text-win8-teal"></i>Dudley, United Kingdom</li>
<li><i class="fa-solid fa-phone w3-margin-right w3-text-win8-teal"></i>+447749758912</li>
<li><i class="fa-solid fa-at w3-margin-right w3-text-win8-teal"></i><a href="mailto:benbagley90@gmail.com">benbagley90@gmail.com</a></li>
<li><i class="fa-solid fa fa-external-link w3-margin-right w3-text-win8-teal"></i><a href="https://benbagleydesign.com">www.benbagleydesign.com</a></li>
</ul>
</div>
</div>
<div class="main">
<div class="skills">
<p class="w3-large">
<i class="fa fa-asterisk fa-fw w3-margin-right w3-text-win8-teal"></i><b>Skills</b></p>
<br>
<p><b>Web Development</b></p>
<br>
<span class="w3-tag w3-light-grey w3-small w3-padding-small w3-round w3-margin-bottom">Wireframing</span>
<span class="w3-tag w3-light-grey w3-small w3-padding-small w3-round w3-margin-bottom">Web Strategy</span>
<span class="w3-tag w3-light-grey w3-small w3-padding-small w3-round w3-margin-bottom">WooCommerce</span>
<span class="w3-tag w3-light-grey w3-small w3-padding-small w3-round w3-margin-bottom">Git/GitHub</span>
<span class="w3-tag w3-light-grey w3-small w3-padding-small w3-round w3-margin-bottom">React</span>
<p>HTML</p>
<div class="w3-light-grey w3-round-xlarge w3-small">
<div class="w3-container w3-center w3-round-xlarge w3-win8-teal" style="height:15px;width:90%"></div>
</div>
<p>CSS</p>
<div class="w3-light-grey w3-round-xlarge w3-small">
<div class="w3-container w3-center w3-round-xlarge w3-win8-teal" style="height:15px;width:79%"></div>
</div>
<p>JavaScript</p>
<div class="w3-light-grey w3-round-xlarge w3-small">
<div class="w3-container w3-center w3-round-xlarge w3-win8-teal" style="height:15px;width:60%"></div>
</div>
<p>WordPress</p>
<div class="w3-light-grey w3-round-xlarge w3-small">
<div class="w3-container w3-center w3-round-xlarge w3-win8-teal" style="height:15px;width:70%"></div>
</div>
<br>
<p><b>Graphic Design</b></p>
<br>
<span class="w3-tag w3-light-grey w3-small w3-padding-small w3-round w3-margin-bottom">Branding</span>
<span class="w3-tag w3-light-grey w3-small w3-padding-small w3-round w3-margin-bottom">UX/UI</span>
<span class="w3-tag w3-light-grey w3-small w3-padding-small w3-round w3-margin-bottom">Logo Design</span>
<span class="w3-tag w3-light-grey w3-small w3-padding-small w3-round w3-margin-bottom">Hierarchy</span>
<span class="w3-tag w3-light-grey w3-small w3-padding-small w3-round w3-margin-bottom">Print</span>
<span class="w3-tag w3-light-grey w3-small w3-padding-small w3-round w3-margin-bottom">Advertising</span>
<p>Adobe Illustrator</p>
<div class="w3-light-grey w3-round-xlarge w3-small">
<div class="w3-container w3-center w3-round-xlarge w3-win8-teal" style="height:15px;width:90%"></div>
</div>
<p>Adobe Photoshop</p>
<div class="w3-light-grey w3-round-xlarge w3-small">
<div class="w3-container w3-center w3-round-xlarge w3-win8-teal" style="height:15px;width:85%"></div>
</div>
<p>Adobe InDesign</p>
<div class="w3-light-grey w3-round-xlarge w3-small">
<div class="w3-container w3-center w3-round-xlarge w3-win8-teal" style="height:15px;width:75%"></div>
</div>
<p>Adobe XD</p>
<div class="w3-light-grey w3-round-xlarge w3-small">
<div class="w3-container w3-center w3-round-xlarge w3-win8-teal" style="height:15px;width:70%"></div>
</div>
<br>
<br>
<div class="accordion-body">
<div class="accordion">
<i class="fa fa-scroll fa-fw w3-margin-right w3-text-win8-teal"></i>
<span class=" w3-large w3-text-theme"><b>Certifications</b></span>
<hr>
<div class="ctn">
<div class="label"><b><p>UI / UX Design Specialization</p></b>
<span class="w3-opacity w3-small">Issued Nov 2021 | Cal Arts via Coursera</span>
</div>
<div class="content">
<p><b>4 Courses</b></p>
<ul>
<li>Visual Elements of User Interface Design</li>
<li>UX Design Fundamentals</li>
<li>Web Design: Strategy and Information Architecture</li>
<li>Web Design: Wireframes and Prototypes</li>
</ul>
<br>
<span class="w3-tag w3-light-grey w3-padding">
<a href="https://www.coursera.org/account/accomplishments/specialization/UEFTLUNT7NAH" target="_blank">Show Credential
<i class="fa fa-external-link w3-opacity w3-small"></i></a></span>
</div>
</div>
<hr>
<div class="ctn">
<div class="label"><b><p>Graphic Design Specialization</p></b>
<span class="w3-opacity w3-small">Issued Apr 2021 | Cal Arts via Coursera</span></div>
<div class="content">
<p><b>5 Courses</b></p>
<ul>
<li>Fundamentals of Graphic Design</li>
<li>Introduction to Typography </li>
<li>Introduction to Imagemaking</li>
<li>Ideas from the History of Graphic Design</li>
<li>Brand New Brand</li>
</ul>
<br>
<span class="w3-tag w3-light-grey w3-padding">
<a href="https://www.coursera.org/account/accomplishments/specialization/DYX7Y3848QRF" target="_blank">Show Credential
<i class="fa fa-external-link w3-opacity w3-small"></i></a></span>
</div>
</div>
<hr>
</div>
</div>
<br>
<br>
<p class="w3-large w3-text-theme"><b><i class="fa fa-globe fa-fw w3-margin-right w3-text-win8-teal"></i>Languages</b></p>
<br>
<p>English</p>
<div class="w3-light-grey w3-round-xlarge">
<div class="w3-round-xlarge w3-win8-teal" style="height:24px;width:100%"></div>
</div>
<p>Spanish</p>
<div class="w3-light-grey w3-round-xlarge">
<div class="w3-round-xlarge w3-win8-teal" style="height:24px;width:55%"></div>
</div>
</div>
<div class="resume">
<div class="work-exp">
<h2 class="w3-text-grey w3-padding-16"><i class="fa fa-suitcase fa-fw w3-margin-right w3-xxlarge w3-text-win8-teal"></i>Work Experience</h2>
<h5 class="w3-opacity"><b>Freelance Web Developer / Graphic Designer</b></h5>
<h6 class="w3-text-win8-teal"><i class="fa fa-calendar fa-fw w3-margin-right"></i>Jan 2021 - <span class="w3-tag w3-win8-teal w3-round">Current</span></h6>
<h6 class="w3-opacity w3-small"><i class="fa fa-building fa-fw w3-margin-right"></i>Ben Bagley Design</p>
<h6 class="w3-opacity w3-small"><i class="fa fa-location-dot fa-fw w3-margin-right"></i>United Kingdom</h6>
<br>
<p class="w3-opacity">Executing from initial concept, to finished product.
<br>
<br>
<b>Graphic Design:</b> Branding, logo design, printed work, illustration, wireframing, and UI/UX.
<br>
<br>
<b>Web Development:</b> Designing and executing custom websites for clients in the CMS platform WordPress using custom HTML/CSS/JavaScript. Utilizing plugins such as Elementor / WooCommerce.
Currently expanding into Front End Development with a course run by Meta via Coursera (est. date of completion: Spring/Summer 2023) and a Software Development Skills Bootcamp ran by TDM (The Development Manager).
</p>
<hr>
<h5 class="w3-opacity"><b>Developing a Brand / E-Commerce Site</b></h5>
<h6 class="w3-text-win8-teal"><i class="fa fa-calendar fa-fw w3-margin-right"></i>Jan 2012 - Oct 2013</span></h6>
<h6 class="w3-opacity w3-small"><i class="fa fa-building fa-fw w3-margin-right"></i>Buhitos Pañales de Tela</p>
<h6 class="w3-opacity w3-small"><i class="fa fa-location-dot fa-fw w3-margin-right"></i>Spain</h6>
<br>
<p class="w3-opacity"> Developing a brand, importing products, photographing and cataloguing. Fulfilling orders and delivering to customers.
Utilising WordPress and WooCommerce to sell to the online market in Spain. Using Google Analytics to maximise customer base.
</p>
<hr>
</div>
<!--- >
<div class="cvr-ltr">
</div> </!-->
<div class="edu">
<h2 class="w3-text-grey"><i class="fa fa-certificate fa-fw w3-margin-right w3-xxlarge w3-text-win8-teal"></i>Education</h2>
<h4 class=" w3-padding-16 w3-text-win8-teal"><i class="fa fa-location-dot fa-fw w3-margin-right"></i>Dudley College of Technology</h4>
<h6 class="w3-opacity w3-margin-left"><b>BTEC National Diploma, Graphic Design</b></h6>
<h6 class="w3-opacity w3-small w3-margin-left">Pearson</h6>
<h6 class="w3-text-win8-teal"><i class="fa fa-calendar fa-fw w3-margin-left"></i>Sep 2008 - Jul 2010</span></h6>
<p class="w3-text-grey w3-margin-left"><b>Grade:</b>
<span class="w3-tag w3-win8-teal w3-small w3-padding-small w3-round w3-margin-left">Triple Distinction</span></p>
</br>
<h6 class="w3-opacity w3-margin-left"><b>BTEC 1st, Art and Design</b></h6>
<h6 class="w3-opacity w3-small w3-margin-left">Edexcel</h6>
<h6 class="w3-text-win8-teal"><i class="fa fa-calendar fa-fw w3-margin-left"></i>Sep 2007 - Jul 2008</span></h6>
<p class="w3-text-grey w3-margin-left"><b>Grade:</b>
<span class="w3-tag w3-win8-teal w3-small w3-padding-small w3-round w3-margin-left">Distinction</span></p>
</br>
<h6 class="w3-opacity w3-margin-left"><b>Key Skills Application of Number (Level 1)</b></h6>
<h6 class="w3-opacity w3-small w3-margin-left">City & Guilds</h6>
<h6 class="w3-text-win8-teal"><i class="fa fa-calendar fa-fw w3-margin-left"></i>Jul 2010</span></h6>
</br>
<h6 class="w3-opacity w3-margin-left"><b>Key Skills in Communication (Level 2)</b></h6>
<h6 class="w3-opacity w3-small w3-margin-left">City & Guilds</h6>
<h6 class="w3-text-win8-teal"><i class="fa fa-calendar fa-fw w3-margin-left"></i>Jun 2009</span></h6>
</div>
</div>
</div>
<div class="footer">
<div class="footer-qr">
<img src="qr-code.png" height="100px">
</div>
<div class="footer-icons">
<a href="https://www.linkedin.com/in/ben-bagley-5871261b6/" class="fa fa-linkedin w3-text-white w3-circle w3-xlarge w3-margin-right " target="_blank"></a>
<a href="https://www.instagram.com/benbagleydesign/" class="fa fa-instagram w3-text-white w3-circle w3-xlarge w3-margin-right" target="_blank"></a>
<a href="https://github.com/d31a" class="fa fa-github w3-text-white w3-circle w3-xlarge" target="_blank"></a>
</div>
</div>
</div>
<!-- JavaScript -->
<script src="app.js" type="text/javascript"></script>
</body>
</html>