ÿþ <!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=iso-8859-1" /> <meta name="description" content="Christopher A. Richards' web portfolio. This site is a collection of examples of work done by graphic designer Chris Richards." /> <meta name="keywords" content="Christopher Richards graphic print design portfolio illustrator photoshop photography computer drawing web natick ma" /> <meta name="distribution" content="Global" /> <meta name="author" content="Christopher Richards" /> <meta name="rating" content="general" /> <meta name="owner" content="chris@christopherarichards.com" /> <meta name="abstract" content="Christopher Richards graphic print design portfolio illustrator photoshop photography computer drawing web natick ma" /> <!--Special thanks to Paul Gallo at ww.No3rdW.com, for helping with some general problems on the site--> <!--Also, thanks to Ariel Flesler for the Scroll To plug in used in the navigation, and to Lokesh Dhakar for the lightbox plug in used to display photos--> <title>Christopher A Richards</title> <script type='text/javascript' src='jquery/jquery-1.2.3.min.js'></script> <script type='text/javascript' src='jquery/jquery.js'></script> <script type='text/javascript' src='jquery/jquery.lightbox-0.5.js'></script> <script type='text/javascript' src='jquery/jquery.lightbox-0.5.min.js'></script> <script type='text/javascript' src='jquery/jquery.lightbox-0.5.pack.js'></script> <script type='text/javascript' src='jquery/jquery.localscroll-min.js'></script> <script type='text/javascript' src='jquery/jquery.localscroll.js'></script> <script type='text/javascript' src='jquery/jquery.scrollTo-min.js'></script> <script type='text/javascript' src='jquery/jquery.scrollTo.js'></script> <!-- <script type='text/javascript' src='jquery/jquery.scrollTo-1.4.2-min.js'></script><script type='text/javascript' src='jquery/jquery.localscroll-1.2.7-min.js'></script><script type="text/javascript" src="jquery/js/jquery.lightbox-0.5.js"></script> --> <link rel="stylesheet" type="text/css" href="css/jquery.lightbox-0.5.css" media="screen" /> <script> $(document).ready(function () { $.localScroll.hash({ target: '#content', duration:1000 }); $.localScroll({ target: '#content', duration: 1000 }); $('.gallery a').lightBox(); }); </script> <style type="text/css"> body { background-color: #2f1110; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; color: #91d0af; font-size: .8em; link: #ffffff; } #body { margin-left: auto; margin-right: auto; width: 738px; } .section { height: 425px; position: relative; width: 610px; } #content { float: left; width: 610px; height: 425px; overflow:hidden; margin-top: 5px; } .gallery { background-color: #2F1110; padding: 10px; } .gallery ul { list-style: none; } .gallery ul li { display: inline; } .gallery ul img { border: 2px solid #fff; border-width: 3px 3px 3px; } .gallery ul a:hover img { border: 2px solid #2f110f; border-width: 3px 3px 3px; color: #fff; } .gallery ul a:hover { color: #fff; } .gallery2 { background-color: #2F1110; padding: 10px; } .gallery2 ul { list-style: none; } .gallery2 ul li { display: inline; } .gallery2 ul img { border: 2px solid #fff; border-width: 3px 3px 3px; } .gallery2 ul a:hover img { border: 2px solid #2f110f; border-width: 3px 3px 3px; color: #fff; } .gallery2 ul a:hover { color: #fff; } #footer { clear: both; background-color: #91d0af; color: #2f1110; padding: 1px; font-size: 1.2em; text-align: center; } #navigation { text-align: center; } #navigation #centernav { width: 538px; margin-left: auto; margin-right: auto; } #navigation #centernav div { float: left; } </style> <link rel="icon" type="image/vnd.microsoft.icon" href="favicon.ico" /> </head> <body link="#ffffff"> <div id="body"> <div style="height:35px; width:738px; border: 0px; background:#2f1110;" align="center"> <img src="head.gif" alt="image"> </div> <div style="height:45px; width:738px; background:#91d0af;" align="center"> <img src="name.gif" alt="image"> </div> <div id="navigation" style="height:34px; width:738px;"> <div id="centernav"> <div><a href="#bio" onmouseover="document.sub_but.src='bioon.gif'" onmouseout="document.sub_but.src='biooff.gif'"><img src="biooff.gif" width="110" height="34" border="0" alt="Read my Bio" name="sub_but" /></a></div> <div><a href="#port" onmouseover="document.sub_but1.src='porton.gif'" onmouseout="document.sub_but1.src='portoff.gif'"><img src="portoff.gif" width="107" height="34" border="0" alt="Look at my Portfolio" name="sub_but1" /></a></div> <div><a href="#art" onmouseover="document.sub_but2.src='photoon.gif'" onmouseout="document.sub_but2.src='photooff.gif'"><img src="photooff.gif" width="107" height="34" border="0" alt="Check out my art" name="sub_but2" /></a></div> <div><a href="#res" onmouseover="document.sub_but3.src='reson.gif'" onmouseout="document.sub_but3.src='resoff.gif'"><img src="resoff.gif" width="107" height="34" border="0" alt="Read my Resume" name="sub_but3" /></a></div> <div><a href="#con" onmouseover="document.sub_but4.src='conon.gif'" onmouseout="document.sub_but4.src='conoff.gif'"><img src="conoff.gif" width="107" height="34" border="0" alt="Feel free to Contact me" name="sub_but4" /></a></div> </div> </div> <div style="height: 430px; width: 738px;"> <div style="float: left; width: 64px;"> <img src="left.gif" alt="image"> </div> <div id="content"> <div id="bio" class="section"> <img src="portrait3.jpg" ALIGN="left"> <p>Hello, and welcome to my site!</p> <p>I m a print and web designer, with several years of experience using Photoshop, Illustrator, Dreamweaver, InDesign, HTML and Flash on both Mac and PC systems.</p> <p>I first started learning about design and computer programming at Needham High School, and after graduating in 2001, I went to Champlain College in Burlington, Vermont. While in school I worked for Rich Frog Industries doing print design, and later interned at the Burlington Free Press. I finished college in 2005 with a Bachelor of Science degree, majoring in Multimedia and Graphic Design. Since then, I ve worked for a wide variety of companies in the greater Boston area. In my spare time I enjoy reading, sports, photography, drawing, films, and music.</p> </div> <div id="port" class="section"> This is a collection of examples of my graphic design work. <div class="gallery"> Logos: <ul> <li> <a href="photos/port01.jpg" title="the Black Sheep Knitting co."><img src="photos/portthumb01.jpg" width="72" height="72" alt="" /></a> </li> <li> <a href="photos/port02.jpg" title="2005 Champlain College Senior Design expo"><img src="photos/portthumb02.jpg" width="72" height="72" alt="" /></a> </li> <li> <a href="photos/port03.jpg" title="Chestnut Bay Fibers"><img src="photos/portthumb03.jpg" width="72" height="72" alt="" /></a> </li> <li> <a href="photos/port04.jpg" title="K9 Klean Up"><img src="photos/portthumb04.jpg" width="72" height="72" alt="" /></a> </li> <li> <a href="photos/port05.jpg" title="Ergot Records"><img src="photos/portthumb05.jpg" width="72" height="72" alt="" /></a> </li> <li> <a href="photos/port06.jpg" title="FMphasis"><img src="photos/portthumb06.jpg" width="72" height="72" alt="" /></a> </li> </ul> other Print Designs: <ul> <li> <a href="photos/port07.jpg" title="Needham Sidewalk Sales Poster"><img src="photos/portthumb07.jpg" width="72" height="72" alt="" /></a> </li> <li> <a href="photos/port08.jpg" title="Black Sheep knitting Sale Poster"><img src="photos/portthumb08.jpg" width="72" height="72" alt="" /></a> </li> <li> <a href="photos/port09.jpg" title="X-ray on Mouse T-Shirt Design"><img src="photos/portthumb09.jpg" width="72" height="72" alt="" /></a> </li> <li> <a href="photos/port10.jpg" title="Fiery Furnaces Poster/Computer Background (unofficial)"><img src="photos/portthumb10.jpg" width="72" height="72" alt="" /></a> </li> <li> <a href="photos/port11.jpg" title="Off Campus 101 Page Layout example"><img src="photos/portthumb11.jpg" width="72" height="72" alt="" /></a> </li> <li> <a href="photos/port12.jpg" title="Rich Frog Catalog example"><img src="photos/portthumb12.jpg" width="72" height="72" alt="" /></a> </li> </ul> </div> <div class="gallery2"> web Design and Coding: <ul> <li> <a href="photos/BSKsite.swf" title="Black Sheep Knittig Flash site"><img src="photos/portthumb14.jpg" width="72" height="72" alt="" /></a> </li> <li> <a href="photos/BinaryClock.swf" title="Binary Clock in Flash"><img src="photos/portthumb15.jpg" width="72" height="72" alt="" /></a> </li> </ul> </div> </div> <div id="art" class="section"> Here are some of my favorite photographs. I've been interested in photography since high school, including printing and developing my own film, and manipulation with photoshop. For more, go to <a href="http://www.flickr.com/photos/crichgraphics/">my Flickr page</a>. Enjoy! <div class="gallery"> <ul> <li> <a href="photos/art01.jpg" title="Macro of a Pink Gerber Daisy"><img src="photos/artthumb01.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art02.jpg" title="Maid of Honor at the Salon"><img src="photos/artthumb02.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art03.jpg" title="An Old Tractor's Fuel Sediment Bowl"><img src="photos/artthumb03.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art04.jpg" title="Group Wedding Photo"><img src="photos/artthumb04.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art05.jpg" title="Overlay of two photo negatives"><img src="photos/artthumb05.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art06.jpg" title="Night Panoramic of a Snowy Landscape"><img src="photos/artthumb06.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art07.jpg" title="White and Orange Flowers"><img src="photos/artthumb07.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art08.jpg" title="Dam and Old Warehouse"><img src="photos/artthumb08.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art09.jpg" title="Charles River and South Natick Falls"><img src="photos/artthumb09.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art10.jpg" title="Shearwater; Live at Berklee"><img src="photos/artthumb10.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art11.jpg" title="Triptych of Bride and Groom"><img src="photos/artthumb11.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art12.jpg" title="Baseball found in back of My Old Middle School"><img src="photos/artthumb12.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art13.jpg" title="Harley Davidson Sportster"><img src="photos/artthumb13.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art14.jpg" title="Yellow Tulip"><img src="photos/artthumb14.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art15.jpg" title="Group photo of Wedding Party"><img src="photos/artthumb15.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art16.jpg" title="The Hold Steady; Live in Boston, MA"><img src="photos/artthumb16.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art17.jpg" title="the Bethel Inn, Panoramic Collage; (full size is 9.5 x 62 inches)"><img src="photos/artthumb17.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art18.jpg" title="Long exposure of traffic at night"><img src="photos/artthumb18.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art19.jpg" title="Harley Davidson Sportster in the Fall"><img src="photos/artthumb19.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art20.jpg" title="the Silver Jews; Live in Cambridge, MA"><img src="photos/artthumb20.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art21.jpg" title="95 North on-ramp and a Tree"><img src="photos/artthumb21.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art22.jpg" title="Charles River Frozen in Winter"><img src="photos/artthumb22.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art23.jpg" title="Bride Walking down the Aisle"><img src="photos/artthumb23.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art24.jpg" title="The flag pole at Needham High School"><img src="photos/artthumb24.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art25.jpg" title="Boston Cityscape at Sunset"><img src="photos/artthumb25.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art26.jpg" title="Macro of Seascape Daisy"><img src="photos/artthumb26.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art27.jpg" title="Newfound Lake at Sunset"><img src="photos/artthumb27.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art28.jpg" title="SOuthnatick Stone Bridge"><img src="photos/artthumb28.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art29.jpg" title="Macro of a Large Sunflower"><img src="photos/artthumb29.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art30.jpg" title="an Old Lloyd LT 600 Pick-up Truck"><img src="photos/artthumb30.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art31.jpg" title="The Hold Steady; Live in Boston"><img src="photos/artthumb31.jpg" width="50" height="50" alt="" /></a> </li> <li> <a href="photos/art32.jpg" title="A Baby in the Summer Evening"><img src="photos/artthumb32.jpg" width="50" height="50" alt="" /></a> </li> </ul> </div> </div> <div id="res" class="section"> <p>Below are the links to download my resume in various formats.</p> <div><a href="Christopher_Richards_Resume.pdf" onmouseover="document.sub_but5.src='pdfon.gif'" onmouseout="document.sub_but5.src='pdfoff.gif'"><img src="pdfoff.gif" width="110" height="34" border="0" alt="Dowload my resume as a PDF" name="sub_but5" /></a></div> <!--<div><a href="Christopher_Richards_Resume.doc" onmouseover="document.sub_but6.src='wordon.gif'" onmouseout="document.sub_but6.src='wordoff.gif'"><img src="wordoff.gif" width="110" height="34" border="0" alt="Dowload my resume as a Word Document" name="sub_but6" /></a></div> --> <div><a href="Christopher_Richards_Resume.rtf" onmouseover="document.sub_but7.src='richtexton.gif'" onmouseout="document.sub_but7.src='richtextoff.gif'"><img src="richtextoff.gif" width="110" height="34" border="0" alt="Dowload my resume as a Rich Text document" name="sub_but7" /></a></div> <br><br> <p>Here's a PDF of my portfolio available for download. </p> <div><a href="christopher_richards_portfolio.pdf" onmouseover="document.sub_but8.src='Portfolioon.gif'" onmouseout="document.sub_but8.src='Portfoliooff.gif'"><img src="Portfoliooff.gif" width="110" height="34" border="0" alt="Dowload my full portfolio as a PDF" name="sub_but8" /></a></div> <br> <p>Here's a PDF of my photography portfolio available for download. </p> <div><a href="CR_photography_portfolio.pdf" onmouseover="document.sub_but9.src='Photoson.gif'" onmouseout="document.sub_but9.src='Photosoff.gif'"><img src="Photosoff.gif" width="110" height="34" border="0" alt="Dowload my photography portfolio as a PDF" name="sub_but9" /></a></div> </div> <div id="con" class="section"> <p>Thank you for visiting my website. I'm interested in doing print or web design, as well as photography, so if you would like to get in contact with me, feel free to use any of the means below:<br> <div style="font-size: 18px;"> <br><b> <br>Christopher Adam Richards <br>17 Pleasant Street South <br>Natick, MA 01760 <br> <br>781-254-0266 <br> <br>Chris@ChristopherARichards.com</b></p> </div> </div> </div> <div style="float:right; width: 64px;"> <img src="right.gif" alt="image"> </div> </div> <div id="footer"> Natick, MA 01760&nbsp&nbsp&nbsp&nbsp&nbsp|&nbsp&nbsp&nbsp&nbsp&nbsp(781) 254-0266&nbsp&nbsp&nbsp&nbsp&nbsp|&nbsp&nbsp&nbsp&nbsp Chris@ChristopherARichards.com </div> <!-- body ---> </div> </body> </html>