-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
659 lines (615 loc) · 30.6 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
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
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
<!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">
<title>marci papineau | design & code </title>
<meta name="description"
content="Marcipapineau.com – Design, Product Development and Code for the digital world." />
<!-- general og:tags -->
<meta property="og:title" content="Marci Papineau – Making Digital Products" />
<meta property="og:url" content="https://www.marcipapineau.com/">
<meta property="og:image" content="http://marcipapineau.com/images/marcipapineaudocom.jpg" />
<meta property="og:description"
content="The place to go in Copenhagen for quick websites, and startup prototypes. Always mobile friendly webdesign." />
<meta property="og:site_name" content="www.marcipapineau.com" />
<!-- twitter -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@marcipapineau" />
<meta name="twitter:title" content="marci papineau | design & code" />
<meta name="description" content="Marcipapineau.com Design, Product Development and Code for the digital world." />
<meta name="twitter:creator" content="@MarciPapineau" />
<meta name="twitter:image:src" content="https://marcipapineau.com/images/marcipapineaudocom.jpg">
<meta name="format-detection" content="telephone=no">
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css"
integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<link rel="stylesheet" href="css/style.css">
<link rel="icon" sizes="16x16" type="image/png" href="images/favicon.png">
</head>
<body>
<a name="navbar"></a>
<div class="navbar-wrapper">
<div class="navbar-logo-container">
<a href="index.html"><img src="images/logo.png" id="logo" alt=""></a>
</div>
<div class="links-container flex-end">
<ul>
<a href="#accomplishments" class="nav">
<li>projects</li>
</a>
<a href="#testimonials" class="nav">
<li>accolades</li>
</a>
<a href="#services" class="nav">
<li>services</li>
</a>
<a href="#clients" class="nav">
<li>clients</li>
</a>
<a href="#about" class="nav">
<li>about</li>
</a>
<a href="#contact" class="nav">
<li>contact</li>
</a>
</ul>
</div>
</div>
<!-- home banner -->
<div class="banner" style="background-image: url('images/city-streets-2.jpg');">
<h1>Making Digital Products</h1>
<h3 class="white"> <span class="text-background">
Design and Product Development for the digital world.</h3></span>
<div class="button">
<span class="text-background">
<a href="mailto:marcidenmark@me.com" class="nav peach-light"> Get in touch!</a> </span>
</div>
</div>
<div class="spacing-70px"></div>
<!-- marci intro -->
<div class="about-container">
<div class="">
<img src="images/marci-new.jpg" alt="" class="marci">
</div>
<div class="about-text">
<div>
For over ten years I have been designing and crafting products for both digital and analog solutions.
All digital products are designed and coded with a mobile first environment. Having worked as both a designer and developer,
I know how to bridge that gap that sometimes exists between departments.
I am dedicated, passionate, and love to design.
<br>
</div>
<div style="margin-top: 20px;">
<div style="margin-top: 20px;">
Reach out
and we can talk about what you are looking for. I look forward to hearing from you!
</div>
<div>
</div>
</div>
</div>
</div>
<div class="spacing-70px"></div>
<!-- nico quote -->
<section class="banner-flex peach-background">
<h3>
<i class="nav fas fa-angle-double-right" style="font-size: 30px; color: #fc4827;"> </i>
Working closely with the three founders and our UX designer, in the first three months, Marci had our on boarding process fully
functioning on mobile and desktop devises through design and code.
<i class="nav fas fa-angle-double-right" style="font-size: 30px; color: #fc4827;"></i> <span
class="person">Nico Blier-Silvestri, Co-Founder & CEO at Platypus</span>
</h3>
</section>
<!-- end of Helena -->
<a name="accomplishments"></a>
<div class="spacing-80px"></div>
<!-- below headline to portfolio pieces -->
<div class="headlines">Sampling of Projects</div>
<div class="portfolio-banner-frontpage">
<section class="">
<div class="card-holder-flex">
<!-- start of RAILSG -->
<div class="portfolio-box card-flex">
<div>
<h5>Design & Product Development </h5>
<div class="subhead">
UI Design / Style Guide Creation / Development Collaboration
</div>
<div class="portfolio-piece" style="background-image: url('images/railsgirls-c.png');">
</div>
<p>
<span class="proj-name semi-bold">Rails Girls </span>
Designed all stages of a mentorship app that will be used as
a service connecting women newcomers to the field with
mentors that can help them grow technically and professionally. <strong> Tools used: Figma, Whimsical and Adobe Creative Cloud. </strong>
</p>
</div>
<div style="width:100%">
<a href="case-study-railsgirls.html">
<div class="button-read-more">
SEE DETAILS HERE
</div>
</a>
</div>
</div>
<!-- end of RAILSG -->
<div class="portfolio-box card-flex">
<div>
<h5>
App design and Wordpress Development
</h5>
<div class="subhead">
Design / Wordpress / Custom CSS
</div>
<div class="portfolio-piece" style="background-image: url('images/aktivFoodie-2.png ');">
</div>
<p>
<a href="http://aktivfoodie.com/" target="_blank" class="website-link">
<span class="
proj-name semi-bold">AktivFoodie.com </span>
</a> Designed and coded restaurant review app made for amateur traveling athletes.
<strong>Brought app to be production ready in 2 weeks time. </strong>
Custom coded CSS. App has multiple functions– the ability to sign up, read and write restaurant reviews, and
add the location of the restaurant via Google maps.
</p>
</div>
<div style="width:100%">
<a href="case-study-aktivFoodie.html">
<div class="button-read-more">
SEE DETAILS HERE
</div>
</a>
</div>
</div>
<!-- START OF borsen -->
<!-- <div class="portfolio-box card-flex">
<h5>
Design Consultant
</h5>
<div class="subhead">
Information Graphic Redesign / Style Guide Creation / Design Rules for infographics
</div>
<div class="portfolio-piece" style="background-image: url('images/borsen-1.png');">
</div>
<p>
<span class="
proj-name semi-bold">Børsen </span> </a>
Redesigned and taught staff to create more informative and easy to understand graphics that would <strong> help
readers
to take actionable steps upon reading.</strong>
Project culminated with a detailed style guide and a set of rules to use in graphic creation.
</p>
<div style="width:100%">
<a href="case-study-borsen.html">
<div class="button-read-more">
SEE DETAILS HERE
</div>
</a>
</div>
</div> -->
<!-- end of borsen -->
</div>
<!-- above end of 2 col grid -->
<!-- grid holder of second row cards -->
<div class="card-holder-flex">
<div class="portfolio-box card-flex">
<div>
<h5>Design Consultant</h5>
<div class="subhead">
Information Graphic Redesign / Style Guide Creation
</div>
<div class="portfolio-piece" style="background-image: url('images/borsen-1.png');">
</div>
<p>
<span class="
proj-name semi-bold">Børsen </span>
Redesigned and taught staff to create more informative and easy to understand graphics that would <strong> help
readers
to take actionable steps upon reading.</strong> Presented concepts to the Executive Editors and Art Director.
<p>
Project culminated with a style guide and a set of rules to create perfectly designed, consistent graphics by the writers and designers.
Created new visualization options.
</p>
</p>
</div>
<div style="width:100%">
<a href="case-study-borsen.html">
<div class="button-read-more">
SEE DETAILS HERE
</div>
</a>
</div>
</div>
<div class="portfolio-box card-flex">
<h5>Mobile First Code & Product Development</h5>
<div class="subhead">
Style Guide delivered in CSS / Responsive Web Design / Frontend code
</div>
<div class="portfolio-piece" style="background-image: url('images/cphux-magenta-2.png');">
</div>
<p>
<a href="http://cphux.com/" target="_blank" class="website-link">
<span class="proj-name semi-bold">CPHUX.com</span> </a>
Working together with a full stack developer and a UX designer, designed and coded HTML/CSS for a fully
responsive
website/application using, Python, Django, HTML, CSS and Bootstrap.
</p>
<p>
Functionality includes a homepage and subpages where a user
can create a membership, join and pay.
This was all done with an MVP approach so the product could be quickly released– <strong> thus making
payments for membership quickly available. </strong>
</p>
<div style="width:100%">
<a href="case-study-cphux.html">
<div class="button-read-more">
SEE DETAILS HERE
</div>
</a>
</div>
</div>
</div>
<div class="card-holder-flex">
<!-- magazines-->
<div class="portfolio-box card-flex">
<div>
<h5>Art Director / Creative Director</h5>
<div class="subhead">
Art Direction / Information Graphic Design / User Experience Design
</div>
<div class="portfolio-piece" style="background-image: url('images/magazines-9.png');">
</div>
<p>
<!-- <a href="https://www.matchmythesis.com" target="_blank" class="website-link"> -->
<span class="proj-name semi-bold">Editorial Design </span> </a>
Worked as a designer, art director and design director for an extensive range of publications in
New York City and Copenhagen. Hired and art directed photographers, illustrators and designers.
<strong>Collaborated with all departments of publications–
designers, art directors, writers, editors and
printers.</strong>Worked on staff at publications, as well as freelancing.
</p>
<p>
Visuals vary greatly between magazine types— for a teen magazine a teenage girl wants to see someone
like herself and maybe some cute boys.
An engineer will read something more complex and doesn't mind spending some time to understand a story.
How do you explain the complex transfer of energy between countries visually?
A family looking for advice on buying a new car might want to see something about cars that isn't what
they would see in a car dealership.
</p>
</div>
<!-- button full width -->
<div style="width:100%">
<a href="case-study-editorial.html">
<div class="button-read-more" style="color:#fc4827;">
SEE DETAILS HERE
</div>
</a>
</div>
</div>
<!-- end of magazines -->
<!-- lyndgaard -->
<div class="portfolio-box card-flex">
<div>
<h5>Landing Page Design & Code</h5>
<div class="subhead">
Art Direction / Digital Design / Product Development / Code
</div>
<div class="portfolio-piece" style="background-image: url('images/lyng-screens-2.png');">
</div>
<p>
<a href="http://lyndgaardmedia.dk/" target="_blank" class="website-link">
<span class="proj-name semi-bold">LyndgaardMedia.dk </span> </a>
Art Directed, designed and coded a fully responsive website. All code is in HTML/CSS with the help of
Bootstrap for a simple 100% responsive grid.
</p>
<p>Process notes: Helped owner narrow down what she wanted to say and show.
After making low fidelity wireframes, was able to quickly complete the design directly with HTML and CSS
in the browser— so no high
fidelity comps were needed– <strong>thus saving time and money.</strong>
</p>
</div>
<!-- button full width -->
<div style="width:100%">
<a href="case-study-lyngaard.html">
<div class="button-read-more">
SEE DETAILS HERE
</div>
</a>
</div>
</div>
<!-- end of lyngaard -->
<!-- and end card holder flex magazines + lyndgaard -->
</div>
</section>
</div>
<div class="spacing-70px"></div>
<!-- above end of portfolio banner -->
<!-- testimonials -->
<a name="testimonials"></a>
<div class="banner-wrapper peach-background">
<div class="headlines-in-banner">Accolades</div>
<div class="">
<h5 class="">Nicolas Blier-Silvestri, Co-Founder & CEO at Platypus</h5>
<div class=""><img src="images/Nico.jpg" class="circle-wrap" alt=""> </div>
<p>Marci was in the core team creating a workable product for the second iteration of Platypus.
This iteration was useful in getting our second round of investment.
Working closely with the 3 founders, a backender and our other UX designer, in the first 3 months, she had our
on boarding process fully
functioning on mobile and desktop devices (through design and code).
Marci helped to improve the usability of the product— especially within how we visualise our data— which is
one of the most important aspects of
Platypus. She gave input on how to make the product easier to use, helped make sure things were completed
on time, and asked insightful questions
during product meetings.
<span class="subhead">
CSS & HTML / Frontend Development / Information Graphic Design / Saas Product Development / UI Design
</span>
</p>
</div>
<div class="four-col-grid-container">
<div class=" testimonial-box">
<div class=""><img src="images/helena.jpg" class="circle" alt=""> </div>
<div class="person">Helena Levison <br> Founder & Community Lead at CPHUX</div>
<p> Marci was the link between our designers and our backend developer.
I love how independent she works. I can show her our concept, provide her with the content and she turns it
into beautiful UI and
flawless code. She is a hard worker and has high standards for her work.
She has created a design library for us which makes it easy for new teammates to adopt. I’m impressed with
her work and grateful to know that our
website will remain a visual cohesive expression in the future.
Her strong background in design and love for code makes her a valuable asset to my team. <br>
<span class="subhead">
Django Development / Frontend Code / Product Development / Style Guide in Code
</span>
</p>
</div>
<div class=" testimonial-box">
<div class=""><img src="images/dan.jpg" class="circle" alt=""> </div>
<div class="person">Daniel Bowen <br> Co-Founder at Platypus</div>
<p>Marci was instrumental in our product development and helped us achieve very demanding goals within a short
period of time.
All of this was done on an incredibly tight schedule as we (successfully) pushed for investment.
Marci helped us reach the next level - from a functional prototype - and was a joy to work with. <br>
<span class="subhead">
CSS & HTML / Frontend Development / Information Graphic Design / Saas Product Development / UI Design
</span>
</p>
</div>
<!-- <div class=" testimonial-box">
<div class=""><img src="images/helena.jpg" class="circle" alt=""> </div>
<div class="person">Helena Levison <br> Founder & Community Lead at CPHUX</div>
<p> Marci was the link between our designers and our backend developer.
I love how independent she works. I can show her our concept, provide her with the content and she turns it
into beautiful UI and
flawless code. She is a hard worker and has high standards for her work.
She has created a design library for us which makes it easy for new teammates to adopt. I’m impressed with
her work and grateful to know that our
website will remain a visual cohesive expression in the future.
Her strong background in design and love for code makes her a valuable asset to my team. <br>
<span class="subhead">
Django Development / Frontend Code / Product Development / Style Guide in Code
</span>
</p>
</div> -->
<div class=" testimonial-box">
<div class=""><img src="images/henning.jpg" class="circle" alt=""> </div>
<div class="person">Henning Mølsted <br> Managing Editor at Ingeniøren and Version2dk</div>
<p>
I have had the privilege to work with Marci at the Danish newspaper, Ingeniøren ("The Engineer")
and website, ing.dk.
Marci was employed as Design Director, and certainly has very strong skills.
She very quickly understood our readers and layout concept. During her stay at Ingeniøren
she also developed very interesting new ways of illustrating articles.
Marci has been a highly skilled team leader of the visual department at Ingeniøren.
She is a good listener who always involves the colleagues, but she also knows when to end a discussion and make the right decision.
As a person she has been highly appreciated by all colleagues with her positive and smiling attitude.
<br>
<span class="subhead">
Design Direction / Graphic Design / Information Graphic Design
</span>
</p>
</div>
<div class="testimonial-box">
<div class=""><img src="images/jorgen.jpg" class="circle" alt=""> </div>
<div class="person">Jørgen Andresen <br> Head of Media at Dagbladet Børsen </div>
<p> Marci has sent Børsen on a most needed journey to get infographics in the newspaper that the readers can
actually read and understand.
With her help Børsen has come a long way in a very short period, and I can only highly recommend Marci for
any publication that wants rapid
improvement. And by the way, she is also fun to work with. <br>
<span class="subhead">
Information Graphics Redesign
</span>
</p>
</div>
</div>
</div>
<!-- banner of clients and logos -->
<a name="clients"></a>
<div class="clients-banner">
<div class="headlines-in-banner">Trusted Clients</div>
<h6 style="font-weight: 500;">
<span class="extra-bold red"> »</span> <span class="black ">Aktivfoodie.com</span>
<span class="extra-bold red">»</span> <span class="">Bloodlink.life </span>
<span class="extra-bold red">»</span> <span class="black "></span>Bonnier Publications</span>
<span class="extra-bold red">»</span> <span class=" ">Børsen </span>
<span class="extra-bold red">»</span> <span class="black ">CPHUX.com</span>
<span class="extra-bold red">»</span> <span class=" ">DesignToGo.dk </span>
<span class="extra-bold red">»</span> <span class="">IncPublishing.dk </span>
<span class="extra-bold red">»</span> <span class="">HacksHackers </span>
<span class="extra-bold red">»</span> <span class="black ">Infographics.com </span>
<span class="extra-bold red">»</span> <span class="">ing.dk </span>
<span class="extra-bold red">»</span> <span class="black ">Le Wagon </span>
<span class="extra-bold red">»</span> <span class=" ">Lyndgaardmedia.dk </span>
<span class="extra-bold red">»</span> <span class="black ">MatchMyThesis.com </span>
<span class="extra-bold red">»</span> <span class=" "> Media Hack Days Hackathon </span>
<span class="extra-bold red">»</span> Money Magazine<span class="design "> </span>
<span class="extra-bold red">»</span> <span class=" ">MTV </span>
<span class="extra-bold red">»</span> Penge og Privatøkonomi<span class="design "> </span>
<span class="extra-bold red">»</span> <span class=" ">Platypus </span>
<span class="extra-bold red">»</span> RailsGirls Copenhagen<span class="design "> </span>
<span class="extra-bold red">»</span> <span class=" ">Time Warner </span>
<span class="extra-bold red">»</span> <span class="black"> University of Copenhagen </span>
<span class="extra-bold red">»</span> <span class=" ">WonderCoders Denmark </span>
</h6>
</div>
<div class="logo-grid-container">
<div class="">
<img src="images/cphux.jpg" class="company-logos" alt="cphux">
</div>
<div class="">
<img src="images/plat.jpg" class="company-logos" alt="">
</div>
<div class="">
<img src="images/borsen.png" class="company-logos" alt="">
</div>
<div class="">
<img src="images/railsgirls.png" class="company-logos" style="height:63px" alt="">
</div>
<div class="">
<img src="images/WonderCoders.png" class="company-logos" style="height:45px" alt="">
</div>
<div class="">
<img src="images/ing.png" class="company-logos" alt="">
</div>
<div class="">
<img src="images/lewagon.png" class="company-logos" alt="">
</div>
<div class="">
<img src="images/logoMediaHackDays.png" class="company-logos" alt="">
</div>
<div class="">
<img src="images/newyorkmag.png" class="company-logos" alt="">
</div>
</div>
<!-- about / services / skills -->
<a name="services"></a>
<a name="about"></a>
<div class="two-col-grid-container">
<div class="sample-box">
<div class="headlines-in-banner">Services</div>
<p style="margin-top: 5px;"> <strong>
<span>»</span> Atomic Design <br>
<span>»</span> Coding and designing directly in the browser <br>
<span>»</span> Corporate Identity <br>
<span>»</span> Data Visualization <br>
<span>»</span> Frontend Development <br>
<span>»</span> Graphic Design <br>
<span>»</span> Product Design <br>
<span>»</span> Product Development <br>
<span>»</span> Rapid Prototyping <br>
<span>»</span> Responsive and Mobile First Code & Design <br>
<span>»</span> Style Guide Creation <br>
<span>»</span> User Experience Design (UX) <br>
<span>»</span> User Interface Design (UI) <br>
<span>»</span> User Journeys <br>
<span>»</span> Wireframing <br>
</strong>
</p>
<div class="headlines-in-banner" style="margin-top:30px;">Tech Expert</div>
<p style="margin-top:0px;"> <strong>
<span>»</span> Adobe Creative Suite <span>»</span>
Bootstrap <span>»</span>
CSS <span>»</span>
CSS Grid <span>»</span>
Figma <span>»</span>
Filezilla <span>»</span>
Git <span>»</span>
HTML <span>»</span>
Illustrator <span>»</span>
InDesign <span>»</span>
Photoshop <span>»</span>
Visual Studio Code
</strong>
</p>
<div class="headlines-in-banner" style="margin-top:30px;">Tech Intermediate</div>
<p style="margin-top:0px;"> <strong>
Adobe XD <span>»</span>
After Effects <span>»</span>
Django <span>»</span>
Git <span>»</span>
Java Script <span>»</span>
React <span>»</span>
Ruby on Rails <span>»</span>
SCSS <span>»</span>
Wordpress
</strong>
</p>
</div>
<div class="sample-box-b">
<div class="headlines black"> </div>
<!-- <a name="clients"></a> -->
<div class="headlines-in-banner">About</div>
<p class="medium" style="margin-top: 5px;">
I have a design degree from School of Visual Arts in New York City, and have completed Le Wagon's Full Stack 9
week bootcamp. </p>
<p class="medium">
These two educations give me the unique characteristic of being both a designer and coder.
</p>
<p class="medium">
I make websites and SaaS products– combining code and design for quick, beautiful solutions.
</p>
<p class="medium"> I often design with code– directly in the browser saving time and money.
When designing in code, we become aware of difficulties that may arise from a design, and can tackle
them early in the process.
</p>
<!-- <p class="medium">At the same time, in order to test the product I can work in Figma.</p> -->
<p><strong>Note to Companies Looking for help</strong> <br>
I can create quick iterations from wireframes and sketches to beautifully coded websites and interfaces.
</p>
<p><strong>Note to developers creating products </strong> <br>
With the wireframes created, I can code them into pixel perfect interfaces. I have done full stack work with
Rails, Django and React, and understand how to communicate with the backend people.
<p> <strong>Special note to CEO’s, COO's… </strong> <br>
I specialize in startups needing quick deployment. As a startup, you want the most for your money. Hire me
and I will do your frontend design, UI and code simultaneously.
</p>
</p>
</div>
</div>
<!-- helena quote -->
<section class="banner-flex peach-background">
<h3>
<i class="nav fas fa-angle-double-right" style="font-size: 30px; color: #fc4827;"> </i> Marci is a dedicated
team member who acts to find and create solutions to various challenges. She has a positive attitude, is team
oriented and has extensive knowledge on design and programming. <i class="nav fas fa-angle-double-right"
style="font-size: 30px; color: #fc4827;"></i> <span class="person">Sadhia Mengal, Team Member,
Le Wagon Bootcamp</span>
</h3>
</section>
<a name="contact"></a>
<div class="footer">
<div class="footer-wrapper">
<div>
<a href="#navbar"> <img src="images/logo.png" id="logo" alt="" style="margin-left: -8px; margin-top:10px;">
</a>
<div class="samplename infoleft">
<p class="medium">Marci Papineau Gottlieb <br>
+45 2447 3457 <br>
<a style="color: #fc4827;" href="mailto:marcidenmark@me.com "> marcidenmark@me.com</a></p>
</div>
</div>
<div class="footer-social">
<ul style="padding-left:0px;">
<li><a href="https://dribbble.com/marci_papineau" target="_blank "><i class="nav fab fa-dribbble fa-1x"
style="color:#fc4827;"> </i></a></li>
<li><a href="https://www.github.com/marcidenmark" target="_blank "><i class="nav fab fa-github fa-1x"
style="color:#fc4827;"> </i></a></li>
<li> <a href="https://www.linkedin.com/in/marcidenmark/" target="_blank"><i class="fab fa-linkedin fa-1x"
style="color:#fc4827;"> </i></a></li>
<li> <a href="https://twitter.com/marcipapineau" target="_blank"><i class="fab fa-twitter fa-1x"
style="color:#fc4827;"> </i></a></li>
<!-- <li> <a href="#navbar"> <i class="nav fas fa-angle-double-up" style="font-size: 30px; color: #f0ffff;"> </i> </a> </li> -->
</ul>
</div>
</div>
<p class="text-center" style="font-size: 12px;">Coded and designed by Marci with vanilla HTML & CSS. </p>
</div>
</div>
</div>
</div>
<!-- </script> empty closing tag? -->
</body>
</html>