-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathhighlights.html
More file actions
111 lines (83 loc) · 5.84 KB
/
Copy pathhighlights.html
File metadata and controls
111 lines (83 loc) · 5.84 KB
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
---
layout: default
title: Matthew Cobbs » Career Highlights
---
<div class="page-header">
<h1>Career Highlights</h1>
</div>
<!-- start section -->
<section id="highlights">
<div class="highlight row-fluid">
<div class="span8">
<h3>Stitches</h3>
<ul class="unstyled well well-small">
<li><a href="http://draeton.github.com/stitches/">http://draeton.github.com/stitches/</a></li>
</ul>
<p>This is a personal open source project that received a <a href="http://www.twylah.com/smashingmag/tweets/226007275523936256">mention from Smashing Magazine</a>, was <a href="http://html5weekly.com/archive/79.html">twice-included</a> in the <a href="http://html5weekly.com/">HTML5 Weekly</a> newsletter, and drives over 5000 visitors a month to my personal site. It demonstrates the ability to work with the new HTML5 APIs. Visitors to the repository also see the use of build scripts (Grunt), automated JavaScript documentation (Docker), minification (Uglify), linting (JSHint), and unit testing (QUnit).</p>
<p><a href="https://github.com/draeton/stitches/tree/master/src">Code sample</a></p>
</div>
<div class="span4 highlight-thumbnail">
<img src="/img/projects/stitches.png" width="400" height="250" alt="Stitches"/>
<p class="caption">2012</p>
</div>
</div>
<div class="highlight row-fluid">
<div class="span8">
<h3>Ford » My Saved Items</h3>
<ul class="unstyled well well-small">
<li><a href="http://www.ford.com/mysaveditems/">http://www.ford.com/mysaveditems/</a></li>
<li><a href="http://www.lincoln.com/mysaveditems/">http://www.lincoln.com/mysaveditems/</a></li>
<li><a href="http://www.lincoln.com/cars/mkz/gallery/photos/photo:0/" data-toggle="tooltip" title="See the ‘Save’ link">http://www.lincoln.com/cars/mkz/gallery/photos/photo:0/</a></li>
</ul>
<p>This project involved adding a new feature to the Ford brand websites, including the Save widget, which is syndicated across all Ford shopping tools sites (e.g. Search Dealer Inventory, Certified Pre-Owned). I was the lead front-end developer on this project, which involved integrating code and efforts from a number of different vendors. I am responsible for the front-end code architecture. It demonstrates working with 3rd party authentication, RESTful APIs, JavaScript templates, and URL hash-based navigation.</p>
<p><a href="https://gist.github.com/draeton/4285da1f539cc00d7eed">Code sample</a></p>
</div>
<div class="span4 highlight-thumbnail">
<img src="/img/projects/mysaveditems.png" width="400" height="250" alt="Ford » My Saved Items"/>
<p class="caption"><em>2012 (Team Detroit)</em></p>
</div>
</div>
<div class="highlight row-fluid">
<div class="span8">
<h3>OnStar » Experience OnStar</h3>
<ul class="unstyled well well-small">
<li><a href="https://www.onstar.com/web/portal/experienceonstar">https://www.onstar.com/web/portal/experienceonstar</a></li>
</ul>
<p>This project was essentially a port of an existing Flash module to HTML5, with some additional functionality involved. I was the lead front-end developer on the project. It demonstrates the use of (once again) JavaScript templates, URL hash-based navigation, and the incorporation of 3rd party APIs from Brightcove for HTML5 video. I also rewrote the OnStar Omniture tracking module to be faster and more standards compliant.</p>
<p><a href="https://gist.github.com/draeton/be36b3b5ba1219baeaa1">Code sample</a></p>
</div>
<div class="span4 highlight-thumbnail">
<img src="/img/projects/onstar.png" width="400" height="250" alt="OnStar » Experience OnStar"/>
<p class="caption">2011 (Digitas)</p>
</div>
</div>
<div class="highlight row-fluid">
<div class="span8">
<h3>Ford » Ratings and Reviews</h3>
<ul class="unstyled well well-small">
<li><a href="http://www.ford.com/cars/fusion/reviews/">http://www.ford.com/cars/fusion/reviews/</a></li>
</ul>
<p>This project involved adding a new section to the Ford website. I was the lead front-end developer on this project. I am responsible for the front-end architecture, for which I decided to take a widget-based approach. It demonstrates the use of RESTful APIs and event-based module development.
<p><a href="https://gist.github.com/draeton/93c00021798c6048e954">Code sample</a></p>
</div>
<div class="span4 highlight-thumbnail">
<img src="/img/projects/reviews.png" width="400" height="250" alt="Ford » Ratings and Reviews"/>
<p class="caption">2012 (Team Detroit)</p>
</div>
</div>
<div class="highlight row-fluid">
<div class="span8">
<h3>Mercury Studio » My Local KFC</h3>
<ul class="unstyled well well-small">
<li><a href="http://mylocalkfc.com/">http://mylocalkfc.com/</a></li>
</ul>
<p>Developed a content portal for local KFC franchises to post coupons, promos, pricing, and to allow visitors to create catering menus. I implemented both the front-end, administration section, and MySQL database back-end using the CodeIgniter PHP framework.
<p><a href="https://gist.github.com/draeton/313490416f6e0585e1ce">Code sample</a></p>
</div>
<div class="span4 highlight-thumbnail">
<img src="/img/projects/kfc.png" width="400" height="250" alt="Mercury Studio » My Local KFC"/>
<p class="caption">2010 (Mercury Studio)</p>
</div>
</div>
</section>
<!-- end section -->