About jwhisenant

Jacki Whisenant is a student at UW-Madison, studying zoology in order to establish a solid scientific background for pursuing work as a biological illustrator. She is currently a Frontier Fellow at the Wisconsin Institute for Discovery, working on developing drawings where viewers are able to zoom in "google-map style" onto a cross section of various organisms down to the cellular level. She has previously earned a BFA degree in music performance and art. On weekends she repairs and paints bodywork at the family business: Motorcycle Performance.

Spring Semester 2014

Posted on May 15, 2014 by jwhisenant

Images hosted and the code is working!

See the Paramecium map here

(spoiler alert: they’re directly in the middle. I probably should have stuck them off to the side just be annoying – when you’re examining these little guys under a real microscope they never stay quite where you want them)

screenshot of full zoom

The code itself was freely available online (with only a few minor adjustments to stop it from repeating horizontally) and the Bramus tiling script for Photoshop works like a charm. Exporting the images as jpgs was much faster and takes up much less space than pngs.

I’ve also been playing around with text-based images, back before we solved the hosting/accessing images issue

(need to use the “i” as a mask for the tiny letters, rather than trying to make the lines form the image)

Our main hangup was merely finding space where the images could be publicly accessible for the code to use them in the zoomable map. My misconception about Box.com (replacing UW’s “mywebspace”) was that it had image hosting capabilities, though it is really only a folder sharing resource designed for people to individually share files with a selected individual, via a common link that expires after two weeks. Uploading files to it took half an age, as it was only meant for documents, not several hundred small image files.

Looking into renting my own little piece of the internet… I am faced with a number of options. Bluehost is very inexpensive (they have a promotion for $1.68/month for the first year) but various reviews complain of extensive lag and difficulties getting issues resolved. I know that people are much more likely to give a bad review than a good one, so the representation is probably disproportionate. Other review sites give it a generally decent rating, and they claim unlimited storage (but not really).

Myhken’s Webhosting Reviews have lined up several alternatives for comparison: Digital Ocean and RamNode both have good reviews, and seem to be generally comparable.
VPS versus shared hosting vs cloud hosting? The internet seems to thing VPS is better than shared: fewer people grouped onto one server, but cloud is the be-all-end-all at least according to the ones promoting clouds. I’ll probably start with the lowest cost and upgrade when it becomes necessary I suppose.

InfocusAnatomy_webhostingBluehost
Bluehost shared server

InfocusAnatomy_webhostingBluehostVPS
Bluehost VPS

InfocusAnatomy_webhostingDigitalOcean
Digital Ocean (showing 1 GB RAM and 30 GB SSD space)

RamNode (showing 512MB RAM, and 40 GB SSD)

Main question for the moment: Does the “512 MB RAM” refer to the amount of storage space available at this price, or is 40GB SSD the actual storage?

More research tonight, don’t want to jump into anything…

Paramecium test

Posted on April 7, 2014 by jwhisenant

Paramecia Test

The image works as the preview on my computer (when using my external hard drive as a source for the images – I tried storing images directly on my computer but there was not enough room, so the hard drive is necessary)

I don’t think I’m telling it to look in the correct place for the images… Files are uploaded to Box.com, in folders for the different zoom levels:

: Paramecia folder in Box.com

Here is the code I am using:

html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}

var moonMapType = new google.maps.ImageMapType(moonTypeOptions);

function initialize() {
var myLatlng = new google.maps.LatLng(0, 0);
var mapOptions = {
center: myLatlng,
zoom: 1,
streetViewControl: false,
mapTypeControlOptions: {
mapTypeIds: [‘moon’]
}
};

var map = new google.maps.Map(document.getElementById(‘map-canvas’),
mapOptions);
map.mapTypes.set(‘moon’, moonMapType);
map.setMapTypeId(‘moon’);
}

// Normalizes the coords that tiles repeat across the x axis (horizontally)
// like the standard Google map tiles.
function getNormalizedCoord(coord, zoom) {
var y = coord.y;
var x = coord.x;

// tile range in one direction range is dependent on zoom level
// 0 = 1 tile, 1 = 2 tiles, 2 = 4 tiles, 3 = 8 tiles, etc
var tileRange = 1 << zoom;

// don’t repeat across y-axis (vertically)
if (y = tileRange) {
return null;
}

// repeat across x-axis
if (x = tileRange) {
//x = (x % tileRange + tileRange) % tileRange;
return null;
}

return {
x: x,
y: y
};
}

google.maps.event.addDomListener(window, ‘load’, initialize);

Box.com is much better than the original “mywebspace” from UW, with more storage and a much more streamlined uploading system. It does log out periodically, but it is easier to go back and find where I need to pick back up, especially now that the tile images sorted into folders instead of one massive conglomeration.

Cricket is also in progress, and Onion is being re=done, with better representations of cellular organization as far as root nutrient absorption. Even though the onion was supposed to just be a test, I want it to be fully rendered instead.

Work Progressing

Posted on April 6, 2014 by jwhisenant

It’s been a while, but projects are still in the works.

At the present zoom level (with final image 32k x 32k pixels) the simplistic cellular structures that I had originally made for the onion are not large enough to quite convey the complex interactions that are happening with nutrient exchange and transportation, so I think this needs to get bumped up to 64k pixels… or change the zoom level to reflect a greater zoom than is actually represented (not my preferred route).

Grouping the tiles as jpegs within folders rather than as one massive lump sum has made uploading to Box much easier: each “zoom level” has its own separate group, so if an upload is interrupted, it is much easier to see where it needs to be resumed. The largest folder takes about 12 hours to upload, exponentially decreasing the loading time as folders become smaller.

In order to get additional direct source imagery specific to the items I am working on, I am constructing a low-tech travel-sized microscope-camera based on the designs shown in this video:

He has specific instructions here here as well.

I met the designer/inventor Kenji Yoshino through a friend of mine: Molly Rideout, who runs the artist residency Grin City Collective in Grinnell, Iowa. He was a resident artist there last summer and (among many of his creative endeavors) developed this microscope with the intention of making it a resource for doing work in various settings, as well as providing alternative options for schools or programs that do not have access to higher end microscopes. Many thanks to him for posting the instructions as a resource!

I will be picking up the plexiglass today, and hopefully constructing it after work! Having the flexibility to take images of what I am seeing through the microscope will save time when rendering the more detailed aspects of these drawings. The pictures won’t be the best, most amazing quality (I only have an iPod-touch that I will use to capture photos) but their primary use is for reference material, so I don’t have to draw with one eyeball glued to the eyepiece. The university has incredible imaging cameras as well, that can take really amazing high-resolution photographs, as well as more sophisticated view-screen microscopes with various capabilities (I am quite enamored of these and would love to have one sometime in the distant future) – but for my purposes, I am okay with this for now.

More elbow room in Box

Posted on March 2, 2014 by jwhisenant

Images for the onion test are being transferred to “the Box” on my university webspace account (they are retiring the old Goliath server and transferring to the new “Box.com” system this summer, so I figured I’d make the switch right away instead of waiting until summer. The Box has 10GB of space, which also facilitates things… the entire onion file is 1.12 GB and did not fit on the mywebspace).

At home the upload speed of my connection is 2.5 Mbits per second, so I am heading to the library for a few hours to hopefully take advantage of the faster time and avoid waiting 14.5 days for an upload that is just another test image. My computer is slow, my connection is slow, that’s life, so I am doing what I can to facilitate this process.

EDIT: already so much faster!
EDIT EDIT: well, not that much faster… JPEG might be the way to go for test? smaller sizes?

For the final, I am re-doing the main outline to clean up some areas, since every detail really shows up in the large zoom. As I am working on the cell detail in the root area, the main drawing is wibbly enough that it requires some smoothing.
The brushes in Photoshop seem to favor a hard brush rather than a touch=sensitive one for the really close up shots, just to maintain a consistent line for cell walls.

The UW Botany dept is very generous with their time and resources, and I will be using their high-quality scanner to get cross-section images of my onion once it has started to sprout. They have many slides of root cell samples, which have been very helpful with that area of the drawing, but the leaves will have to wait until I have a sample to section and view… so I am growing one.

In the meantime, I am working on the overlaying images for a cricket (Order: Grillidae) based on drawings made during our cricket dissections in Entomology – including transparent underlays of the main outline and other organ systems so that it is easier to see how each organ interacts with other systems.

(image to be added later tonight)

Aspects I would like to figure out:
Lables: how to include them so they link to certain areas of the image and stay within the viewing frame. Most of the Google Maps information talks about linking to atlases, and has good information about creating point labels, but I’m still a little unclear about creating your own specific “street names” (in a manner of speaking) for the parts of the drawing.
Layers: Make it easy to switch back and forth between organ systems at various levels of zoom without having to start at the beginning. The developer page of google maps has some good information on this.

How to feel like a complete idiot:
Attempt doing simple tasks in a medium you are entirely unfamiliar with.

How to learn new things:
See above.

Tiling and Hosting and Post-Its

Posted on February 24, 2014 by jwhisenant

First tiling of the large image done, just as a test (only used plain outline of onion)

Using the Bramus adaptation of various tiling scripts, this version was written as a Photoshop plug-in so it could be done directly, without exporting. The 32k x 32k image took about 2 hours to finish, much smoother than I expected! (this used my plain onion outline, rather than the cell-version still in progress, to test the simplest line for speed. We’ll see how the added detail changes things…)

As a map it worked! With some slight adjustments to the x-axis parameters, (the image was repeating horizontally).
The trick is getting the images posted online so that it can be shared. Seems quite simple… post the images on the “mywebspace” through UW and tell the code where to access them, put code into WordPress, easy-peasy.

MYWEBSPACE
is a monster.

I can only upload files one by one. I can only upload folders if I use the Java Plug-In, which does not work on Chrome and refuses to allow access through both Safari and Firefox, citing that Blackboard (the underlying system of mywebspace, presumably?) does not have sufficient permissions to run, and it errors out, giving this text file when I ask for more details, which only seems to be a list of possible error codes:

Missing required Permissions Manifest Attribute in Main Jar

Missing Application-Name manifest attribute for: https://mywebspace.wisc.edu/xythoswfs/lib/XythosUpload.jar
Java Plug-in 10.51.2.13
Using JRE version 1.7.0_51-b13 Java HotSpot(TM) 64-Bit Server VM
User home directory = /Users/JackiW
—————————————————-
c:   clear console window
f:   finalize objects on finalization queue
g:   garbage collect
h:   display this help message
l:   dump classloader list
m:   print memory usage
o:   trigger logging
q:   hide console
r:   reload policy configuration
s:   dump system and deployment properties
t:   dump thread list
v:   dump thread stack
x:   clear classloader cache
0-5: set trace level to <n>
—————————————————-

I naively tried just dropping the folder of images into my list of folders to get around the problem, but that is just an obtusely simple solution. Mywebspace 1 GB of space, which is enough for the moment, and I’m sure I can request more as it is needed. The uploading issue is something a little bigger. I will try contacting DoIT to see if they have alternative suggestions for navigating this.

I will also have more time to look at this tonight, and most likely will host my images through my work website if I can’t get this sorted. Uploading these one by one would be like wallpapering your house with post-its.

(…. that might actually look pretty interesting, especially with a slight breeze…)

Below: a bit of the level 3 zoom magnification of a (very rough) line drawing of an onion. Each tile 256 x 256.

Maps and Tiles

Posted on February 14, 2014 by jwhisenant

The files for the project are quite large, it takes about 5 minutes to save the largest files. (I know, I know, of course a 32k x 32k image is going to take a long time, what did you expect? Well, I expect my computer to be magical, that’s all. The images for various zoom stages are composed separately (using the same outline as the basis to maintain consistency) and I will be substituting more detailed renderings as needed for the appropriate levels of magnification. I had them grouped as layers for a very short period of time, until it was clear that additional layers seemed to exponentially increase the time required to save my file. This may seem like child’s play to an experienced programer, but I am enjoying learning about it.

In order to be most compatible with the google API, the images are made with these particular pixel dimensions:

256 x 256 ——— 1x magnification
512 x 512 ——— 2x
1024 x 1024 —— 4x
2048 x 2048 —— 8x
4096 x 4096 —— 16x
8192 x 8192 —— 32x (slightly smaller than the 40x equivalent magnification
16,384 x 16,384 — 64x
32,768 x 32,768 — 128x (slightly larger than the 100x equivalent magnification)

I do realize these won’t be precisely accurate, since the first onion image is not exactly at life size – but the 1024 size gets closer to the actual size so I am rounding the estimated measurements up one degree (so the 16,384 is closer to the “40x equivalent”, and the 32k image will be rendered slightly smaller than “100x equivalent”). This should not be an issue for the cricket and for the Paramecium, since the 256 x 256 should be more than enough space for “life size” (a single slide, in the case of the unicellular organism). For larger life forms in the future, these measurements will be adjusted accordingly.

Prof. Kevin Ponto found software for splitting images into ready-made tiles for use in Google Maps API formats: Maptiler Free online, which promises incredibly quick working time: (2 minutes as opposed to 122 minutes, and half the finished file size). This program has very good prospects but is limited to 10,000 px images and it leaves a watermark on the image that is tiled. I will try this one to see how it compares to another free version from Mike Courturier: Tile Generator – test map loading this weekend, hopefully.

Maptiler Start: The next level (costs ~$28 USD, not bad) does not put a watermark on, but it is still limited to 10k pixels and requires(maybe?) 2 CPU cores. That end size will bring us to approximately 40x zoom, which equates to the lowest lens on a standard compound microscope. I have been developing the drawings at 32,768px, which gets me slightly above 100x magnification, which would be ideal. The highest level of magnification would be 400x magnification, but that may be reserved for the Paramecium… (which I probably should have started with, being a single-celled organism…)

Maptiler Pro: The next (and most expensive level at ~$560 USD) offers unlimited size, so I could get the zoom I want, but in addition to the hefty price tag it requires (maybe?) 4 CPU processors.

I think I’m willing to wait a few hours for images to tile. We’ll see though, perhaps a step up would be worth it.

Also posted on jwhisenant.wordpress.com

Conversations and Reference Sources

Posted on February 14, 2014 by jwhisenant

I have had several helpful conversations over the past week, and there have been many good thoughts and suggestions regarding this project.

Kandis Elliot – Scientific Illustrator: Botany Dept./Zoology Dept.
Kandis had lots of advice and was very generous about sharing her process when approaching scientific illustration – after meeting with her I immediately went and made a reference sheet for Photoshop keyboard shortcuts (I knew the basics, but when you are able to fly through the toolset, it cuts your work time down significantly). We talked about information design, image rendering, and dinosaurs!

Sarah Friedrich – Scientific Illustrator and Media Specialist: Botany Dept.
It was very fun to speak with Sarah (after I went to the correct floor…) It is incredibly helpful to explain the scope of a project to different people, even just to articulate my own thought process out loud, as well as hearing alternate perspectives. We talked about layers of design (especially for organisms with multiple systems to represent: digestive/nervous/endocrine/etc) and were tossing around ideas of how that might be approached as a layering process to integrate the system representation, or if they would be completely separate.

Mike Clayton – Photographer/Collection Manager: Botany Dept.
An incredible resource for imaging suggestions – and generously offered the use of the Botany Dept compound microscope with a screen viewer, on Fridays. In addition to the comprehensive resources of the UW, he recommended looking for existing slides from Ripon Microslide for any specific botanical material. He has also compiled some fantastic images of plant material using a nice quality flatbed scanner (one of the many helpful tips: for 3D objects that you don’t want smashed against the glass: scan with an open top in a dark room – the resulting images are dramatically lit with a deep black background).

Some images from the UW collections: excellent reference points for 40x versus 100x magnification. Right now the only available slides are of root tips, so I am growing an onion from a common bulb in order to get leaf cell samples… (I had one in the kitchen but my industrious housemate discarded it… oh well) For the actual rendering, I am drawing one root’s worth and use it for the other root tips as well, adjusting for different curves, etc).

Marianne Spoon – Chief Communications Officer, Science Writer for the Wisconsin Institute of Discovery
We met to go over the scope and plans for this project. Marianne had some great presentation format suggestions – I had been focusing mainly on the individual images but she was talking about how viewers might encounter the image options on a hypothetical website (i.e. possibly in a compiled image with hotspots on an where people could click on an onion/cricket/etc and then go to the zoomable map view. She was also wondering if the image would go even farther out, zooming out to a room, a building, a country, a planet. Perhaps something to consider in the future – maybe seamlessly link to a separate zoom map, since my files are getting quite large just from a “lifesize” viewpoint! She made me really start thinking about the larger integration of these anatomical maps into their intended application or something that I might not have anticipated!

In other news, I have several reference drawings from our entomology lab cricket dissections last week, so I have started compiling initial sketches of the internal systems for an upcoming map.

(also posted on jwhisenant.wordpress.com)

Frontier Fellow Project: In Focus Anatomy

Posted on February 9, 2014 by jwhisenant

In Focus Anatomy (working title)

Through the Wisconsin Institute for Discovery, I will be developing anatomically accurate drawings that will be structured with a “google-map” type of interface, functioning as a virtual microscope. This interactive educational tool will allow the viewer to zoom in to the cellular level on a variety of contrasting organisms, encouraging an active investigation of various life forms.

First image in progess: Onion (Allium)

Start out with basic drawing, then use the outline to guide the higher-detail and the cellular level stages. I will be visiting the Dept. of Botany’s collection in the next few days to look at Allium root slides for reference, to ensure a more accurate depiction of cellular construction.

Project in development: test map will be up very soon!

LEL Project Blog

Author Archives: jwhisenant