-
Notifications
You must be signed in to change notification settings - Fork 0
/
cv.html
410 lines (389 loc) · 26.4 KB
/
cv.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
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
<!DOCTYPE html>
<!--
_____ _ _ _
/ ___| (_) | | | |
\ `--. ___ _ __ _ __ _ | | __ _| |__ ___ ___ _ __ ___
`--. \/ _ \| '_ \| |/ _` | | | / _` | '_ \ / __/ _ \ '_ \ / _ \
/\__/ / (_) | | | | | (_| | | |___| (_| | | | | (_| __/ | | | __/
\____/ \___/|_| |_|_|\__,_| \_____/\__,_|_| |_|\___\___|_| |_|\___|
-->
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" prefix="og: http://ogp.me/ns#"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" prefix="og: http://ogp.me/ns#"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9" prefix="og: http://ogp.me/ns#"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" prefix="og: http://ogp.me/ns#"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Sonia Lahcene - Graphic Designer in London - My CV</title>
<meta name="description" content="Freelance Graphic Designer based in London, available for print and digital work">
<meta name="keywords" content="Illustrator, Designer, Graphic Design, Illustrator London, Graphic Designer, Visual Designer, Designer London, Sonia Lahcene, Integrated Designer">
<meta property="og:type" content="website" />
<meta property="og:title" content="Sonia Lahcene CV- Graphic Designer in London" />
<meta property="og:url" content="https://sonialahcene.com/" />
<meta property="og:image" content="https://sonialahcene.com/assets/CV2017_icon.png" />
<meta property="og:image:type" content="image/png" />
<meta property="og:image:width" content="1000" />
<meta property="og:image:height" content="1116" />
<meta property="og:description" content="Integrated Graphic Designer based in London" />
<meta property="og:locale" content="en_GB" />
<!-- All the favicons, Mooooaaaaarrr -->
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="apple-touch-icon-precomposed" sizes="57x57" href="assets/favicons/apple-touch-icon-57x57.png" />
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/favicons/apple-touch-icon-114x114.png" />
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="assets/favicons/apple-touch-icon-72x72.png" />
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="assets/favicons/apple-touch-icon-144x144.png" />
<link rel="apple-touch-icon-precomposed" sizes="60x60" href="assets/favicons/apple-touch-icon-60x60.png" />
<link rel="apple-touch-icon-precomposed" sizes="120x120" href="assets/favicons/apple-touch-icon-120x120.png" />
<link rel="apple-touch-icon-precomposed" sizes="76x76" href="assets/favicons/apple-touch-icon-76x76.png" />
<link rel="apple-touch-icon-precomposed" sizes="152x152" href="assets/favicons/apple-touch-icon-152x152.png" />
<link rel="icon" type="image/png" href="assets/favicons/favicon-196x196.png" sizes="196x196" />
<link rel="icon" type="image/png" href="assets/favicons/favicon-96x96.png" sizes="96x96" />
<link rel="icon" type="image/png" href="assets/favicons/favicon-32x32.png" sizes="32x32" />
<link rel="icon" type="image/png" href="assets/favicons/favicon-16x16.png" sizes="16x16" />
<link rel="icon" type="image/png" href="assets/favicons/favicon-128.png" sizes="128x128" />
<meta name="Sonia L. Illustration" content="Sonia Lahcene"/>
<meta name="msapplication-TileColor" content="#FFFFFF" />
<meta name="msapplication-TileImage" content="assets/favicons/mstile-144x144.png" />
<meta name="msapplication-square70x70logo" content="assets/favicons/mstile-70x70.png" />
<meta name="msapplication-square150x150logo" content="assets/favicons/mstile-150x150.png" />
<meta name="msapplication-wide310x150logo" content="assets/favicons/mstile-310x150.png" />
<meta name="msapplication-square310x310logo" content="assets/favicons/mstile-310x310.png" />
<!--[if lte IE 8]>
<link rel="stylesheet" href="http://yui.yahooapis.com/combo?pure/0.5.0/base-min.css&pure/0.5.0/grids-min.css&pure/0.5.0/grids-responsive-old-ie-min.css&pure/0.5.0/menus-min.css">
<![endif]-->
<!--[if gt IE 8]><!-->
<link rel="stylesheet" href="css/pure.css">
<!--<![endif]-->
<link rel="stylesheet" href="//cdn.jsdelivr.net/jquery.magnific-popup/0.9.9/magnific-popup.css">
<link rel="stylesheet" href="css/vectorfont.css">
<link href='//fonts.googleapis.com/css?family=Yanone+Kaffeesatz:700,300,400|Reenie+Beanie|Quicksand:400,500,700|Source+Sans+Pro:300,300i' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/main.min.css">
<link rel="stylesheet" href="css/cv.css">
<script src="js/vendor/modernizr-2.6.2-respond-1.1.0.min.js"></script>
</head>
<body class="body-cv">
<header class="header-fixed">
<nav class="pure-menu pure-menu-open pure-menu-horizontal nav-shadow">
<a href="https://sonialahcene.com" class="pure-menu-heading"><span id="moving-colibri" class="moving-colibri icon-colibri"></span></a>
<a href="https://sonialahcene.com" class="pure-menu-heading sonial">Sonia Lahcene Graphic Design</a>
<ul id="menu-items">
<li id="menu-item-portfolio"><a href="/#portfolio" title"Portfolio">Portfolio</a></li>
<li id="menu-item-about"><a href="/#about" title="About me">About</a></li>
<li id="menu-item-contact"><a href="/#contact" title="Contact me">Contact</a></li>
<li id="menu-item-cv"><a href="/cv" title="My CV">CV</a></li>
<li id="menu-item-store"><a href="https://society6.com/sonialahcene" target="blank" title="My store" class="item-store">Store</a><div class="new-feature">new</div></li>
</ul>
<div class="contact-icons">
<a href="mailto:contact@sonialahcene.com" target="blank" title="Email Sonia Lahcene" class="icon-email"></a>
<a href="http://uk.linkedin.com/in/sonialahcene" target="blank" title="LinkedIn Sonia Lahcene" class="icon-linkdn"></a>
<a href="https://www.behance.net/sonialahcene" class="icon-behance" target="blank" title="Behance Sonia Lahcene" ></a>
</div>
</nav>
<div id="sticky-header" class="filter-options sticky-header">
<h3 class="category-title active all-categories" data-group="all">All</h3>
<h3 class="category-title" data-group="UI">UI/digital</h3>
<h3 class="category-title" data-group="brand">Brand identity</h3>
<h3 class="category-title" data-group="illustration">Illustrations</h3>
<h3 class="category-title" data-group="comm">Communications & events</h3>
</div>
</header>
<main id="main-cv">
<section id="header-cv">
<div class="shaped">
<div class="triangle"></div>
<div class="rectangle"></div>
</div>
<div class="main-title">
<div class="main-name">
<h1 class="name-cv">Sonia Lahcene</h1>
<div class="icon-colibri2"></div>
</div>
<h2 class="job-cv">Integrated Graphic Designer</h2>
</div>
<ul class="contact-cv">
<li class="website">sonialahcene.com</li>
<li><a href="https://www.behance.net/sonialahcene" target="blank">behance.net/sonialahcene</a></li>
<li><a href="https://www.linkedin.com/in/sonialahcene/" target="blank">linkedin.com/in/sonialahcene</a></li>
<li class="email"><a href="mailto:contact@sonialahcene.com">contact@sonialahcene.com</a></li>
<li class="phone">07977 693 635</li>
</ul>
</section>
<section id="content-cv">
<section id="info-cv">
<div class="summary">
<p>I love solving problems visually and I am passionate about creating eye-catching digital and print design. I am a versatile designer with experience working on integrated design projects involving web design, illustrations, branding consultancy, design of promotional material and merchandising items.</p>
</div>
<div class="info-flex">
<div class="skills block-info">
<h3 class="title-cv">Skills & Software</h3>
<div class="skills-list">
<div class="skills-main">
<div>
<p>Illustrator</p>
<div class="skills-level-back">
<div class="skills-level-front w95"></div>
</div>
</div>
<div>
<p>Illustrations</p>
<div class="skills-level-back">
<div class="skills-level-front w95"></div>
</div>
</div>
</div>
<div class="skills-main">
<div>
<p>Photoshop</p>
<div class="skills-level-back">
<div class="skills-level-front w90"></div>
</div>
</div>
<div>
<p>InDesign</p>
<div class="skills-level-back">
<div class="skills-level-front w85"></div>
</div>
</div>
</div>
<div class="skills-main">
<div>
<p>Infographics</p>
<div class="skills-level-back">
<div class="skills-level-front w95"></div>
</div>
</div>
<div>
<p>Icon Design</p>
<div class="skills-level-back">
<div class="skills-level-front w95"></div>
</div>
</div>
</div>
<div class="skills-main">
<div>
<p>Branding</p>
<div class="skills-level-back">
<div class="skills-level-front w75"></div>
</div>
</div>
<div>
<p>HTML</p>
<div class="skills-level-back">
<div class="skills-level-front w65"></div>
</div>
</div>
</div>
<div class="skills-main">
<div>
<p>CSS</p>
<div class="skills-level-back">
<div class="skills-level-front w65"></div>
</div>
</div>
<div>
<p>JS</p>
<div class="skills-level-back">
<div class="skills-level-front w30"></div>
</div>
</div>
</div>
</div>
</div>
<div class="skills-more block-info">
<h3 class="more-skills">and also...</h3>
<div class="skills-list">
<p class="skill-comm">Corporate <span>Communications</span></p>
<div class="skills-main">
<div>
<p>Animated SVG</p>
</div>
<div>
<p>Web Design/UI</p>
</div>
</div>
<div class="skills-main">
<div>
<p>Print Design</p>
</div>
<div>
<p>Wordpress</p>
</div>
</div>
<div class="skills-main">
<div>
<p>Sublime Text</p>
</div>
<div>
<p>Google Site</p>
</div>
</div>
</div>
</div>
<div class="education block-info">
<h3 class="title-cv">Education</h3>
<h4 class="degree-role">Bachelor in visual arts</h4>
<h5 class="school-company">University Panthéon Sorbonne</h5>
<p class="location">Paris, France</p>
<p>Visual Art, History of Art, Philosophy of Art</p>
<h4 class="degree-role">Master in Management</h4>
<h5 class="school-company">EDHEC Business School</h5>
<p class="location">Lille, France</p>
<p>Top ranking business school in Europe</p>
<p>Focus in Marketing and Communications</p>
</div>
</div>
<div class="interests block-info">
<h3 class="title-cv">Interests</h3>
<p>Doing backflips on trampolines</br>
and making my own sourdough bread</p>
</div>
</section>
<!-- experience -->
<section id="experience-cv">
<h3 class="title-cv work-block">Recent Experience</h3>
<div class="work">
<div class="bar">
<div class="experience-list">
<div class="date y17">
<div class="circle">
<p>2017</p>
</div>
</div>
<div class="resume top">
<h4 class="degree-role">FREELANCE GRAPHIC DESIGNER</h4>
<p class="experience-text">Key areas of expertise in graphic design, illustrations, design consulting, print and digital communication materials.</p>
<h4 class="degree-role">FREELANCE VISUAL DESIGNER</h4>
<h5 class="school-company">Brands2Life</h5>
<p class="experience-text">Completed multiple digital design requests for various clients, including Linkedin, General Electrics, Arup, VMware, Gemalto, Nominet. Deliverables included: visual assets, Gif, mailer, infographics, illustrations, websites mock-ups...</p>
<h4 class="degree-role">FREELANCE GRAPHIC DESIGNER</h4>
<h5 class="school-company">The Story Lab</h5>
<p class="experience-text">Production of infographics to illustrate DIY instructions for Wickes, a leading UK British home improvement retailer.</p>
</div>
</div>
<div class="experience-list">
<div class="date y16">
<div class="circle">
<p>2016</p>
</div>
</div>
<div class="resume mediablaze">
<h4 class="degree-role">FREELANCE GRAPHIC DESIGNER AND ILLUSTRATOR</h4>
<h5 class="school-company">Mediablaze</h5>
<p class="experience-text">Designed infographics and illustrations for Timberland to celebrate Earth Day. This included a mix of graphic design, pictures and illustrations.</p>
<p class="experience-text">Conceived and designed a giant mural illustration for Mediablaze’s London offices.</p>
</div>
</div>
<div class="experience-list">
<div class="date y15">
<div class="circle">
<p>2015</p>
</div>
</div>
<div class="resume">
<h4 class="degree-role">FREELANCE WEB AND GRAPHIC DESIGNER</h4>
<h5 class="school-company">Ladbrokes</h5>
<p class="experience-text">Designed and developed two Google Sites including UI, HTML, CSS, icons, illustrations. Responsible for the development of branding and visual identity.</p>
<p class="experience-text">Developed communications and promotional material: emails, flyers, banner design, newsletter.</p>
<h4 class="degree-role">FREELANCE GRAPHIC DESIGNER</h4>
<h5 class="school-company">Hootsuite</h5>
<p class="experience-text">Responsible for the design and development of infographics in French and German for Hootsuite to demonstrate the efficiency of Instagram as a social engagement tool.</p>
<h4 class="degree-role">FREELANCE GRAPHIC DESIGNER</h4>
<h5 class="school-company">Le Robert</h5>
<p class="experience-text">Tasked with the development of print design for flyers and magazine adverts to promote Le Robert software. The role also included the design of E-shop web icons.</p>
<h4 class="degree-role">FREELANCE GRAPHIC DESIGNER</h4>
<h5 class="school-company">Kaplan International English</h5>
<p class="experience-text">Designed English student books for Kaplan International by creating InDesign layouts and following existing styles. Also responsible for supporting with the development of illustrations for other children’s books produced by the organisation.</p>
</div>
</div>
<div class="experience-list">
<div class="date y14">
<div class="circle">
<p>2014</br>2012</p>
</div>
</div>
<div class="resume">
<h4 class="degree-role">COMMUNICATIONS ADVISER</h4>
<h5 class="school-company">Orange Labs UK</h5>
<p class="experience-text">Responsible for the development of the internal and external communication strategy. Developed the Orange Labs branding, including logos, visual assets, communication materials. Designed the merchandising for events.</p>
<p class="experience-text">Designed and managed the company website and intranet including the development of content, wireframes, visual assets.</p>
</div>
</div>
</div>
</div>
<div class="brands-section">
<h3 class="title-cv brands-block">BRANDS I HAVE WORKED FOR</h3>
<div class="list-client-cv">
<div class="icon-client_linkedin brands-cv"></div>
<div class="icon-client_ge brands-cv"></div>
<div class="icon-client_mediablaze brands-cv"></div>
<div class="icon-client_timberland brands-cv"></div>
<div class="icon-client_hootsuite brands-cv"></div>
<div class="icon-client_ladbrokes brands-cv"></div>
<div class="icon-client_kaplan brands-cv"></div>
<div class="icon-client_orange brands-cv"></div>
<div class="icon-client_lerobert brands-cv"></div>
</div>
</div>
</section>
</section>
</main>
<!-- download pdf -->
<a href="documents/Sonia_Lahcene_CV.pdf" target="blank">
<div class="download">
<div class="download-text">
<p>pdf</p>
</div>
<div><span class="icon-download"></span></div></div>
</div>
</a>
<footer>
<p class="title-footer"><span class="icon-colibri2 icon-footer"></span>SONIA LAHCENE GRAPHIC DESIGN </p>
<p class="rights"> ©2014 - All rights reserved</p>
<p class="squeezer">Handmade by <a href="https://www.linkedin.com/in/fabiendemangeat/en" target="blank" title="LinkedIn Fabien Demangeat">Fabien Demangeat</a> and myself</p>
</footer>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.0.min.js"><\/script>')</script>
<script src="//cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.0.0/jquery.magnific-popup.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/retina.js/1.3.0/retina.min.js"></script>
<script src="//cdn.jsdelivr.net/jquery.scrollto/1.4.13/jquery.scrollTo.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-localScroll/1.3.5/jquery.localScroll.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
<script src="js/vendor/vunits.min.js"></script>
<script src="js/vendor/jquery.shuffle.min.js"></script>
<script src="js/vendor/animation-frame.min.js"></script>
<script src="js/vendor/60fps-scroll.min.js"></script>
<script src="js/vendor/jquery.unveil.min.js"></script>
<!-- Do not load fastclick, embedded in magnific-popup -->
<script src="js/main.min.js"></script>
<!-- Google Analytics -->
<script>
(function(s,o,n,i,a,l){s.GoogleAnalyticsObject=i;s[i]||(s[i]=
function(){(s[i].q=s[i].q||[]).push(arguments)});s[i].l=+new Date;
a=o.createElement(n);l=o.getElementsByTagName(n)[0];
a.src='//www.google-analytics.com/analytics.js';
l.parentNode.insertBefore(a,l)}(window,document,'script','ga'));
ga('create','UA-55025126-1');ga('send','pageview');
</script>
<script type="text/javascript">
// Console-polyfill. MIT license.
// https://github.com/paulmillr/console-polyfill
// Make it safe to do console.log() always.
(function(con) {
'use strict';
var prop, method;
var empty = {};
var dummy = function() {};
var properties = 'memory'.split(',');
var methods = ('assert,clear,count,debug,dir,dirxml,error,exception,group,' +
'groupCollapsed,groupEnd,info,log,markTimeline,profile,profiles,profileEnd,' +
'show,table,time,timeEnd,timeline,timelineEnd,timeStamp,trace,warn').split(',');
while (prop = properties.pop()) con[prop] = con[prop] || empty;
while (method = methods.pop()) con[method] = con[method] || dummy;
})(this.console = this.console || {}); // Using `this` for web workers.
</script>
<script>
console.log('Hey %cdeveloper%c, contact me at %ccontact@sonialahcene.com%c ;) I could help you, I am an illustrator and do vector icons, logos, etc.', 'font-weight: bold; font-size: 1.5em;', 'font-weight: normal; font-size: normal;', 'font-weight: bold; font-size: 1.5em;', 'font-weight: normal; font-size: normal;');
</script>
</body>
</html>