MOTION DESIGN
DEVELOPMENT
INFORMATION
CARTIER
Modeling,Animation,Simulation
This project aimed to build out the iconic Cartier Love ring set in as realistic way as possible as well as making a single simulation based animation using the iconic circle shape. For this project I decided on blender for the modeling and rendering and Houdini for the glitter simulation as it was the best mix of speed and flexibility. Modeling in blender is something I can confidently say is a very fluid experience. Having come to blender from Maya its great to have a simplified interface that stays out of the way ( if you take the time to learn the keyboard shortcuts ) Moving between packages was not without its challenges.
First getting a simulation out of Houdini in a way that blender tolerates requires a bit of data massaging. In Houdini you need to make sure to blast any non vertex data as blender can be picky in what is accepts. The next hurdle is getting geometry ( or in this case points ) to run at reasonable speed in blender. Blender does not have a compatible concept of points so anything point related must be converted to vertex data when exporting. A little annoying but tolerable.
QEELIN
MODELING, ANIMTION & RENDERING
BOBO
The Qeelin project required the creation of product models coupled with animations to show off how the jewelry moves. Building models of actual products is always challenging, especially when they have articulation. Luckily we were able to get some view diagrams for a few of the pieces and also had the opportunity to go to their flagship store to see and photograph the actual pieces. This kind of information is not always readily available and is critical to building out convincing models.
slide to reveal
LOTUS
Working in blender and cycles was the clear choice as the deadline was rather short at 4 weeks. The animations were pretty straight forwards with simple rigs for the flower petals ,robot , bear and pig. But the dragon was totally different.
slide to reveal
ROOBOT
XIXI
The client wanted movement like a new years dragon dancer so a mix of RBD ( rigid body dynamics ) simulation and hand animation was the only way to get the natural swinging while also being able to have some control over the timing of the piece. Optimizing the renders is an important part of any project. taking the time to run tests to get renders down as low as possible without losing quality. If you can afford the time hit rendering out to higher resolution and then down-sampling to the target resolution can generally give you a slight improvement of quality at lower render samples as well as reduce noise. Initial renders clocked in at around 8 minutes a frame @ 2k. By the end I had gotten renders down to 4-5 minutes per frame which opened up some space to send over more renders to iterate with the client.
slide to reveal
slide to reveal
CLE DE PEAU
MODELING, ANIMATION & RENDERING
Coming from a background in fashion I have a fascination with packaging and presentation. its probably why I gravitate towards cosmetics, beauty products and simulations. All things that at least in the context of advertising are almost always put next to each other even if the splashes and texture images made for TVCs are shot live and not made in the computer.
This animation was made because I really like the glittery texture inside the packs body. So most of focus in modeling and texturing it was in trying to get that right. It's quite close to the real thing given that I had the product in my hands and could reference it constantly. Modeling the cap took a lot more focus than I assumed going in as the refraction is dependent on the faces being in just the right position. Tweaking materials can help but getting the geometry right is critical.
The simulation for this was done in 3D Studio Max using the PhoenixFD plugin. Its a great tool for this kind of sim given its relative simplicity. Its also more stable than blender's fluid sim tools and faster to setup and test than Houdini's flip fluids tools. Also exporting the alembic for rendering in blender is basically painless.
Building the materials was the most complicated since the glitter texture has to show when viewed at a distance, something that with the real package does not happen. I personally try to build and use procedural textures whenever possible as they offer speed in production but avoiding overly complicated UV unwrapping and tiling issues. The results are also more easily repurposed on other projects since they do not directly depend on the model geometry. In advertising; production speed is critical since deadlines are always tight.
CLINIQUE
MODELING, ANIMATION & RENDERING
Taking from my work as a still life photographer, there are always ideas that
you wish you could do but for one reason or another it just isn't possible.
Either for budget, time, or physical reality. In this case it was all 3.
Building a glass set made up of boxes that have no seams or gaps where glass
overlaps or intersects is a task that no prop stylist would want to willingly
take on unless they had many days and potentially thousands of dollars to pull
it off perfectly.
Since this would be a pretty straight forward execution insofar as modeling
and texturing was concerned, the focus would be on making a nice composition
and pushing the lighting into an interesting direction. In 3D its a bit of cheat
that if your models are not the best or there is something off about any other
aspect that you can just get away with putting it in a dark setting. I did not
want to do this. The set had to be very high key and the reflections could not go
in total darkness. This was easier said than done, and I spent a few days really
cleaning up the lighting and massaging the model to avoid bad reflections. To
this end I also went into detail on the dispenser, getting as perfect a series
of circular details as possible. I had the poly budget since the background was
mainly low poly cubes and planes.
There is another thing to note, the reflections on the body of the pack were
also animated. This is a bit of a hack but the camera move didn't give that
part of the pack enough life for my taste.
SIMULATIONS
Splashes Glitter Explosions Splashing Glitter Explosions
What else is there to say.
Lots actually. Building simulations is the most engaging thing in 3D in my opinion. There is a good mix of technical work, research, programming, and visual focus to keep anyone busy for a lifetime. Simulations are touchy and fickle as you ideally want to build something that is visually plausible without going too far into the realm of physically accurate since; outside of medical/ scientific/technical visualizations we aren't worried about weather or not something could actually happen, only that it looks like it could happen the way it is in the final render. High quality simulations push machines to their limit, as they require the fastest machines you can get your hands on, and more power is always better. Pushing 10s of millions to potentially 100s of millions of particles/voxels/ points around in anything approaching a deadline realistic way is always a balancing act.
BIOTHERM
SIMULATION
Having the opportunity to work put the work in new places is always refreshing. An event and location based project for Biotherm that used AR to play 3d animations with their products. This project was initially built in Cinema4d using Realflow but I moved parts of it to 3D Studio Max and PheonixFD in order to get more control of the swirls. This project actually went out to GLTF as it was going to run on mobile and the goal was to blend the render with the video from the phone camera.
DOLCE & GABBANA
CHARACTER ANIMATIONS
Rigged and animated the D&G heart character that was used in the AR pop up app event. The model was pretty basic and the rig was built in haste as the entire project was 3 weeks and there was a lot of animations that needed to be built. The final result was cute and playful and I think it worked. Ideally there would have been more time, but more time is rarely an option.
MAYBELLINE MOBILE APP
PRODUCT ANIMATION, MOTION GRAPHICS, SIMULATIONS
This project had us building out a sci-fi city street with a first person perspective from a flying car showcasing Maybelline products as holograms in the city. This animation was used as an interstitial during app load for an interactive promotion between Maybelline and Taobao(淘宝), The buildings were laid out by hand based on a gray layout with the cars, trees and other street level objects being placed in a procedural way using geometry nodes in blender. The fluid sim on the first pack was done in 3D studio Max with PheonixFD.
VIKTOR + ROLF
AR APP
MOTION GRAPHICS, PARTICLE SIMULATIONS
This project was to build out 2 flower explosions to be used as effects on scan inside the V+R AR event app. The target was to match the Flower and Spice Bombs that were created for the Perfumes TVCs. Everything was built in 3D Studio Max using TyFlow and rendered out of VRay. TyFlow is a great plugin that makes these kinds of particle systems a breeze. The sims were straight forward with one exception, getting particles of organic shapes takes a bit of massaging, This is where Tyflow really shines, since is CUDA accelerated I was able to iterate very quickly on the relatively low poly assets and get things to work in a few hours. After that it was just the feedback loop with the client to get things just right. The final result matches quite well with the TVC.
This website was built because I had grown tired of using templates and wanted a
way to just make exactly the thing I needed without all the extra fluff and lack of
real ways to make it behave in the ways I wanted.
It is completely written from scratch in HTML, CSS, and JavaScript. There are no libraries or
frameworks used in the design, layout or functionality of the site outside of lottie for the
custom animations scattered throughout the page. Going forward in the development section
there will be use of libraries and I will use the opportunity to make interactive things
while learning how they work.
This site is always going to be a work in progress, so expect things to change as I adapt it
to new work, new tools and new knowledge. I have aimed to have it be as fast
to load as possible and I hope that it has been snappy and responsive for you.
On the carousel there are screen shots of some initial sketches and ideas.
Most of the initial ideas didn't make the cut, but they may make an appearance in the future.
This website took a total of 2 months to design, build and launch, including making new
renders of many of the projects presented herein.
For those who are interested the code is not minified for this iteration of the site, and
while I could in theory post it to github, it would not be at all useful without the
images and videos which I could not actually post there, So feel free to have a look
in your browsers dev mode.
Next on the list if things to do, is a massive refactor to clean up unneeded CSS and tighten up
the JavaScript so its a bit more flexible.
Click the Image to begin
(Requires camera access to enable interactivity)
This project is just an excuse to have a bit a fun while exploring if vanilla JavaScript can in fact be a reasonable way to develop projects similar to what I have done with libraries like p5js and processing. After this test I think It can fill the role just fine. It is actually not any more complicated and in fact in some ways its actually easier to wrap your head around, especially if you want to add functionality by way of libraries. The performance is also better, this demo is only using the 2D context of HTML canvas and is able to run at a reasonable frame rate with 10-15 thousand particles; something that p5js just cannot do without a lot of extra work. I am sure that moving this into the webGL or webGPU contexts can 10x the performance and is something that I will be moving towards for future projects.
In the case of this demo, I used Googles MediaPipe to leverage their ML/AI based pose detection to have the particle system track to the users face and hands. It is not a perfect solution, and in my testing its quite slow to startup and the data you get from it is quite noisy. But this demo shows that it is possible to do tracking with a decent number of particles at good frame-rates in the browser.
Scan with WeChat, click code to close this popup
If it's digital and it moves we can help
Ramon Fernandez is a 3D artist, specializing in motion design and products.
Originally from New York City; he studied Fashion Illustration and Photography
at the Fashion Institute of Technology(F.I.T.) and brings this aesthetic and
approach to all his work.
He brings years of experience from many parts of the commercial art world; ranging from
photography where he shot many still life commercial projects, in production where he was
a studio manager. In film he has directed photography, been a commercial colorist,
D.I.T. , Editor and even done VFX. In motion design he brings all this into the 3d animation,
modeling, lighting, and simulation he produces.
Never afraid to approach modern technology, he is continually experimenting and
incorporating new tools into his work. From combining 3d into photography to using
programming to create art and even going into physical design with 3d printing.
The changing landscape is always a source of excitement. Coming up with creative
solutions to problems is always the focus and he is driven to this goal everyday.
