For a few weeks, I've been working with various people on updating and organizing our email designs. There have been several tests performed to determine the best way to go about updating the email templates and how to move forward.
One aspect of our emails includes the Social Media portion that lives by the email template footer. The goal was to put more focus on YouTube and getting customers to go subscribe. Additionally some social icons needed updated and reorganized based on clicks. Below is what the social portion looked like before the redesign.
As you can see, the original design was very simple and to the point. With the emphasis on YouTube increasing, I decided to add some imagery and provide more content with the overall design. Below is the design I landed on.
I redesigned the larger YouTube button to mirror other YouTube style guide elements and those from AmericanMuscle.com for consistency purposes. The image I selected is a very exciting one and selected similar ones for the five other Mustang generations we sell for. Marketing provided the bullet points of what to entice customers with to get a sample of what they will find on the channel. Below that I have the updated social icons for the channels that perform best. Overall the height has increased significantly and so has the performance of the overall graphic. Below are the additional video images for the other Mustang vehicles.
This month I also did the creative for ExtremeTerrain.com's monthly sale. I began with a base shot of a rolling JK and composited a more interesting background. Below is the original and the retouched composite.
I needed a TJ version as well so I used the same base shot and rendered a TJ using KeyShot to get the exact angle.
I then took the render into Photoshop, removed the JK in the background but kept the JK wheels instead of having to recreate the blur. The original JK was a 4-door, so I moved the wheels closer together to work with the TJ body. Along with that came adjusting the shadow on the road.
These final composites were then used in various email, site and social graphics to promote the XT April Sale. I treated the typography in email similarly to how it is on site.
The creative is currently running as a homepage banner at ExtremeTerrain.com. Check it out while you can.
I worked on the AmericanMuscle April Sale graphics that are currently online. The copy "unleash your Mustang" was my inspiration in choosing photos of cars on the track from our previous car shows. Several onsite, email and social graphics were created for this sale.
Below are the various photos I used to cover all of the AmericanMuscle Mustang generations.
I created a few graphics for a Rugged Ridge rebate for the AmericanMuscle F-150 site. The rebates and details can be found here at AmericanMuscle.com. Below is the on-site banner featuring the Rugged Ridge rebate. The following image is another on-site banner that viewers are directed to from the rebates page. An email graphic was also designed based off of this creative.
Overall this was a quicker project and all imagery used is in-house product photography.
AmericanMuscle ran another free gift campaign this month where the customer could choose one of eight apparel items if they spent over the set threshold ($150). The graphic designers meet up to discuss the monthly campaigns and bring inspiration to the table. I look at a lot of different sites for inspiration including Rip Curl, Backcountry, The Fasthouse, Fox Racing, Burton, Under Armour, Icon, FMF Exhaust and Roxy to name a few. Pretty much any sort of variety of motorsports, action sports or outdoors-related business are fair game to pull inspiration. With this being an apparel project, I no doubt focused a lot of Fox Racing's web banners and email graphics. I was really drawn to the image below that Fox used as a homepage banner on their site:
I really liked the split imagery, The Fasthouse uses this method a lot as well with their web banners throughout their site. With this project I was finally able to execute this look.
One of our challenges that the designers face is showing giveaway items creatively while also showing the vehicle. For example, this apparel promo would perform best, based on previous testing, with a Mustang also in the creative. With that said, in the past we've incorporated models and Mustangs in shots, and they just haven't performed as great as one would predict. I believed this Fox example would prove to be the most successful blend of showing the apparel and also showing a lifestyle of a mustang. My team agreed, as did the Marketing department, and soon enough the concept was approved.
The next step was to submit a photography request so they could order the eight apparel items for a custom shoot. I provided this example and some additional apparel examples of things I was looking for. Below are the examples I included for the shoot:
The top image is what I envisioned for the on-site graphics. The second image was what another designer brought to our monthly inspirational meeting. I planned to use an image similar to this with tools for the email creative. The goal with the email was to be more mysterious and have the customer guessing what the "free gift" could possibly be. The in-house photographer took a variety of shots based on these examples. The lifestyle portion of the web banner concept would just be pulling from our current in-house photography library on our server.
Throughout the process there were some copy adjustments, but overall the concept was really well received. Below is one of the on-site desktop graphics featuring imagery very similar to the initial concept proposed:
For email, we also ended up going with the split design and ran a copy A/B test. I used a more vague photo of the apparel including the tools. Below are the A/B versions of an email a-spot:
I was really happy with the end result of this project. It's interesting to see how similar the initial concept is with the final creative, yet has its own feel. Below are the rest of the generational lifestyles. This project included desktop and mobile site graphics as well as email a-spot and b-spots.
This year AmericanMuscle wanted to send out an email that focused solely on creativity and the July 4th holiday. The focus would not be to sell products or push customers to the website but rather focus on the friendly message. This email lead to endless creative opportunities and animation was the focus.
All along I had the vision of simple fireworks in the back of a scene. I began by finding a base image that included a photo of the 2015 in the parking lot.
I took that base image into Keyshot and rendered out a 2015 in that exact angle, since this car is primarily stock. Being an aftermarket company, the more aftermarket mods shown, the better. In addition to the 2015 render, I also exported a 2014 render to make this a multi generational shot.
From there the compositing began. I needed to rework the trees so there would be more visible sky behind the two cars in my new composition. I made a selection of the original trees and made a black paint layer of those, while also adding some additional stock trees to get the shape I was looking for. I took the 2015 render and painted in parts of the car to show off the additional aftermarket mods. I placed the 2014 Mustang behind the 2015 and did some post work on the lights to illuminate them.
There was an original request to also have a non animated version for our social channel, so I found some stock fireworks in a warm sky that reminded me a lot like the original image and would work well with the rendered reflections. I added reflections to the windshield as well.
From there it was time to take the layers into After Effects. Without ever opening the program before, I had a lot to learn. I ended up finding some stock video footage that would work well for the fireworks in the sky. I took one piece of footage and split it up to change the timing of each firework so they would overlap and occur within a short sequence. I found a new sky image that did not include any fireworks to use behind the trees and made the fireworks video clips into the Add mode to get rid of their original black background. From there I placed the necessary copy and had myself an animation! I experimented with file dimension and size to see what would work best for Facebook applications. It was critical to view it on desktop and mobile since Facebook treats the same post very differently. For email, I adjusted the layout and made the height a bit shorter to make the file size more manageable. Below was the final gif:
For the first time in After Effects, I could not have been happier with the turnout! I would like to perfect the reflections of the fireworks within the animation, but with the time crunch I believe it gets the job done.
The Wrangler Off-Road Shop is the ExtremeTerrain version of what I previously showed for the Mustang Off-Road Shop. This large project also involved a full logo design, website graphics, email graphics, display banners, social banners and will be featured on the next ExtremeTerrain catalog cover. Below is the logo design:
This project included an in-house photo shoot with the direction being a shot of a Jeep on the dyno within a workshop setting. Below are the retouched photos for a JK Wrangler and TJ Wrangler (retouched by myself and another designer).
This imagery was then transformed into a wide array of applications with a variety of dimensions. Below is a desktop landing page for the Wrangler Off-Road shop along with the unique category icons that were made for each Jeep Wrangler generation that ExtremeTerrain offers.
I will share the catalog cover that my teammate finalized with this creative once it hits the shelves.
Last week I designed the email below for our ExtremeTerrain store. The two versions of the graphic below are a photo composite including a clipped out jeep from our in-house photo collection and three stock images for the background. With some reflection retouching, it came together pretty nicely. The typography and icon usage was inspired by the XT Gift Garage I had posted about earlier. This image was also reworked for an on-site banner for desktop and mobile.
