forked from laytona/amandalayton.com
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
executable file
·946 lines (828 loc) · 58 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
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
<!DOCTYPE html PUBLIC"-// W3C//DTD XHTML 1.0 Transitional//EN"" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="robots" content="noodp,noydir" />
<meta name="description" content="Amanda Layton's Portfolio" />
<meta name="keywords" content="Amanda Layton, Digital, Graphic Designer, UX, Digital Designer, Illustrator, UK, London, Portfolio" />
<title>Amanda Layton | Digital Designer</title>
<script type="text/javascript" src="js/jquery_v1.4.2.js"></script>
<link rel="stylesheet" href="css/preloader.css" type="text/css"/>
<script type="text/javascript">
$(window).load(function(){
$('div > .image-holder > div').removeClass('preloader');
});
</script>
<link href="css/homepage.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="js/homepage.js"></script>
<link href="css/site.css" rel="stylesheet" type="text/css"/>
<link href="css/scrollingWindow.css" rel="stylesheet" type="text/css"/>
<link href="css/nav.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="js/jquery.scrollable-1.0.3.js"></script>
<script type="text/javascript" src="js/project-browser.js"></script>
<script type="text/javascript" src="js/nav.js"></script>
<script type="text/javascript" src="js/jquery.fancybox-1.3.4.js"></script>
<link href="css/jquery.fancybox-1.3.4.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="js/tooltip.js"></script>
<!--[if IE]><link href="css/ie.css" rel="stylesheet" type="text/css" /><![endif]-->
<!--create fancy box class-->
<script type="text/javascript">
$(document).ready(function() {
$("a.fancybox").fancybox({
'titlePosition' : 'outside',
'overlayColor' : '#140e21',
'overlayOpacity' : 0.9
});
});
</script>
</head>
<body>
<div id="HomePage"></div>
<div id="MainWrapper">
<div id="LeftColumn">
<h1 id="Logo">Amanda Layton </h1>
<ul id="menu" class="nav"><li class="topDivider"><span></span></li>
<li class="digi"><a class="expanded">Digital Design</a>
<ul>
<li class="c4"> <a class="onLoadActive">Channel 4</a></li>
<li class="ns"> <a>Northern & Shell</a></li>
<li class="music"> <a>MyMusic</a></li>
<li class="lbi"> <a>Power Challenge</a></li>
<li class="trinity"> <a>EA Store</a></li>
<li class="football"> <a>EA Football World</a></li>
<li class="wgsn"> <a>Carphone Warehouse<br />TalkTalk</a></li>
<br />
<li class="freelance"> <a>Freelance Work</a></li>
</ul>
</li>
<li class="midDivider"><span></span></li>
<li class="illus"><a class="collapsed">Illustration</a>
<ul>
<li class="comm-illus"><a>Logo's</a></li>
<li class="per-illus"><a>Print</a></li>
</ul>
</li>
<li class="btmDivider"> <span></span></li>
</ul>
<!--/nav-->
<div id="Contact">
<br><br>
<p>Email: <a href="mailto:laytona@gmail.com">laytona@gmail.com</a></p>
<p class="linkedIn">Find me on <span> <a href="http://uk.linkedin.com/in/amandalayton79" target="_blank"><img src="images/ui/linkedin.gif" alt="LinkedIn logo"/></a></span></p>
</div>
<!--/contact-->
</div>
<!--LEFT COLUMN-->
<div id="RightColumn">
<div id="scroller-window">
<div id="MyToolTip">Enlarge</div>
<div id="scroller-vertical">
<div id="scroller-c4-window">
<div id="scroller-c4-wrap">
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/c4/c4-E4-hpg1.jpg" title="<h2>New E4 homepage</h2><p>UI design</p>"><img src="images/portfolio/small/c4/c4-E4-hpg.jpg" title="New E4 homepage - UI design" alt="New E4 homepage - UI design" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/c4/c4-E4-widget1.jpg" title="<h2>New E4 homepage -TX module</h2><p>UI design</p>"><img src="images/portfolio/small/c4/c4-E4-widget.jpg" title="New E4 homepage - TX module" alt="New E4 homepage - TX module" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/c4/c4-e4-video1.jpg" title="<h2>New E4 homepage -TX module</h2><p>UI design</p>"><img src="images/portfolio/small/c4/c4-e4-video.jpg" title="New E4 homepage - TX module" alt="New E4 homepage - TX module" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/c4/c4-watchnext-a1.jpg" title="<h2>4oD New Watch Next functionality</h2><p>UI design</p>"><img src="images/portfolio/small/c4/c4-watchnext-a.jpg" title="4oD New Watch Next functionality" alt="4oD New Watch Next functionality" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/c4/c4-watchnext-b1.jpg" title="<h2>4oD New Watch Next functionality</h2><p>UI design</p>"><img src="images/portfolio/small/c4/c4-watchnext-b.jpg" title="4oD New Watch Next functionality" alt="4oD New Watch Next functionality" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/c4/c4-mvtboxseta-1.jpg" title="<h2>4oD - MVT test to promote Boxsets</h2><p>UI Design</p>"><img src="images/portfolio/small/c4/c4-mvtboxseta.jpg" title="4oD - MVT test to promote Boxsets" alt="4oD - MVT test to promote Boxsets" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/c4/c4-mvtboxsetb-1.jpg" title="<h2>4oD - MVT test to promote Boxsets and buying Boxsets</h2><p>UI Design</p>"><img src="images/portfolio/small/c4/c4-mvtboxsetb.jpg" title="4oD - MVT test to promote Boxsets and buying Boxsets" alt="4oD - MVT test to promote Boxsets" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
</div>
<!-- #scroller-c4-wrap -->
</div>
<!-- #scroller-c4-window -->
<div id="scroller-ns-window">
<div id="scroller-ns-wrap">
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ns/ns-expressbook-hg1.jpg" title="<h2>New Express Bookstore - Homepage</h2><p>UX, UI and art direction</p>"><img src="images/portfolio/small/ns/ns-expressbooks-hpg.jpg" title="VNew Express Bookstore" alt="New Express Bookstore - UX, UI and art direction" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ns/ns-expressbook-genre1.jpg" title="<h2>New Express Bookstore - Genre page</h2><p>UX, UI and art direction</p>"><img src="images/portfolio/small/ns/ns-expressbooks-genre.jpg" title="New Express Bookstore - Genre page" alt="New Express Bookstore - Genre page" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ns/ns-expressbook-cat1.jpg" title="<h2>New Express Bookstore - Category page</h2><p>UX, UI and art direction</p>"><img src="images/portfolio/small/ns/ns-expressbooks-cat.jpg" title="New Express Bookstore - Category page" alt="New Express Bookstore - Category page" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ns/ns-expressbook-prod1.jpg" title="<h2>New Express Bookstore - Product page</h2><p>Design and layout, working with the Spotify brand guideline</p>"><img src="images/portfolio/small/ns/ns-expressbooks-prod.jpg" title="New Express Bookstore - Product page" alt="New Express Bookstore - Product page" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ns/ns-readersoffers-1.jpg" title="<h2>New Express Readers Offers homepage design</h2><p>UX UI and art direction</p>"><img src="images/portfolio/small/ns/ns-readersoffers.jpg" title="New Express Readers Offers homepage design" alt="New Express Readers Offers homepage design" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ns/ns-BTSport1.jpg" title="<h2>New Express Football section with billboard advertising</h2><p>UI design</p>"><img src="images/portfolio/small/ns/ns-BTSport.jpg" title="ew Express Football section with billboard advertising" alt="New Express Football section with billboard advertising" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ns/ns-dailystar-football1.jpg" title="<h2>New Daily Star website</h2><p>UI design</p>"><img src="images/portfolio/small/ns/ns-dailystar-football.jpg" title="New Daily Star website" alt="New Daily Star website" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ns/ns-dailystar-tablet1.jpg" title="<h2>New Daily Star website for tablet</h2><p>UI design</p>"><img src="images/portfolio/small/ns/ns-dailystar-tablet.jpg" title="New Daily Star website for tablet" alt="New Daily Star website for tablet" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ns/ns-dailystar-mob1.jpg" title="<h2>New Daily Star website for mobile</h2><p>UI design</p>"><img src="images/portfolio/small/ns/ns-dailystar-mobile.jpg" title="New Daily Star website for mobile" alt="New Daily Star website for mobile" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ns/ns-lottery-hpg1.jpg" title="<h2>New Bonus Ball added to The Health Lottery website homepage</h2><p>UI design and art direction</p>"><img src="images/portfolio/small/ns/ns-lottery-hpg.jpg" title="New Bonus Ball added to The Health Lottery website homepage" alt="New Bonus Ball added to The Health Lottery website homepage" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ns/ns-lottery-desk1.jpg" title="<h2>New Bonus Ball added to The Health Lottery website results page</h2><p>UI design and art direction</p>"><img src="images/portfolio/small/ns/ns-lottery-desk.jpg" title="New Bonus Ball added to The Health Lottery website results page" alt="New Bonus Ball added to The Health Lottery website results page" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ns/ns-lottery-mob1.jpg" title="<h2>New Bonus Ball added to The Health Lottery mobile site</h2><p>UI design and art direction/p>"><img src="images/portfolio/small/ns/ns-lottery-mob.jpg" title="New Bonus Ball added to The Health Lottery mobile site" alt="New Bonus Ball added to The Health Lottery mobile site" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
</div>
<!-- #scroller-ns-wrap -->
</div>
<!-- #scroller-nd-window -->
<div id="scroller-music-window">
<div id="scroller-music-wrap">
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/mymusic/mymusic-hpg1.jpg" title="<h2>MyMusic a website for music fans to create online magazines to share</h2><p>UI and art direction</p>"><img src="images/portfolio/small/mymusic/mymusic-hpg.jpg" title="MyMusic a website for music fans to create online magazines to share - UI and art direction" alt="MyMusic a website for music fans to create online magazines to share - UI and art direction" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/mymusic/mymusic-discover1.jpg" title="<h2>MyMusic a website for music fans to create online magazines to share</h2><p>UX, UI and art direction</p>"><img src="images/portfolio/small/mymusic/mymusic-discover.jpg" title="New MyMusic Discover section" alt="New MyMusic Discover section" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/mymusic/mymusic-rihanna1.jpg" title="<h2>Pinned content layout with modal overlay for more info</h2><p>UX, UI and art direction</p>"><img src="images/portfolio/small/mymusic/mymusic-rihanna.jpg" title="MyMusic Pinned Content" alt="MyMusic Pinned Content" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/mymusic/mymusic-ed1.jpg" title="<h2>New Featured Page</h2><p>UI and art direction</p>"><img src="images/portfolio/small/mymusic/mymusic-ed.jpg" title="New Featured Artist layout" alt="New Featured Artist layout" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/mymusic/mymusic-headersa-1.jpg" title="<h2>New Featured Page Branding</h2><p>Art direction</p>"><img src="images/portfolio/small/mymusic/mymusic-headersa.jpg" title="New Featured Page Branding" alt="New Featured Page Branding" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/mymusic/mymusic-headersb-1.jpg" title="<h2>New Featured Page Branding</h2><p>Art direction</p>"><img src="images/portfolio/small/mymusic/mymusic-headersb.jpg" title="New Featured Page Branding" alt="New Featured Page Branding" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/mymusic/mymusic-carly1.jpg" title="<h2>MyMusic Competition Design</h2><p>UI and art direction</p>"><img src="images/portfolio/small/mymusic/mymusic-carly.jpg" title="MyMusic Competition Design" alt="MyMusic Competition Design" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
</div>
<!-- #scroller-music-wrap -->
</div>
<!-- #scroller-music-window -->
<div id="scroller-free-window">
<div id="scroller-free-wrap">
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/virgin/hdchannel1.jpg" title="<h2>Virgin Media New Website design</h2><p>UX and art direction for the HD TV section</p>"><img src="images/portfolio/small/virgin/hdchannel.jpg" title="Virgin Media new website design - UX and art direction" alt="Virgin Media New Website design - UX and art direction" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/virgin/bbcompare1.jpg" title="<h2>Virgin Media new website design</h2><p>UX and art direction for the compare sections for all three products - broadband section shown</p>"><img src="images/portfolio/small/virgin/bbcompare.jpg" title="Virgin Media Existing Customer Spotify Offers" alt="Virgin Media Existing Customer Spotify Offers" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/virgin/spotify1.jpg" title="<h2>Virgin Media Spotify Offers for Existing Customer only</h2><p>Design and layout, working with the Spotify brand guidelines</p>"><img src="images/portfolio/small/virgin/spotify.jpg" title="Virgin Media existing customer Spotify offers" alt="Virgin Media Existing Customer Spotify Offers" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/virgin/spotifypackage1.jpg" title="<h2>Virgin Media Spotify Offers for Existing Customer only</h2><p>Design and layout, working with the Spotify brand guideline</p>"><img src="images/portfolio/small/virgin/spotifypackage.jpg" title="Virgin Media existing customer Spotify offers" alt="Virgin Media Existing Customer Spotify Offers" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/virgin/myvm1.jpg" title="<h2>New My Virgin Media homepage login</h2><p>Design and UX to improve click through conversion to key areas</p>"><img src="images/portfolio/small/virgin/myvm.jpg" title="New My Virgin Media homepage login" alt="New My Virgin Media homepage login" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/virgin/superhub-hpg1.jpg" title="<h2>New Virgin Media Super Hub login</h2><p>Art direction, UX and design for the new superhub software</p>"><img src="images/portfolio/small/virgin/superhub-hpg.jpg" title="Virgin Media Super Hub login" alt="Virgin Media Super Hub login" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/virgin/superhub-layout1.jpg" title="<h2>New Virgin Media Super Hub layout examples</h2><p>Art direction, UX and design for the new superhub software</p>"><img src="images/portfolio/small/virgin/superhub-layout.jpg" title="Virgin Media Super Hub login" alt="Virgin Media Super Hub login" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/virgin/helpap1.jpg" title="<h2>Virgin Media desktop help app</h2><p>Art direction and layout design</p>"><img src="images/portfolio/small/virgin/helpap.jpg" title="Virgin Media desktop help app" alt="Virgin Media desktop help app" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
</div>
<!-- #scroller-free-wrap -->
</div>
<!-- #scroller-free-window -->
<div id="scroller-lbi-window">
<div id="scroller-lbi-wrap">
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/power/footy-playmenu1.jpg" title="<h2>Footy! Facebook's only mouse based football game</h2><p>UX, art direction and final asset production</p>"><img src="images/portfolio/small/power/footy-playmenu.jpg" title="Footy! Facebook's only mouse based football game" alt="Footy! Facebook's only mouse based football game" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/power/footy-shop1.jpg" title="<h2>Footy! Facebook's only mouse based football game</h2><p>New UI design for Footy's shop layout</p>"><img src="images/portfolio/small/power/footy-shop.jpg" title="New UI design for Footy's shop layout" alt="New UI design for Footy's shop layout" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/power/footy-winstreak1.jpg" title="<h2>Footy! Facebook's only mouse based football game/h2><p> UI design and final asset production for the Winning Streak section</p>"><img src="images/portfolio/small/power/footy-winstreak.jpg" title="Footy! Winning Streak info page" alt="Footy! Winning Streak info page" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/power/mz-join1.jpg" title="<h2>Manager Zone - online football management game</H2><p>New UI and brand design to encourage new players to join</p>"><img src="images/portfolio/small/power/mz-join.jpg" title="Manager Zone - online football management game redesign" alt="Manager Zone - online football management game redesign" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/power/mztraining1.jpg" title="<h2>Manager Zone - training section</h2><p>New UI to conslidate features which were found on two different pages previously</p>"><img src="images/portfolio/small/power/mztraining.jpg" title="New ManagerZone training section UI" alt="New ManagerZone training section UI" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/power/mztrainingfield1.jpg" title="<h2>Manager Zone - training section</h2><p>New UI to conslidate features and bring in an introduction to the section</p>"><img src="images/portfolio/small/power/mztrainingfield.jpg" title="New ManagerZone training section UI" alt="New ManagerZone training section UI" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/power/power-hpg1.jpg" title="<h2>New Power Challenge website the parent company of Footy! and Manager Zone</h2>Art direction and brand design</p>"><img src="images/portfolio/small/power/power-hpg.jpg" title="New Power Challenge website" alt="New Power Challenge website" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
</div>
<!-- #scroller-lbi-wrap -->
</div>
<!-- #scroller-lbi-window -->
<div id="scroller-trinity-window">
<div id="scroller-trinity-wrap">
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ea/ea-candc41.jpg" title="<h2>Pre-order landing page for Command & Conquer 4</h2>Layout design, final asset production and html code</p>"><img src="images/portfolio/small/ea/ea-candc4.jpg" title="Pre-order landing page for Command & Conquer 4" alt="Pre-order landing page for Command & Conquer 4" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ea/ea-spore1.jpg" title="<h2>Bespoke Spore shop page selling all the Spore titles available</h2><p>Art direction, layout design and final asset production</p>"><img src="images/portfolio/small/ea/ea-spore.jpg" title="Bespoke Spore shop page" alt="Bespoke Spore shop page" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ea/ea-masseffect21.jpg" title="<h2>Pre-order landing page for Mass Effect 2 showing the benefits of ordering pre-ordering the game</h2><p>Layout design, final asset production and html code</p>"><img src="images/portfolio/small/ea/ea-masseffect2.jpg" title="Pre-order landing page for Mass Effect 2<" alt="Pre-order landing page for Mass Effect 2<" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ea/ea-store-hpg1.jpg" title="<h2>New EA Store design</h2><p>New UI design concentrating on platform navigation and brand direction</p>"><img src="images/portfolio/small/ea/ea-storehpg.jpg" title="EA Store new shop design" alt="EA Store new shop design" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ea/ea-store-edge1.jpg" title="<h2>New EA Store product page design showcasing Mirror's Edge</h2><p>New UI design with interactive media, reviews and add to cart functionality</p>"><img src="images/portfolio/small/ea/ea-store-edge.jpg" title="New product page design showcasing Mirror's Edge" alt="New product page design showcasing Mirror's Edge" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ea/ea-store-hpg21.jpg" title="<h2>New EA Store homepage page</h2><p>New UI design with brand, genre and platform navigation"><img src="images/portfolio/small/ea/ea-storehpg2.jpg" title="New EA Store homepage page" alt="New EA Store homepage page" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ea/ea-storesims31.jpg" title="<h2>New EA Store product page design showcasing The Sims 3</h2><p>New UI design with interactive media, reviews and add to cart functionality and previous title section</p>"><img src="images/portfolio/small/ea/ea-storesims3.jpg" title="New product page design showcasing The Sims 3" alt="New product page design showcasing The Sims 3" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ea/eastore1.jpg" title="<h2>New UI succesfully implemented for all EA Store product pages</h2><p>UI design and final asset production"><img src="images/portfolio/small/ea/eastore.jpg" title="Updated UI change for EA Store product pages" alt="Updated UI change for EA Store product pages" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/ea/ea-macdonalds1.jpg" title="<h2>EA Store landing page in partnership with McDonalds</h2><p>Layout design and final asset production"><img src="images/portfolio/small/ea/ea-macdonalds.jpg" title="EA Store landing page in partnership with McDonalds" alt="EA Store landing page for a partnership with McDonalds" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
</div>
<!-- #scroller-trinity-wrap -->
</div>
<!-- #scroller-trinity-window -->
<div id="scroller-football-window">
<div id="scroller-football-wrap">
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/eafw/cokehpg1.jpg" title="<h2>Coca-Cola takeover of EA Football World for the 2010 World Cup</h2><p>Art design and direction working with Coca-Cola's brand guidelines</p>"><img src="images/portfolio/small/eafw/cokehpg.jpg" title="Coca-Cola takeover of EA Football World" alt="Coca-Cola takeover of EA Football World" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/eafw/cokeresults1.jpg" title="<h2>Coca-Cola takeover of EA Football World for the 2010 World Cup</h2><p>Art design and direction working with Coca-Cola's brand guidelines</p>"><img src="images/portfolio/small/eafw/cokeresults.jpg" title="Coca-Cola takeover of EA Football World" alt="Coca-Cola takeover of EA Football World" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/eafw/cokevote1.jpg" title="<h2>Coca-Cola takeover of EA Football World for the 2010 World Cup</h2><p>Art design and direction working with Coca-Cola's brand guidelines</p>"><img src="images/portfolio/small/eafw/cokevote.jpg" title="Coca-Cola takeover of EA Football World" alt="Coca-Cola takeover of EA Football World" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/eafw/ea-ls-becks1.jpg" title="<h2>EA Football World Adidas sponsored My Season competition</h2><p>UI design and art direction working with Adidas brand guidelines</p>"><img src="images/portfolio/small/eafw/ea-ls-becks.jpg" title="Adidas sponsered My Season competition" alt="Adidas sponsored My Season competition" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/eafw/ea-ls-playerform1.jpg" title="<h2>EA Football World Adidas sponsored My Season competition</h2><p>UI design, art direction and final asset production working with Adidas brand guidelines</p>"><img src="images/portfolio/small/eafw/ea-ls-playerform.jpg" title="Adidas sponsered My Season competition" alt="Adidas sponsered My Season competition" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/eafw/ea-ls-formhistory1.jpg" title="EA Football World Adidas sponsored My Season competition</h2><p>UI design, art direction and final asset production working with Adidas brand guidelines</p>"><img src="images/portfolio/small/eafw/ea-ls-form.jpg" title="Adidas sponsered My Season competition" alt="Adidas sponsered My Season competition" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/eafw/ea-videoreplay1.jpg" title="<h2>EA Football Goal of the week competition</h2><p>UI design, art direction and final asset production</p>"><img src="images/portfolio/small/eafw/ea-videoreplay.jpg" title="Goal of the week competition designe" alt="Goal of the week competition design" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/eafw/ea-fifavideo1.jpg" title="<h2>EA Football Goal of the week competition</h2><p>UI design, art direction and final asset production</p>"><img src="images/portfolio/small/eafw/ea-fifavideo.jpg" title="Goal of the week competition designe" alt="Goal of the week competition design" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/eafw/ea-videoweek1.jpg" title="<h2>EA Football Goal of the week competition</h2><p>UI design, art direction and final asset production</p>">"><img src="images/portfolio/small/eafw/ea-videoweek.jpg" title="Goal of the week competition design" alt="Goal of the week competition design" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/eafw/ea-wallpapers1.jpg" title="<h2>ESPN sponsored wallpaper designs for specific teams showing their fixtures</h2><p>Art direction and final asset production</p>"><img src="images/portfolio/small/eafw/ea-wallpaper.jpg" title="ESPN sponsored wallpaper designs" alt="ESPN sponsored wallpaper designs" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
</div>
<!-- #scroller-football-wrap -->
</div>
<!-- #scroller-football-window -->
<div id="scroller-wgsn-window">
<div id="scroller-wgsn-wrap">
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/cpw/cpw1.jpg" title="<h2>Carphone Warehouse hompeage redesign</h2><p>UX and art direction </p>"><img src="images/portfolio/small/cpw/cpw.jpg" title="Carphone Warehouse hompeage redesign" alt="Carphone Warehouse hompeage redesign" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/cpw/talktalkone1.jpg" title="<h2>Original TalkTalk homepage design</h2><p>UX design and art direction</p>"><img src="images/portfolio/small/cpw/talktalkone.jpg" title="Original TalkTalk homepage design" alt="Original TalkTalk homepage design" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/cpw/talktalktwo1.jpg" title="<h2>Updated TalkTalk design to match nation wide TV ad campaign</h2><p>UX design and art direction</p>"><img src="images/portfolio/small/cpw/talktalktwo.jpg" title="Updated TalkTalk design to match nation wide TV ad campaign" alt="Updated TalkTalk design to match nation wide TV ad campaign" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/cpw/talktalkthree1.jpg" title="<h2>Updated TalkTalk website redesign to include new shop functionality</h2><p>UX design and art direction</p>"><img src="images/portfolio/small/cpw/talktalkthree.jpg" title="Updated TalkTalk website redesign" alt="Updated TalkTalk website redesign to include new shop functionality" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/cpw/sains-home1.jpg" title="<h2>Sainsbury's Mobile section in partnership with The Carphone Warehouse</h2><p>UX design and final asset production working with Sainsbury's guidelines</p></p>"><img src="images/portfolio/small/cpw/sains-mobilehome.jpg" title="WGSN editorial page" alt="WGSN webpage showing a female modelling 3 cosmetic trends" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/cpw/sains-payasyougo1.jpg" title="<h2>Sainsbury's Mobile section</h2><p>UX design and final asset production working with Sainsbury's guidelines</p>"><img src="images/portfolio/small/cpw/sains-payasyougo.jpg" title="Sainsbury's Mobile sectione" alt="Sainsbury's Mobile section PAYG phones" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/cpw/sains-paymonthy1.jpg" title="<h2>Sainsbury's Telecom section</h2><p>UX design and final asset production working with Sainsbury's guidelines</p>"><img src="images/portfolio/small/cpw/sainsburys.jpg" title="Sainsbury's Telecom section" alt="Sainsbury's Telecom section" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
</div>
<!-- #scroller-wgsn-wrap -->
</div>
<!-- #scroller-wgsn-window -->
<div id="scroller-freelance-window">
<div id="scroller-freelance-wrap">
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/freelance/free-fifa-hpg1.jpg" title="<h2>Fifa 14 - Facebook Spot the Ball Pitch</h2><p>UI design and art direction</p>"><img src="images/portfolio/small/freelance/free-fifa-hpg.jpg" title="Fifa 14 - Facebook Spot the Ball Pitch" alt="Fifa 14 - Facebook Spot the Ball Pitch" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/freelance/free-fifa-enter1.jpg" title="<h2>Fifa 14 - Facebook Spot the Ball Pitch</h2><p>UI design and art direction</p>"><img src="images/portfolio/small/freelance/free-fifa-enter.jpg" title="Fifa 14 - Facebook Spot the Ball Pitch" alt="Fifa 14 - Facebook Spot the Ball Pitch" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/freelance/free-fifa-play1.jpg" title="<h2>Fifa 14 - Facebook Spot the Ball Pitch</h2><p>UI design and art direction</p>"><img src="images/portfolio/small/freelance/free-fifa-play.jpg" title="Fifa 14 - Facebook Spot the Ball Pitch" alt="Fifa 14 - Facebook Spot the Ball Pitch" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/freelance/mainmenu1.jpg" title="<h2>Monkey Dectective iPad game main menu screen</h2><p>UI design, art direction, all the illustrations and final asset production</p>"><img src="images/portfolio/small/freelance/mainmenu.jpg" title="Monkey Dectective iPad game" alt="Monkey Dectective main menu screen" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/freelance/waterworld1.jpg" title="<h2>Monkey Dectective iPad game screen showing the mechanics of the wipe and find action</h2><p>UI design, art direction, all the illustrations and final asset production</p>"><img src="images/portfolio/small/freelance/waterworld.jpg" title="Monkey Dectective iPad game" alt="Screen showing the game mechanics of the wipe and find action" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/freelance/petsfarm-score1.jpg" title="<h2>Monkey Dectective iPad game showing the correctly found animal image enlarged</h2>UI design, art direction, all the illustrations and final asset production</p>"><img src="images/portfolio/small/freelance/petsfarm-score.jpg" title="Monkey Dectective iPad game" alt="Game screen showing the full score screen and the correctly found animal image enlarged" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/freelance/wild1.jpg" title="<h2>Monkey Dectective iPad game showing the final score for that section</h2><p>UI design, art direction, all the illustrations and final asset production</p>"><img src="images/portfolio/small/freelance/wild.jpg" title="Monkey Dectective iPad game showing the final score for that section" alt="Monkey Dectective iPad game showing the final score for that section" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
</div>
<!-- #scroller-freelance-wrap -->
</div>
<!-- #scroller-freelance-window -->
<div id="scroller-comm-illus-window">
<div id="scroller-comm-illus-wrap">
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/logos/eastore-logo1.jpg" title="<h2>EA Store</h2><p>Updated new logo design to match the rest of the EA portfolio</p>"><img src="images/portfolio/small/logos/eastore-logo.jpg" title="EA Store logo" alt="EA Store logo" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/logos/feckthefees1.jpg" title="<h2>Feck the Fees logo</h2><p>Facebook game - helping students help students</p>"><img src="images/portfolio/small/logos/feckthefees.jpg" title="Feck the Fees logo" alt="TFeck the Fees logo" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/logos/monkeydetective1.jpg" title="<h2>Monkey Detective logo</h2><p>An iPad game for young children. I did all the illustrations for the game.</p>"><img src="images/portfolio/small/logos/monkeydetective.jpg" title="Monkey Detective iPad game" alt="Monkey Detective iPad game" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/logos/vintage-lala1.jpg" title="<h2>Vintage La La logo</h2><p>Vintage La La sells home furnishings and related goods through local markets or online</p>"><img src="images/portfolio/small/logos/vintage-lala.jpg" title="Vintage La La logo" alt="Vintage La La logo" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/logos/pophive1.jpg" title="<h2>Pop Hive new logo</h2><p>Launching soon</p>"><img src="images/portfolio/small/logos/pophive.jpg" title="Pop hive logo" alt="Pop hive logo" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/logos/vrlogo1.jpg" title="<h2>Voice Register</h2><p>An online petition website</p>"><img src="images/portfolio/small/logos/vrlogo.jpg" title="An online petition website" alt="An online petition website" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/logos/spb-logo1.jpg" title="<h2>Southampton Property Buyers logo</h2>"><img src="images/portfolio/small/logos/spb-logo.jpg" title="Southampton Property Buyers logo" alt="Southampton Property Buyers logo" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
</div>
<!-- #scroller-comm-illus-wrap -->
</div>
<!-- #scroller-comm-illus-window -->
<div id="scroller-per-illus-window">
<div id="scroller-per-illus-wrap">
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/print/ftf-flyer1.jpg" title="<H2>Feck the Fees advertising flyer</H2><p>Art direction and design</p>"><img src="images/portfolio/small/print/ftf-flyer.jpg" title="Feck the Fees flyer" alt="Feck the Fees flyer" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/print/ftf-poster1.jpg" title="<H2>Feck the Fees poster</H2><p>Art direction and design</p>"><img src="images/portfolio/small/print/ftf-poster.jpg" title="Feck the Fees poster" alt="Feck the Fees poster" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/print/SPB-paper1.jpg" title="<H2>SPB newspaper adverts</H2><p>Art direction and design</p>"><img src="images/portfolio/small/print/spb-paper.jpg" title="SPB newspaper adverts" alt="SPB newspaper adverts" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/print/print-redalert1.jpg" title="<H2>Red Alert EA Store Employee offer poster</H2><p>Layout design</p>"><img src="images/portfolio/small/print/print-redalert.jpg" title="Red Alert EA Store employee offer poster" alt="Red Alert EA Store Employee offer poster" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/print/sains-xmas1.jpg" title="<H2>Sainsbury's Mobile Christmas offer leaflet</H2><p>Art direction and layout design</p>"><img src="images/portfolio/small/print/sains-xmas.jpg" title="Sainsbury's Mobile Christmas leaflet" alt="Sainsbury's Mobile Christmas leaflet" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/print/sainsburys-leaflet1.jpg" title="<H2>Sainsbury's Mobile offer leaflet</H2><p>Art direction and layout design</p>"><img src="images/portfolio/small/print/sainsbury-leaflet.jpg" title="Sainsbury's Mobile offer leaflet" alt="Sainsbury's Mobile offer leaflet" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/print/print-studentmob1.jpg" title="<H2>Student Buyers guide design</H2><p>Art direction and layout design</p>"><img src="images/portfolio/small/print/print-studentmob.jpg" title="Personal illustration" alt="Stencil illustration of female sat on kerb" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/print/carat-car1.jpg" title="<H2>Promotional inhouse leafet to win a racing day out</H2><p>Art direction, concept and layout design</p>"><img src="images/portfolio/small/print/carat-car.jpg" title="Promotional inhouse leafet to win a racing day out" alt="Promotional inhouse leafet to win a racing day out" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
<div class="project">
<div class="image-holder">
<div class="preloader"><a class="fancybox" href="images/portfolio/big/print/carat-comp1.jpg" title="<H2>Promotional inhouse leafet to win a digital camera</H2><p>Art direction, concept and layout design</p>"><img src="images/portfolio/small/print/carat-comp.jpg" title="Promotional inhouse leafet to win a digital camera" alt="Promotional inhouse leafet to win a digital camera" /></a></div>
</div>
<!-- .image-holder -->
</div>
<!-- .project -->
</div>
<!-- #scroller-per-illus-wrap -->
</div>
<!-- #scroller-per-illus-window -->
</div>
</div>
<div class="project-dots" id="project-dots-c4"></div>
<!-- pagination -->
<div class="project-dots" id="project-dots-ns"></div>
<!-- pagination -->
<div class="project-dots" id="project-dots-music"></div>
<!-- pagination -->
<div class="project-dots" id="project-dots-free"></div>
<!-- pagination -->
<div class="project-dots" id="project-dots-lbi"></div>
<!-- pagination -->
<div class="project-dots" id="project-dots-trinity"></div>
<!-- pagination -->
<div class="project-dots" id="project-dots-football"></div>
<!-- pagination -->
<div class="project-dots" id="project-dots-wgsn"></div>
<!-- pagination -->
<div class="project-dots" id="project-dots-freelance"></div>
<!-- pagination -->
<div class="project-dots" id="project-dots-comm-illus"></div>
<!-- pagination -->
<div class="project-dots" id="project-dots-per-illus"></div>
<!-- pagination -->
<div id="NextBtn"><span>|</span>
<a id="button-next-project-c4" class="button-next-project">Next</a>
<a id="button-next-project-ns" class="button-next-project">Next</a>
<a id="button-next-project-music" class="button-next-project">Next</a>
<a id="button-next-project-free" class="button-next-project">Next</a>
<a id="button-next-project-lbi" class="button-next-project">Next</a>
<a id="button-next-project-trinity" class="button-next-project">Next</a>
<a id="button-next-project-football" class="button-next-project">Next</a>
<a id="button-next-project-wgsn" class="button-next-project">Next</a>
<a id="button-next-project-freelance" class="button-next-project">Next</a>
<a id="button-next-project-comm-illus" class="button-next-project">Next</a>
<a id="button-next-project-per-illus" class="button-next-project">Next</a></div>
</div>
<!--RIGHT COLUMN-->
<div class="Clear"></div>
</div>
<!-- # MainWrapper-->
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-5563439-4']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>