Posts Tagged ‘DNA polarity’

OnScreen DNA Model for iPad and iPhone: New Name, More DNA Background

Tuesday, September 28th, 2010

I’m pleased to say that OnScreen Science has a new iPad app on the iTunes App Store—OnScreen DNA Model 2.0—with another app—OnScreen DNA Model for iPhone 2.0—awaiting review and hopefully available in a matter of days. Actually, they are major updates of apps previously called OnScreen DNA Lite and are free to anyone who purchased either of those apps.

The main change to the two apps is the addition of accessible background material on DNA and explanations of how different features of DNA structure are represented in the virtual DNA model in a memorable, instructive way. For example, there are now discussions of DNA strand polarity—what it means and how it is represented in the model—and the major and minor grooves of the DNA double helix—what they are, their physical origin, and how to make them appear in the model. This new material makes the apps more self-contained than before, although they are still not meant to be a sole source for learning about DNA structure. The point is made that the model represents certain molecular components of DNA, not atoms.

The new material is found in a popover view in the iPad version of OnScreen DNA Model. The popover view appears at the tap of a new button called “Useful Stuff”. The image below shows the interactive table of contents listing the various topics dealt with. The user only has to tap on a disclosure button (blue arrow) to see a discussion of the corresponding feature and how it is modeled in the app.


Below is shown the Nucleotides item, or rather the beginning of it since there is more text to be read after scrolling down in the app.

nucleotide discussion

Because of the smaller screen size the iPhone app cannot display the full table of contents on a screen, but all items can be seen and accessed by scrolling. The content of the various items are the same in iPad and iPhone versions of OnScreen DNA Model. Below is the top of the table of contents in the iPhone app.

iphone contents

Seen below is the Nucleotides item from the topic list. Less text is visible at a time in the iPhone version, but everything in the iPad version is accessible by scrolling. The text shown below is what would be seen in the iPad version after scrolling down from the point shown in the iPad example above.

iphone item

Why the name change? OnScreen DNA Lite implies there is a “full” or standard version, but there isn’t. “Lite” also gives the idea of limitations, perhaps severe limitations. The name just sort of snuck over from the desktop software, where there are Lite, Standard, and Pro versions of OnScreen DNA. Each higher version adds something to the version at the level below it, and there is a policy of letting customers apply the price they’ve already paid to the price of the higher level version whenever they want to upgrade. That is not possible for an app, given the way the iTunes App Store is set up.

The plan is to bring some of the simulations of DNA processes to the iPad (less likely to the iPhone with its smaller screen) in the future, but the names of those apps will more directly reflect what they simulate.

In any case, OnScreen DNA Model perfectly fits the app, which consists of a virtual 3D model designed to make essential features of DNA readily apparent. It is a superior model that stands on its own and shouldn’t have a name that could diminish it in the mind of anyone first encountering it.

While the name and the extended background guide are new, the basics of the model remain the same as presented in earlier blog posts: OnScreen DNA Lite™ for iPhone Now Available, An OnScreen DNA Lite™ for iPad Gallery, and The Thinking Behind the OnScreen DNA Lite™ iPad App. See the iTunes App Store descriptions of OnScreen DNA Model and OnScreen DNA Model for iPhone and iPod Touch too of course.

An OnScreen DNA Lite™ for iPad Gallery

Tuesday, May 4th, 2010

Apple’s iTune App Store provides one standard way (and place) for “apps” developed for the iPhone and iPad to be displayed. The app store listing is really a pretty good way to learn something about an app once you’ve managed to reach the page devoted to it. Apple lets developers describe the app in under 4,000 characters and choose up to five screen shots of the app for display in its listing. The screen shots are presented without captions, so they basically need to tell their own story.

I chose the screen shots used for the OnScreen DNA Lite listing on the iPad app store with the aim of trying to show various features, but I think a little description could be useful, so I’m presenting here those same screen shots with some explanatory text. The dimensions of these screen shots have been squeezed down to fit into the blog column, so the area of the images is less than a quarter of the iPad display’s.

Here below is the thirty-five base-pair double helix of OnScreen DNA Lite’s virtual model. Note the row of control buttons at the top. The display mode is what we have called “Balloon,” which just means that the balls used to represent molecules in the DNA structure are substantially larger than they are in the “Skeletal” mode in which the double helix structure may be more apparent. The Balloon mode is closer to the “space filling” representations sometimes shown, but not so much as to hide the structure. Since Balloon mode is in use, the button that controls this feature reads “Skeletal” to indicate that a tap of it will shift to the Skeletal representation.

double helix

The sticks connecting the balls (molecules) in the model represent chemical bonds, which are less apparent in the Balloon mode. The model is shown above with “Tilted Bonds” (a button choice), which means that the sticks representing the glysosidic bonds between the deoxyribose phosphate molecules (white balls) and the nitrogenous bases (colored balls) are at an angle to the line between opposite sugar phosphates in the DNA strands. This bond tilting is what causes the unequal spacing of the grooves (major and minor) that wind around the double helix structure. I expect to add a feature for making it obvious what these grooves are in a future update. The text in the panel above the image makes the point that the model with unequal grooves is more like the real DNA structure than the simpler model used for the simulations.

Note that the bottom of the screen shots show the base sequences of the DNA strands of the model using the familiar letters GCAT (for guanine, cytosine, adenine, and thymine). The color coding is the same for the linear (letter) representation and the model.

The screen shot below shows the popover view that has the key to the model of OnScreen DNA Lite. It gives the names of all the molecules and chemical bonds shown in the model. Note that the phosphodiester bond has two parts indicated. The bond is shown with two colors to make it clear that there is a polarity to the DNA strands, and that they are of opposite polarity (“point” in opposite directions).


The screen shot below shows the DNA model with one of the two strands hidden, which is accomplished by a button tap. This makes the helical structure of each strand apparent. Note that this shot is with the Skeletal mode selected. Natural DNA is right-handed, meaning that a strand circles around the axis of the helix in a clockwise fashion as it advances down the axis. This handedness may be easier to see with a single strand. To further make the concept of handedness clear, OnScreen DNA Lite also has the option to show what left-handed DNA would look like. In the screen shot the model has been rotated to the side and held there. This is easily (and satisfyingly) accomplished by a swipe of a finger on the iPad screen.

single strand

In addition to displaying the DNA model in various static (though rotatable) forms, OnScreen DNA Lite features a couple of simulations of phenomena that can occur with DNA in the laboratory. The first is denaturation, in which heating the DNA breaks the hydrogen bonds that keep the two strands joined together, thus allowing the strands to separate as single threads no longer bound to a helical shape. The screen shot below shows the two strands after denaturation has occurred, but the simulation that preceded it would have shown the strands being stretched and jiggled as the temperature increased, with individual bonds breaking until the double helix couldn’t be maintained. Note that, while showing that the hydrogen bonds are the most easily broken, an essential property for the functioning of DNA, which requires controlled strand separation at life-supporting temperatures (not the boiling temperature that brings on denaturation), denaturation is not a natural process occurring in living cells.


After the DNA strands have been separated in denaturation, it is possible (after the temperature has subsided) for them to recombine in the opposite process called renaturation. A few bases in one strand may come into sufficient contact with their complementary counterparts in the other strand to form a string of hydrogen bonds which can serve to hold the strands together long enough for other bonds to reform. This can be simulated in OnScreen DNA Lite after denaturation has occurred. The screen shot below captures an instant in the renaturation process after much of the double helix has been reformed, but before the process has been completed.


Screen shots can be useful in getting a picture of what an app is like, but static pictures can’t really do justice to an app with dynamic simulations and with a model that can be rotated by touch. For the true experience you’ll need an iPad and the OnScreen DNA Lite app. But soon there will be a version for the iPhone and iPod Touch. For more on OnScreen DNA Lite for iPad see The Thinking Behind the OnScreen DNA Lite™ iPad App.

The Thinking Behind the OnScreen DNA Lite™ iPad App

Friday, April 2nd, 2010

My first iPad app, now ready for sale on the iTunes App Store even before the iPad has gotten into many hands, is called OnScreen DNA Lite. Check it out! I plan to relate something of the hectic development of this app in a later post. Here my aim is to describe the iPad app a little and to motivate its development. The app is based on OnScreen DNA, a science education program I created a few years ago, first for the Macintosh OS X, and somewhat later for the Windows side. My primary goal in developing OnScreen DNA was to provide students (and all persons interested in DNA) with a way to reach a deeper, more intuitive understanding of DNA structure than I felt they were likely to obtain from reading text and looking at two-dimensional static images of a DNA model. I wanted to create a virtual, three-dimensional model that had most of the virtues of a real, physical one plus the enhanced power to simulate DNA processes with animations.

OnScreen DNA Lite’s computer model, programmed with three-dimensional perspective, is of the simple ball-and-stick type, in which the balls represent molecules, and the sticks represent the chemical bonds between these constituent molecules. A guiding principle in development was to make the relative dimensions of the model agree with those of the actual DNA molecule to the degree that makes sense for a ball and stick model. This meant getting the ratio between helical radius and the distance along the helix required for the molecular chain to make a complete revolution right, as well as showing the proper offset between molecules paired oppositely with one another in the two DNA strands. The distance between molecules in a strand, and hence the number of molecules in a complete revolution of the helical strand also had to be right.

Another crucial structural detail of the virtual helices that needed to conform with that of natural DNA was the handedness. The concept of handedness, which refers to the sense in which each helical strand winds around its axis, is one that seems largely to have escaped notice by those who make artistic renditions of DNA. My observation is that roughly half (the fraction predicted by a random guess) of all depictions of DNA show left-handed DNA, when in fact natural DNA (or all but a tiny fraction of it) in living cells is right-handed. OnScreen DNA Lite makes it easy to see the difference between right and left handed DNA by allowing the user to switch back and forth between the two.

In addition to showing the relative positions of constituent molecules in the DNA strands, the OnScreen DNA model uses color coding to identify the various molecular parts and chemical bonds. This is meant to give visual reality to the idea that a molecule of one type (color) will make a cross-strand bond with only one other type (a different color). The molecules that form a connection between their respective strands are represented by one another’s complementary colors. The color also makes the visual point that the molecules (nucleotides) making up the DNA chains differ from one another only in the parts (nitrogenous bases) that make up the cross-strand pairs, while the connections that form the individual strands are between molecular components that are identical. This can all be said, of course, and should be said, but the colors in the model make the point in an immediately memorable way.

The molecules (sugar phosphates) that link together to form the chain of a strand do so in a particular way. Think of elephants forming a line by each elephant (except for the lead elephant) grasping with its trunk the tail of the one in front of it. The molecules have an asymmetry (think of trunk and tail) as well, and they form bonds between dissimilar parts (the “tail” being the part of the molecule where the phosphorus atom is). Thus we can think of a strand of DNA as “pointing” in a given direction just as the line of elephants heads in a certain direction. We say the DNA strand has a certain polarity (as a bar magnet has polarity: N at one end, S at the other). It turns out that in the real world, the two DNA strands in a double helix are aligned with opposite polarity. They point in opposite directions. The color coding of the OnScreen DNA model reflects this feature as well, visually indicating it in the colors of the relevant chemical bonds.

In order to perform its biological function in living cells, the DNA molecule must at times have portions of its two strands separate from each other. The separation and unwinding of the strands, and the nucleic acid chain constructions involved in these processes are orchestrated by complex proteins called enzymes that catalyze just the right reactions at the right time and place in the required sequence. In the full OnScreen DNA edition, animated simulations are used to show how this occurs. OnScreen DNA Lite does not include these biological processes, but it does show how the laboratory process called denaturation takes place. The temperature required to achieve this is too high for a living cell to survive, but in the lab, the jiggling of the the double helix at the high temperarture is strong enough to break the bonds holding the two strings together. OnScreen DNA Lite for iPad animates this process, finally arriving at the point where the two strands are completely separated from each other and no longer have any helical shape, just as happens to real DNA in the lab under heating. The reverse process, in which bonds reform between complementary pairs to recombine the two strands into a double helix can also occur, and OnScreen DNA simulates this phenomenon of renaturation also.

Even though the biological functioning of DNA is not demonstrated by OnScreen DNA Lite, its animations can serve to make the point that the hydrogen bonds connecting the two intertwined strands to each other are much weaker than the other chemical bonds of the DNA molecule, a fact that is crucial for the strand separation that has to take place in the biological processes. Furthermore, I believe that seeing the strands in the act of recombining makes the fact of their entwinement all the more memorable, which is important because it seems it can be lost to consciousness when only two-dimensional images or the typical ladder-like double strand renderings are seen.

The desktop version of OnScreen DNA allows the user, by means of the mouse, to rotate the model about its helical axis and about an axis perpendicular to that. Making these rotations serves to enhance comprehension of exactly how the double helix structure is put together and to fix its three-dimensional geometrical shape in the mind. Causing the on-screen rotation by dragging the mouse pointer across the screen is fun, but the pointer on the screen is at a distance from the hand directing it. I, along with almost all other developers of iPad apps, was without the benefit of an actual iPad on which to test the app I was making and thus had to use the iPad simulator that runs on the Macintosh to see what the app should look like on the real device. Thus I was deprived of the tactile part of the iPad experience, as mouse clicks and drags had to simulate their finger-on-screen counterparts. I did, however, have a chance to test on a real iPod Touch the prototype of OnScreen DNA Lite for iPhone, and I loved how I could make the double helix rotate by moving my finger on the screen. It was much closer to dealing directly with a physical object, and much more satisfying. I can’t wait to get my iPad and to start making further improvements to OnScreen DNA Lite for iPad.