This year, Nelson Cash launched MyLaCroix.com, a website where you can create your own custom can design and imaginary flavor of LaCroix. The primary inspiration behind the site was LaCroix’s iconic packaging, and it was imperative the can look just right.
So, just how did we take it from IRL to GIF? Here’s a behind-the-scenes look at our creative process:
Step 1: Prepare can
Ever cut an aluminum can? Neither had we. Luckily, this lady had. Turns out cans aren’t perfect cylinders, so most crafters discard the mouth piece. However, we needed to save this element because the design was full bleed. So we cut the mouth of the can into chunks and flattened to scan all of the pieces.
Step 2: Create the SVG
Using Photoshop, we pieced the can back together and used Select Color Range to separate and clean each of the 6 colors. We then took the layered PSD into Illustrator and used Live Trace (a necessary evil ?) to vectorize each layer. We ensured placement of the art was correct (more on that later) and exported the final file as a SVG.
Step 3: Create 3D render
While our developer was busy prepping the SVG, a fellow developer at Nelson Cash created the 3D render using 3D software. Like many art forms, working in 3D is all about building in layers—broad strokes at first, then relentless refinement as you go. Therefore, the initial rendering resulted in a plain can.
Step 4: Apply texture
Once we had the foundation of the can ready, it was time to apply texture. To do this, we completed a process called UV unwrapping. This provided the computer instructions to wrap a 2D image to the 3D object, similar to how we “unwrapped” the physical LaCroix can.
Step 5: Translate to code
Adding real-world effects like lighting and reflection made the can pop.
There you have it! The can in all its natural essence.
Create and share your own flavor at MyLaCroix.com.
Disclaimer: MyLaCroix.com is not affiliated with the manufacturers or distributors of LaCroix products, National Beverage Corp., or any of its related companies, in any way, shape, or can. None of the flavors generated on this site are real. They’re simply figments of your fizzy imagination created by fans, just like you.
This was originally posted on Medium.
Read more from Nelson Cash
by Sarah Gless
Designer at Nelson Cash, a creative studio with roots in Chicago, New York & Los Angeles. Follow us on Medium and Twitter.