We’re in the process of updating the content on the Nanofolio micro-site: What is nanotechnology?, and as a first stage we’ve upgraded the existing templates to HTML5, and added an element of responsive design.

The old site had a ‘flexible design’, so the page could be as wide as the monitor allowed. When it was first built the lack of an upper limit on width was not an issue, as monitors were only just beginning to break the old vacuum tube influenced 800x600px barrier…

Our new styling limits the maximum page width to 1000px, this is the largest readable width for the site, beyond this and lines of text are really hard to read.

Additionally, the old site did not display well on very narrow displays, as fixed width elements, like images, broke the layout

The new design re-scales images and objects as the page is made narrower, so it does not break, right down to its new minimum width of 300px. Below 600px in width the display switches to display the menu at the top of the page, below the banner, and both the menu and the content below it fill the entire width of the screen, to make the text easy to read and ensure that images are large enough to be seen on a smart phone.

As yet we have not added much in the way of new content (at least visibly – the meta content has been updated to improve Search Engine performance, and broken links have been removed!). One element we have added, however, is a 3D interactive C60 (buckminsterfullerene) model into the references section. This is reproduced above.

If you are interested in nanotechnology, there are a lot of resources available, including images and research features, on the Nanofolio website:

Nanofolio – MSc degrees in nanotechnology.

The interactive animation to the right depicts the structure of diamond.

Diamond adopts a cubic lattice, but if you rotate the structure (run your mouse over it) so that one of the corners of the cube points upward, you should be able to see the tetrahedral relationship between closest neighbour carbon atoms quite clearly (I’ve re-drawn this below the animation so you know what to look for).

The semiconductors silicon and germanium adopt the same structure – but we are used to thinking of these as solid state structures rather than an over-bonded organic molecule, so the model is less of a surprise.

The side of the cube above is approximately 0.357nm and the space group is Fd3m(O_h⁷) (Space Groups for Solid State Scientists 2nd Edition, Burns and Glazer, Academic Press 1990, p152-4)

The structure is built in Flash using our molecular modeller (previous post); it was derived from a larger 3D diamond structure built for an update to What is Nanotechnology? for the Nanofolio MSc courses.

The new project calls for dynamic atoms within the structure, which we will use to explore the differences between matter in bulk (diamond) and ‘soft matter’, that is the basis of most molecular nanotechnology.

As a first stage towards this you might have noticed here that the atoms gently fade in when the structure first loads – the final animation has atoms appearing, disappearing and changing their nature on command – but more about that in a future post…

A number of years ago we created a simple website for the Polymers and Biomaterials Chemistry Laboratories research group, and as part of this we used Flash to show a chain of atoms that could be viewed from a restricted range of angles using our ‘pop-up’ 3D effect – much like the bathymetry of the Stirling Castle. As part of our recent update of this site we thought we’d go one better, and create a full 3D molecule of a real polymer chain…

Above: ‘Frogspawn’ or electron cloud molecular model, an early version of the 3D molecule we built for PBCL. Elements are not distinguished in this model (C, N and O are all represented by the same grey blob), and hydrogens have not been included, making the model rather smaller and easier to manipulate (see link at the foot of this story for the final version).

The modelling is done entirely in Flash, so unlike the existing Java-based molecular viewers such as Jmol and RasMol, there is no need to download an application before the molecule appears! For the site we used a molecule consisting of over 300 atoms, which seems to be a sensible upper limit, as older machines are beginning to gasp a bit at rotating the thing in real time! Clearly in creating this we’re using smoke-and-mirrors to keep the project manageable within the confines of the Flash environment. So, while the positions of the atoms are mapped in 3D, they are represented by 2D graphics. This results in a small amount of flicker as the molecule rotates, and atoms jump in front of each other along the z (out of plane) axis (the frogspawn model above was an early attempt we made to escape this effect, unfortunately plotting semi-transparent atoms takes more processing power, so we hit the molecular size limit sooner with this approach). In creating this molecular viewer as a one-off, we have unashamedly used artistic license to foreshorten the image to give it a more dramatic depth of field.

In the final version the XYZ information for the molecule is imported into Flash in a simple XML file, so whist the process is still restricted to molecules of small to medium size, we look forward to taking it further and seeing how well it can model a wider range of structures…

The final 3D structure can be found on the home page of the Polymer and Biomaterials Chemistry Laboratories website:

Polymer and Biomaterials Chemistry Laboratories

Is it a world first? – No, unfortunately not, see 3D crystal viewer !

This research feature had rather a troubled gestation period. We started by preparing 3D models of the polyelectrolyte chains – shown right. These were animated to bring them together so that we could show salt formation between the poly(amine) and the poly(acid) at the interface. Unfortunately it was not at all clear what was going on, so we went back to the drawing board…

The final feature uses a single still graphic to show how the different polymers can attract each other at neutral pH, whilst having no affinity in either acid or base. We then illustrated this by re-producing one of the experiments described in the paper – which results in the two surfaces popping apart when they are immersed in acid.

Switchable adhesion is potentially very useful. Most things are made out of more than one material, and this makes recycling very difficult. Traditional glues are OK, but they usually require heat or organic solvents to break them up. This simple demonstration of a glue that stops being sticky in acidified water shows that this can be done easily, and in an environmentally friendly manner.

For the complete story see: Nanofolio research – switchable adhesion.

Carbon nanotubes (‘bucky tubes’ or nanofibres) are scarcely out of the scientific news these days, with claims of applications as diverse as plastic computers and indium-free touch screens for your iPhone (other touch screen devices are available!). While they have great potential, this can only be realised if they can be prepared reliably and in quantity. Unfortunately, most techniques yield carbon nano-tubes in miserably low yields. One of the high yield techniques, uses Catalytic Chemical Vapour Deposition (CCVD). In this, tiny molten drops of nickel serve as condensation nuclei for the carbon nanotube. While efficient, the product is contaminated with nickel, which is included within the carbon tubes, and extremely difficult to remove.

So, lots of carbon fibres, but of poor quality…

So what researchers at Nanofolio have done is work out a technique for cleaning up the tubes we can make. The technique is called salt melt processing, and involves soaking the carbon nano-tubes in a bath of molten salt – in an argon atmosphere to stop them catching fire! At 950DEG C, the molten salt breaks pen the ends of the nanotubes, liberating the nickel, which (after cooling) can be dissolved with dilute mineral acid and re-cycled.

This work is of critical importance to a wide range of nanotechnology applications, but it doesn’t lend itself easily to developing a feature, as we have done with earlier Nanofolio research (see all of our nanotechnology research features for Nanofolio). Here we simply don’t have a mechanism we can elucidate with moving interactive models. The work still deserves to stand out, however…

Initially we thought we’d have to prepare general art-work based on idealised carbon nano-tubes of the sort that usually illustrate work in this area (see, for example Wikipedia). These things are ubiquitous, however, and don’t address our story. When we reviewed the publications on the topic, however, we realised that we had some good scanning electron micrographs (SEM’s) following the processing history.

SEM’s are beautiful, but very common in the scientific literature, so we wanted to do something to make them stand out a bit. Fortunately, the final processed product has a uniform electrical conductivity, and this means that it has a nice even illumination under the electron gun – the tube appears at a uniform brightness, dependent only upon the distance from the electron gun in the microscope.

In short, we could extract depth information from the SEM using a standard graphics package. This allowed us to prepare contoured images, and using the simple ‘pop-up 3D’ technique we’ve reported previously we could get workable 3D images. Given that we could extract depth information automatically, we were able to illustrate this feature with three 3D images – a bit of a first (you’ll se very few sites sporting more than one 3D image – and that usually on the home page for impact!)

Processing carbon nanofibres on the Nanofolio website

We’re currently working on a new website for ScapaMAP, documenting the remaining wrecks of the German High Seas Fleet scuttled at Scapa Flow at the end of the First World War. The latest additions to the site are 3D files for each of the warships still in the Flow. These are based on the acoustic surveys carried out by the ScapaMAP project.

The 3D models were created in Fledermaus by the project team. This format does not run as a browser plugin, so we can only offer them as downloads, though there is a free player. In an effort to make the survey work more approachable to all visitors, we’ve been looking at creating some simple 3D environments in Flash to compliment these.

One of these is the 3D image of the light cruiser SMS Köln, shown above. This is based on the contour data from the multibeam survey, which is sliced into a series of layers depending upon their relative depths. Each layer moves independently, controlled by your mouse position over the model. Your mouse position acts as a viewpoint for this simple model, which still shows clearly how the hull encloses a mass of salvage debris, where salvors have broken into the engine room, to remove the condensers and other fittings that were made out of copper alloys.

With only a limited range of viewing angles, the model of the Köln, (above) is not nearly as impressive as the Fledermaus 3D model, but at the same time it will run on most people’s browsers without problem…

Visit the ScapaMAP website for more information:

ScapaMAP – archaeology of the WW1 German High Seas Fleet

One of the simplest 3D modelling techniques that can be used with the Flash is something I call ‘Pop-up 3D’ – as it works in a very similar way to old children’s pop-up story books. The structure that you want to give a 3D appearance to is distributed across a number of layers – with the top layers having the parts of the structure that would be closest to the viewer.

In the final movie the layers are moved according to your mouse position, with the top layers moving with the mouse, and the bottom layers moving away. If you place your mouse cursor to the top right of the movie, therefore, the top layer will be displaced to the maximum extent in this direction, while the bottom layer is displaced to the maximum extent towards the bottom left corner of the movie frame. Intermediate layers move proportionately smaller distances in the appropriate direction – it is quite a lot of fun setting the scaling of the movement to give a believable 3D effect.

This technique gives allows a model to be viewed from a limited range of viewing angles, and works best where this would be a ‘natural’ situation. One example is for maps – and the model displayed here is an early draft of a contour map showing sediment errosion from around the Stirling Castle, a shipwreck dating from 1703. Each contour height has been separated onto a new layer, clearly demonstrating the technique.

In the final version, which can be seen on the RASSE project website, the contour areas have been replaced with a multibeam image of the seabed, which gives the model a startlingly realistic 3D effect. In the final version I have also added data from all three survey years, showing how sediment is currently being deposited around the wreck site.

RASSE website, final 3D model

This is a short movie based on a 3D model of a protein fibril created for Nanofolio, if your browser supports flash, move your mouse over the image to rotate the model.

The fibril is composed of four ribbons, each of which is in turn composed of two tapes joined back to back. The tapes are composed of peptide molecules sitting side by side. Peptides are just visible in the model as rectangular blocks or steps in each of the four ribbons.