Chris Warner in wide brim hat, no background.

Christopher Warner

(407) 773-6423

warder dev logo
WordPress Sites
Outings and Adventures

Outings and Adventures is an aggregate site. Its purpose is to consolidate LGBT exclusive travel options into one place. I am the senior web developer and department supervisor. My duties include assigning tickets to teammates and checking on their progress. I am also in charge of sight maintenance and repairs. I implemented a process of adding listings through web scraping that improved efficiency by 500%. I worked closely with the CEO to develop standards for listings to keep the site looking uniform. I am part of the team that is helping to re-design the look of Outings and Adventures in time for the January New York Times Tradeshow. My work has me using HTML5, CSS3, PHP, GenEx, and Javascript.

Ansel's Creations

Ansel’s Creations is an e-commerce site. Its purpose is to provide a place where users can come to purchase custom made products. The client is a micro company with very little inventory. This was an independent contract I built from start to finish. The client wanted a free template and a basic gallery. I integrated plug-ins that would allow a user to locate and purchase an item. I set up the e-mail client and the commerce account to accept payment. I trained the client on how to use the site and the commerce solution before turning the site over to them.

Totally Fake Dog Breeding Site

This site showcases my understanding of WordPress. I used a dog breeding site as my foundation because it gave me a challenge to create a site that would have to be constantly updated. This prompted me to set up my page so that the content was easy to organize and keep relevant. I built a custom menu containing pages and categories. This page gave me a good understanding of how pages, posts, themes, and plugins work. I also have a good understanding of the dashboard now.

Complete Sites

I developed this site from concept to completion. It allows me to update my dog’s medical records and photo album by logging in and adding information to the database. I can even go back and edit old entries without having to change any code.

Week 8 Project

This site is all about JavaScript and jQuery. This mish mash of user interfaces is designed to showcase my understanding of how each effect works. I love JavaScript and can develop with or without jQuery.

JavaScript Animation
Monty Python Splash Screen

I was asked to create a splash screen for a Monty Python themed web page. My goal with this project was to create an animation that would play before the screen loaded. I wanted to make the project as self-contained as possible. This animation can be used on any web page by simply adding a link to the JS file in the head of the HTML. The JS file adds the appropriate canvas element to the DOM and deletes the element after the animation runs. I set up the file so you can edit the color, font, and event listener quickly at the top of the page. This means you can easily set up this animation to fit with any color scheme and trigger at any event from a page load to a button click.

Art and Design

This is a showcase of the artwork I created for DeVry University. All images and animations were created by me using images from my personal photo library. All media is copyright Christopher Warner.

Storm trooper magasine cover

Storm Trooper Weekly was a project designed to bring together typography, photo editing, and shadow manipulation, to create a finished product. The sky was cut out of the image to get rid of the clouds. A soft blue color taken from a clear portion of the sky was put in its place. The moons were a layer mask of a chunk of lava rock that I then lowered the opacity on and feathered white over to create the effect of a glowing moon. The storm trooper was cut from his original photograph and rotated so the light shining on him was coming from the same direction as the light on the buildings. I then increased exposure on the buildings so the light was as intense as it was on the storm trooper. This unified the foreground and background making it look like it was all part of the original picture. The title was created using white text and black border that I then cast shadow inside of. The inward shadow gave the text the same look as a storm trooper’s armor. The word weekly was inverted to give the title some contrast. The “know your droids” title color was taken from the buildings. This introduced some of that color higher on the page and unified the colors across the page.

thumbnail for an add for a board game

This insert for King of Tokyo was all about cutting out objects, layering them up, and casting shadows. I left the cardboard look of the monsters to add humor to the idea that actual game tokens were invading Tokyo. The table was staged with the game and then the image was cropped from the background for use in this add. I used the burn tool to add shadow across the buildings to show the large game tokens were blocking out the sun. The sky was removed because a sky writer was visible in the original image. In place of the sky an artificial cloudy sky was created using Adobe Photoshop. I added the typography in a wave to fill more of the sky. I added a white border to the tag line and increased the size of the word “big” to give it greater contrast to the background.

thumbnail for a billboard for tech glasses

The billboard was all about blending layers together. It was constructed out of an image of me, an image of some sun glasses, the background billboard, some text and an image of a bar graph. The text block and bar graph images were layered over the sunglasses and the opacity lowered to look as though they were projected on the lenses. The image of me was cut out from its background and light effects were used to make it look as if the advertisement was being projected from the glasses. The image was then warped to make a flat image look like it has depth and it was overplayed on the billboard. This project was constructed in Adobe Photoshop CC.

thumbnail for a gif of Chris Warner cutting out the word Creative

I started by cutting out 2 images of myself. The cutting image and the standing image. I then created the background using colors that complimented the color of my shirt. I used the oil point tool to create a background. The cutout was a layer mask over text and a wood background. I used a sideways grain for the lettering to contrast the vertical strokes of the wall. I added shadow inside the text to make it look like a hole was cut out. I then added shadow to my image as I moved it around to make it seem the wall was real. The falling letters were letters that I warped and added shadow to in order to look like paper falling. The animation was created by hiding layers and revealing them for each animation cell.