Skip to main content
Anatomy

How to make an interactive anatomy app

By July 13, 2021May 3rd, 2022No Comments

Introduction

This post is part of the presentation I held for the GNSI’s Visual Scicomm Conference. It’s not literal a representation of what I told, but factually it is. This tutorial gives you the time to look things up and see how I did it. It’s not an elaborate workshop though. I hope someday to have time to make such a workshop.

The application you see here is actually meant to be viewed full screen. You can do that here (the link opens in another tab):

Link to full screen interactive app

The making of the neck vertebrae of Rattus norvegicus.

For the last few years I’ve been working in my spare time on a 3d model of the lab rat. The goal for that model is making a dedicated website that can show all the anatomical features of the rat in an accessible way. I started this project in 2013 and been working on it on and off ever since. In 2013 it took me about 3 months to work out all the major structures of the anatomy, but since then I got a lot better and now it takes me a lot longer 😉. That seems contradictive but it isn’t.

Both my skill set and my knowledge of what is possible have grown substantially over that time and I am one that if I see something I want to be able to do, I keep on trying until I can.

So, as you can imagine, the subject of this lecture isn’t the whole anatomy of the rat, but a part of it. And the order of how I tell this story isn’t how I started but more aimed to getting a good overview. All starts are messy as you all might know.

First of all, I will tell you all about the applications used, about the references I have, how I modeled everything and what I used for that, how I made the 3d model available online and which tools I used for that.

I will also tell you about the problems I encountered and my solutions for them.

And I will tell you about the plan for this and why I do what I do.

The rat

Why did I choose the rat? Mostly out of convenience: frozen rats are easily available as pet food. And they have a manageable size. Mice are a bit too small (but more about that later ) and every other animal is harder to get, too big or has feathers. Plus: there is an enormous amount of papers about almost all aspects of the rat. Given those papers, you would expect the visual data is also up to date and readily available but that turned out disappointing. Most of what I encountered were vague black and white illustrations and most of the visuals were copies of copies of copies.

That made me even more determined to make this anatomical rat.

I am convinced that with the new techniques which I describe here, and more to come in the future, scientific visualization as I and so many other of you within the GNSI make, can rise above “nice to have” and become a real tool for scientific research.

The hardware and the software

Hardware

As you might imagine, I make sure I got the right material to work with. Last year I finally updated my hardware. The pc I had at that time was 10 years old and although I upgraded it several times with new RAM, SSD drives and a newer video card to make it faster, it lived its life. I saved money to really get what I wanted and build the pc myself. These are the specs:

  • Intel(R) Core(TM) i9-9900K CPU @ 3.60GHz
  • Ram: 64,0 GB (63,8 GB beschikbaar)
  • Videocard: GeForce RTX 2080 super
  • And several SSDs and some old HDDs. The later for storage

My old and faithful Wacom Cintiq 21, which I bought back in 2006, didn’t make the transition, at least not as a Cintiq. Now it functions as a screen. I put it in portrait mode so I can use it to see reference material like photos, pdf’s and so on it. I got 3 screens in total. Because my old Cintiq became useless as a pen tablet, I needed another one. Wacom has a lot of different Cintiqs nowadays. I went for the Wacom Cintiq 22. It’s affordable and big enough for me to work on, especially since I do have two other screens. The third screen is a big (55 inch) tv. I’ll probably will be using it during this lecture to be able to see you *and* show stuff at the same time but at the moment I use it mostly as a browser screen. Which is invaluable because a lot of what I do end up online.

All and all this in total set me back about 4750,- euro. It’s enough for now and since I build the pc myself I know what to replace if needed.

I can’t imagine doing my work without the Cintiq so from all this if you want to upgrade your hardware: get a Wacom Cintiq. I know there are other manufacturers on the market, but nothing beats the Cintiq. Don’t buy one with a pc attached to it, money is better spend on an separate pc.

Software

ZBrush.
My first workshop I did for the GNSI back in 2008 was about the use of ZBrush. ZBrush is still my to go to application for almost everything. it’s perfect for organic modeling and even though I do have substance painter, I do almost all my painting and material making in ZBrush.

Blender.
Blender I use for anything I can’t do in ZBrush, like animating and getting realistic renderings. I also use blender to upload my work to Sketchfab.

Adobe Creative Cloud.
I have the complete Adobe Creative Cloud. The applications I most use are After Effects, Premiere Pro and Dreamweaver. And of course InDesign and Acrobat Pro for anything print.

 

I do have other hard and software, but I will tell about that later on.

How I start the modeling process

The modeling itself.

When I first started, back in 2013, I bought 3 frozen rats that where all male (had to choose, and I chose the largest ones). The first one I boiled to get the skeleton. I started modeling the moment I had the complete skeleton out of the soft tissue. By the way: boiled rat stinks. Really bad. The second and third ones I used for photographing all the muscles, intestines and other organs.

That was in 2013. I kept the skeleton and I still have all the photos

So when I started working on the neck vertebrae of the rat a few months ago, I already had the skeleton of the first rat. I noticed that even though it looked good from a distance, I really became a lot better in what I do, not in the least in how I look at details. By working on the rat I of course also got to know its anatomy so much better. These two versions of the Atlas, the first vertebra of the neck, demonstrates that clearly.

With that setup I can make as much photos as I want of a given object small enough to fit on the holder underneath the microscope. Luckily I have enough hard disks to store all that data..

But something bugged me. Because of the big difference in quality and shape of the two versions I wondered if I did had it right this time. 3d modeling for me comes out of a need to understand the stuff I am making because I noticed I keep having trouble with interpreted photos (of muscles for example). So I want to get it into 3d space so I know I’m getting things right.

Because a micro CT scanner is out of my reach (it’s a matter of time, I’m sure of that) I started looking at Photogrammetry to get the dimensions of my work more accurate. If only to check that I had done it right. Because vertebrae of rats are tiny I couldn’t just use a camera or my phone, I needed to use a microscope. Luckily the cheap handheld usb microscopes you can buy on ebay and such aren’t that bad at photographing. And I really didn’t need the smallest details, only the rough shape of the vertebrae. But handheld isn’t practical, so I started searching for a standard to mount the microscope upon. The first one didn’t do the trick, but Ian D. Browne, a paleontologist studying fossil rodents, showed me his setup and so I bought that one. It’s one from Dino-lite that can hold an adjustable staging holder which I bought too.

 

And now I needed to find a good photogrammetry application. There are several apps for free, but I ended up with the Agisoft Metashape Standard Edition application. It’s easy, works intuitively and gives results that are good enough.

For this version of the neck vertebrae I of course already had the original models. I actually used them as a base for both the atlas and the axis. For the other vertebrae I used the models I made with photogrammetry. But, as you can see, that’s only the base. In the end nothing is left from the original but only a vague resemblance.

Building of the atlas.

I build the atlas at first from the original atlas I made back in 2013. Because the mesh of that model was really messed up, the first thing I did was run it through Dynamesh. Dynamesh is a way to get an even mesh without stretching. It’s not perfect but it does the trick if you want to start with something. It gives you space to sculpt in. if you really want to start from scratch there is even a more extreme way to change the mesh: Sculptris Pro. When activated the mesh changes with every stroke you make. If you like to really sculpt what plan to make, this is the tool for you. It gives you unlimited possibilities. But watch out: because of the fact that the mesh changes with every stroke, you easily can lose changes you already made and like. If you have a base that is already a bit to your liking, activate Morph Target. Morph Target stores your current mesh in a way that if you are done with all the changes you want to make and see something that was better at first, you can use the Morph Brush to undo the changes in a specific area. Or subtlety switch between the original mesh and the changed one.

Most of the atlas I did by looking closely at the atlas I have here, using the photos to get a better view and, not unimportant, with my better understanding of the anatomy of this specific vertebra. You might all already watch the app, but I actually show add all the reference papers I used to buildup the model. I’m convinced that one isn’t able to make an accurate presentation of an object if you don’t have an in-depth knowledge of its shape and function. In 2013 I only knew the basics (the basics everyone with a bit of insight knows) of the atlas, now I know why it has the shape it does, what the details are I need to focus on and why they are there. I now am able to see where the muscles and ligaments are attached and I can derive the way the vertebral artery for example goes along the shape of the vertebra. If you watch the old atlas closely you see that I missed all those features then.

So that is what I did: looking closely to the actual atlas I have here, which is no bigger than a fingernail, mostly though my microscope or really, really close to my face (I begin to notice the fact that I’m getting older). That was before I thought of photogrammetry. The model of the atlas looked great and I wanted to be sure it was accurate not only in the details but also in the overall shape. Thus entered photogrammetry. I made about 400 photos of the atlas with my microscope, ran them through Agisoft and exported the model as an obj.

Photogrammetry on this level and with this microscope can’t catch everything, but the fact that it caught the rough shape so accurate was already amazing. It turned out that most of what I did working on just sight was great, the only big difference was the angle of the posterior tubercle, which was much steeper than I modeled it and the angle of the superior articular facet was a bit off.

Modeling of the rest of the vertebrae

I did the axis the same way as I did the atlas, all the other vertebrae I based on the photogrammetry models I made from the vertebrae I have here.

Modeling the soft tissue

The soft tissue was a different story. I didn’t have enough photos of the ligaments, deeper muscles, veins, arteries and nerves associated with these vertebrae, so I dove into the literature. Especially the ligaments and deeper muscles I made educated guesses based on how they are formed in humans *and* the way the vertebrae I modeled are shaped (the places the muscles are attached are visible). The arteries I could derive from literature completely, the veins are a bit educated guesses (I think they are less complicated than in humans if only because of the size difference). Even the nerves were hard to reconstruct because of lack of images in the literature on this level of detail.

Finishing up the model

Because this model is composed out of so much objects and they all intersect and are depended of each other I ended up going back and forth between all the individual objects to get everything in line. Because I knew the vertebrae were absolutely correct, these were the ones I used as a base of reference upon which everything else had to fit.

Painting the model

I used a combination of real live colors, especially for the vertebrae and muscles, and easily recognizable colors because they are used in other anatomical visualizations: yellow for the nerves, blue for the veins, red for the arteries and a bluish white for the ligaments.

Optimizing the model

Because the goal was to build an app with the model the next step was to optimize all the objects in the model. Luckily ZBrush is perfect for optimizing the mesh. I didn’t overdo the optimization because I wanted to keep as much detail as possible, but just so much the app would run smoothly on most devices. Nevertheless the model on Sketchfab is about 33 mb without all the textures. For optimizing I duplicate each object within the model, optimize that using ZRemesher and then copy all the details onto the optimized model form the original highly detailed one by projecting.

After I have done that I uv map all the objects so I can use all the textures to build a realistic model in Sketchfab.

Preparing the model for Sketchfab

Even though you can directly export models out of ZBrush, I almost never do that. The reason for this is that I want to have as much control over the model as possible. So I export the different objects of the model as obj’s and let the model run through the multimap exporter of Zbrush. Depending on the level of detail and the size of the specific object I make the textures as small as possible because even though I mostly upload jpg’s as textures, every texture adds up to the size of the model online. Zbrush exports most textures as tifs, I use Photoshop to change those to jpg because Sketchfab doesn’t handle tifs and in Photoshop I sometimes reduce the size if I forgot to do it in Zbrush. When all the obj’s and textures are finished, I open Blender.

Once in Blender I import all the obj’s. Since they where in a specific orientation in ZBrush you don’t have to worry that you need to re-assemble everything, it just falls into place. In Blender I am able to attach materials to the objects. By giving the materials a recognizable name I make it easier for myself later on. Because the material names are basically one of the most important handles for the Sketchfab api (of which I will tell you in a minute) to use.

I also use blender to animate anything I want animated and I give these animations a name too.

Once ready, for Sketchfab you don’t necessarily need to add the textures in Blender, because you still have to do them in Sketchfab itself, I upload the model to Sketchfab.

Sketchfab

In Sketchfab there is an editor where you can adjust all the settings. In it, you will find a tap with all the material names, which now come in handy to have named them in a proper way, where you can add the textures.

Once the model is uploaded to Sketchfab and published, you can start working on the application. Sketchfab has a viewer api that enables you to control a lot of settings, including hide and show objects within the model, show a specific annotation or start and stop a specific animation. If you want to play with how I made the application, published the code on Github, the dev branch is the one to use.

The application is setup as easy as possible: I separated everything that could be separated into logical units: the look and feel of the page itself, the javascript that controls the page, the data from the model itself and the behavior you want to see in the application when clicking a button. For this presentation it’s a bit too much to explain every single detail of the application, it took me a few months to get there as a non-coder, but the way I set up the application in Github should help you to understand how it is right now.

I used Adobe Dreamweaver to build the look and feel of the application, which is different than what you see in the Github. The reason for this is that the Github is the base for a tabbed version like you see in this post: https://www.miekeroth.com/anatomy/i-made-an-insightful-application-about-the-atlas-of-rattus-norvegicus/

But I wanted to make one that is full screen and doesn’t have any disturbing elements in it. You can see it too as a full screen app if you go to the app and press F11 (on pc). Pressing F11 again will get you back to the browser.

And here all the links mentioned and needed to follow the presentation about the interactive anatomy app.

Links

The application I’ll be talking about:

https://miekeroth.eu/apps/fullscreen_app/rat_neck_app.html

My github:

https://github.com/MiekeRoth/sketchfab

(this is a standardized application with tabs that react to annotations and objects in the model. You can change the number of the model to the number of a model of your own and adjust the annotations and all. We split the code to logical files)

Sketchfab:

https://sketchfab.com/ 

Sketchfab tutorials:

https://sketchfab.com/blogs/community/category/tutorial/

Sketchfab api:

https://sketchfab.com/developers/viewer

Sketchfab model inspector:

https://labs.sketchfab.com/experiments/model-inspector/

(here you can see how sketchfab interprets a model. It can be used to get the data to build your own application)

Zbrush:

http://pixologic.com/

ZBrush core mini (the free version of ZBrush):

https://zbrushcore.com/mini/

Tutorials regarding Zbrush:

http://pixologic.com/zclassroom/

https://www.zbrushguides.com/

https://www.3dconceptartist.com/The-Ultimate-ZBrush-Guide-course

 

Blender:

https://www.blender.org/

Tutorials regarding Blender:

https://cgcookie.com/

 

USB microscope:

https://www.amazon.com/s?k=usb+microscope&crid=3M4WL4ETL4NJE&sprefix=usb+micros%2Caps%2C245&ref=nb_sb_ss_ts-doa-p_1_10

(or any microscope like these that can be plugged into your computer and fits into the dinolite table top stand)

Dinolite table top stand:

https://www.specialtyoptical.com/products.php?product=Dino%252dLite-MS35B-Table-Top-Stand

(or just google it. I got this in the Netherlands)

Dinolite staging holder:

https://www.specialtyoptical.com/product/microscopes/copy-of-dino-lite-msah310-compact-utility-case-case-only/

(or just search for it. I got it also in the Netherlands)

 

Photogrammetry software:

https://www.agisoft.com/

(use the standard edition. It’s more than enough for this work)

And, last but not least: where do you find scientific references? I expect most of you know where to look, but here are my sources:

most importantly: Scihub. Scihub most of the time is available via

https://sci-hub.se/

But I end up googling it most of the time to know where is it is now.

Any article with a doi (digital object identifier) can be entered there and downloaded. While modeling I look op specific papers for specific problems I encounter on a specific subject. Most of the time I have to derive it from other species (human, other rodents) but there is a substantial amount of papers about the rat.

I have an account at

https://www.sciencedirect.com/ 

which is helpful also. But even there I mostly copy the doi and enter it into Scihub.

Scans  and other 3d data of different (animal ) anatomy:

https://www.morphosource.org/

An last but not least: the 3d printer

I forgot to write about the 3d printer I am using. It’s a resin printer and I bought it because it can print rather big for a fair price:  the Anycubic Photon Mono X.  It was on sale on AliExpres, and later also on Amazone. Here the link to the printer on the Anycubic website: https://www.anycubic.com/collections/sales/products/photon-mono-x-resin-printer

And if you want to know more about the printer, there is a very active facebook group about it: https://www.facebook.com/groups/594649514547371

Keep in mind that 3d printers aren’t plug and play, but need tinkering. If you don’t want the hassle of printing stuff once self, there are several 3d print hubs around:

And there are more.

Unrelated, but stuff I printed on this printer 😉

Mieke Roth

Author Mieke Roth

Animal scientist gone information architect gone scientific visualizer. I've got two loves of my life: my son and my work. Luckily I can give them both enough attention.

More posts by Mieke Roth