One of my recent challenges was to create an application for one of my clients that will enable the end user to be able to choose custom diamond band. Project requirements were pretty straight forward, such as choosing diamond shape, carat size and band color. I had few ideas before I finished reading specs to use vector graphics in flash to manipulate different shapes of diamonds and sizes as well as band colors. However in the end of spec sheet it stated that the entire application should look as much realistic as possible.
I started brainstorming and trying to think what would be the best way to make that application to look realistic, fit within the budget and meet the deadline. Firstly I thought to maybe find a photo of female hand and then match up band and diamond position on top of it and use different hue colors for band however after 15 minute search for such photos I’ve realized that that approach would not work. Diamond perspective position (for 10 different diamond shapes) could never be matched up and resizing them would be a lot of headache.
I decided I’ll make everything in 3d. I’ve purchased some diamond 3d models and female hand 3d model from turbosquid.com.

Diamond models from TurboSquid used for custom diamond chooser

Female 3d hand model used in custom flash application
The hand was fully textured with the bump map however diamonds had no shader and were just plain polygons. Some of their face normals were flipped so it took me some time to clean them up. I needed a good diamond shader. I tried creating one but my time was limited therefore I googled it and found few diamond shaders but none of them where what I was looking for. Finally I’ve found my precious shader on cgsociety.org forum on one of the post replies by very talented 3d artist Steven Hägg-Ståhlberg.

Diamond Shader used in custom diamond chooser application
But to reuse that shading network on my diamonds gave me a little headache. When looking at the shading network it showed that diamond shape node was connected to shading groups:

Diamond Shader Network inside Maya
I’ve tried connecting my diamonds to two shading groups and it just didn’t work for me. I’ve searched the help files and I couldn’t find any answers. I’ve studied the shader in more detail. I’ve checked the perspective view and finally realized that different shader was applied to top faces and bottom faces of a diamond. Because shaders where applied in component mode it was possible for a mesh to belong to 2 shading groups .
One last model that I needed was a band. I could’ve bought it from turbosquid however project specs required a simple band which took only few minutes to model in 3d.

Band 3d model used in diamond chooser flash application
Then I just found a silver shader on highend3d.com and applied it to the band.

Silver shader used in custom flash application
Having all shaders and models I’ve rigged female hand and positioned it the way I wanted. Then I’ve positioned band on the right finger with all diamonds on top of it. I’ve grouped and organized meshes into layers so after I could render each of them separately:

Display Layers in Maya
As you can see I also have the Hi Resolution version of the hand. I’ve smoothed the mesh at the end so it renders nicely.

High Resolution 3d hand used in custom flash application
All diamonds where grouped together. I’ve used that group node to proportionally resize all diamonds at once for different carat sizes. Also group’s pivot point had to be lowered so when diamonds resize they would stay on top of the band all the time. I’ve added a custom attribute to diamonds group called “Carat_Size” which driven scale from 1 to 10.
Then I’ve created 1 plane with gradient shader. 3 spotlights (key,fill and rim). The key light was the only one that was casting raytraced shadows.

Lights Setup in Maya for custom diamond application
The first initial render looked weird and needed alot of tweaking. I had to play with light colors and intensities. The hand didn’t look too realistic:

Initial Render of 3d hand model in custom diamond chooser flash application
I’ve searched for some info on how to recreate a realistic skin shader and found that I should use a mental shader that supports sub surface scattering (SSS) such as fast skin shader… I’ve played with it and finally came up with my final render:

SSS Final Render of custom diamond chooser flash application
Having everything in place I’ve separated hand,band,and diamonds into its own render layers and rendered them with alpha channel. Then I’ve imported everything into photoshop and created alternative band colors.
My last phase of the project was the actual flash application. I’ve imported everything from photoshop to flash and programmed the interface. Some custom events where used to animate carat sizes.
Thank you for reading this article. I hope you’ve learned few things from it.
You can view the final product at www.diamondchooser.com.