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…

The Chemistry Map of Scotland was built for the Royal Society of Chemistry as part of their International Year of Chemistry celebration (2011). It was presented at the Science and the Parliament meeting in Edinburgh on Wednesday 9 November 2011 (our previous blog post).

The purpose of the site is to encourage school children to explore the chemistry by looking at how it impacts their local area. I had thought it would be mostly a historic project, but the children’s submissions show that it is anything but – they see chemistry as very much a part of a living and working landscape; the local galvanising works, offshore wind-farms and whiskey distilleries are at least as important as the work of Joseph Black (1728 – 1799)!

The site design is very simple, you won’t get lost anywhere here! We are particularly proud of the logo – even if it does conflate a couple of stereotypes – the thistle (for Scotland) and the benzene ring (for chemistry). The logo was designed to inject a bit of fun and movement into the site, along with the defiantly off-square page corners! In discussion with the client we selected the ‘Short Stack’ font by James Grieshaber, one of the free Google Web Fonts. The font is quirky, friendly without being MS Comic Sans, which has been rather over-exposed.

At the start of the project it was evident that Google were bringing in new charging policies for the use of mapping, so we chose to look at the Open Source alternative. The mapping program we used is OpenLayers, while the base mapping is provided by OpenStreetMap. OpenLayers can use any base mapping (for example Google, Bing or the Ordnance Survey) or satellite/aerial photography layers (Google and Bing are the most commonly seen examples on the web). This choice provides a great deal of flexibility to the project, as mapping sources can be changed as need or expediency dictate.

The public site provides an interactive map with clickable icons leading to students essays (stored in PDF format, to simplify administration). It also has a smart search facility, automatically checking date ranges for articles if a number is input (again my preconception that most of the content would be historic – but it is nice to see what chemistry was going on in Scotland in the year 1850). When search results are displayed they automatically update the thumbnail map, so it centres on the relevant place as your cursor hovers over each result.

We re-visit the Cookies debate with this site. Cookies enable us to create bookmarks to previously viewed pages for you, making it easy to jump between different essays on the same subject (or whatever you like!). Here we looked at an explicit permission system, as required by European Law – you have to click before we can create a cookie. This is the most satisfactory (and legally correct) way of dealing with this problem, which we have previously addressed. Mixed messages are coming from government though, so despite the fact that there is a lot of good in this law for the e-proles, it seems increasingly unlikely that the UK will ever enforce it.

Finally, the site is driven by a custom administration interface, permitting the RSC to add and edit points on the map. Hopefully this will ensure that the site can be kept going and expanding for a long time to come…

Visit the Chemistry Map of Scotland

It has been a busy week here, with a visit to the Royal Society of Chemistry’s (RSC) ‘Science and the Parliament’ meeting in Edinburgh. Here our latest project, the ‘Chemistry Map of Scotland‘ was launched by Prof. David Phillips (OBE), President of the Royal Society of Chemistry.

The project allows local schoolchildren to put chemistry on the map, and was created for the Scottish branch of the RSC as part of the celebration of the International Year of Chemistry (2011). The site is also, in part, a memorial to an old friend of mine, Dr Nigel Botting of St Andrews University.

The launch meeting itself, while sponsored by the RSC, is intended to raise the profile of science more generally in parliament, and there were a number of august speakers, including Scottish Parliamentarians at the event.

The short of the story from the meeting is that the Scottish higher education system performs very strongly in pure research metrics, but this does not benefit the economy – at least out-with the very important higher education sector! My feeling was that the meeting lacked the weight that a leading industrialist or entrepreneur might have provided on the main panel, but was none-the-less quite thought provoking.

Above right: Photo taken at the Chemistry and the Parliament meeting immediately after the main panel discussion, with a screen-shot from the Chemistry Map of Scotland in the background.

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’ve just released the new Nanofolio feature on protein transduction (we spoke about some of the design issues in our last post). We developed four interactive Flash items for this feature. Two look at processes in the cell, and two follow development of the smart polymer agent that gets the protein based drug into the cell.
The interactive components of the Nanofolio features are highlighted by being inset in the screen – we are taking our audience behind the web page to view what is going on, at a microscopic, nanoscopic or molecular scale. In this instance we chose to go behind the web page through a view reminiscent of that through an optical microscope. This puts the action clearly in context.
To get the feel of an optical microscope we used some low contrast sketches of a cell and its internal structures, and overlaid these with a granular texture, created using Flash’s background tiling capabilities, to keep the file size small.
We retained the optical microscope view for following the activity of smart polymers, watching them change configuration with changing pH (clearly this is a conceit, but in context it is an effective means of visually indicating a degree of magnification). The chemical structure of the polymer, however, was a simple map, with appropriate portions lighting up when the visitor’s mouse tracks over them, along with the portion of the chemical name related to those portions.
There is a reduced scale image of the ‘cell under the microscope’ above right, along with the icon we developed for apoptin – the smart drug that is delivered by the smart polymer system.

Targeted drug release on the Nanofolio website

From our post on ‘Monopoles in magnetic ice‘ you might have worked out that we are currently developing research features for Nanofolio. The current project is targeted drug release, a technique which uses a smart polymer to unlock the cell’s endosomes, releasing a drug into the cytoplasm which would otherwise be destroyed by the cell’s defense mechanisms.

This is a development sketch from the last animation in the feature – it is the first design to be finalised, however, as we will need to re-use graphics from this animation earlier in the feature (which will probably have 3 animations in total, the others detailing how the endosome and the smart polymer work).

At the top we have a motif for the polymer – drug complex, this has to be recognisable at small scale, and we’re looking at a simple ‘dragon and ball’ sketch for this purpose. The ball in this is the drug – in this case Apoptin, and at large scale we need to make it clear that it is a functional moiety. We’ll do this with a manga-esque decal. We looked at two options – a skull and a daemon head. The skull is kind of appropriate, as Apoptin is a cell killer; but it is quite specific to tumour cells, so we though the simple death’s head didn’t really get over the fact that the drug itself is quite smart! So, we’re looking at a daemon’s head for the final production – this is a Classical Greek helmet affair – and we’ll probably go with electric blue clouration, to emphasise that it is (potentially) ‘one of the good guys’.

The drug-polymer complex is taken into the cell in an endosome, and it is pH changes in this that trigger the smart polymer to shatter the endosome membrane. As pH is not visible, we need to represent this easily to visitors. One option is ‘Universal Indicator Paper’ style colour change, but this might not mean much to a lot of people, as well as being rather too crude – the smart polymer switches on at only just below serum pH levels. To get round this we’re going to display the pH on a little meter attached to the endosome. The meter is likely to get in the way of the apoptin release when that occurs, so we’ve also got a little transition, switching sides for the meter if necessary, so the action is clear…

Now all we have to do is make it all work!

You can see other (completed) research features in nanotechnology on the Nanofolio website:

Nanotechnology research features on Nanofolio

We have a pretty solid scientific background, and for most of it magnetic monopoles have been on the edges of our understanding of scientific reality. Our physicist friends told us that there was no reason why the should not exist, but all of methods we understood for creating a magnetic field involved spinning a charge, and that entailed making both a North and South pole together. Well, I don’t mind being wrong, and the elegant way in which monopoles are created by scientists at Nanofolio is really quite fun, and very easily understood…

So, it was a great pleasure to be asked to develop an interactive feature on this work for them. To do this we’ve really just taken their Nature Physics paper, and illustrated some of the main points. The authors were, I think, more excited about the elementary excitations they were seeing than the magnetic monopoles, which are a bit old hat to the modern physicist, so we looked at those as well. But, magnetic monopoles, just how cool is that!*

You can view the interactive features on the Nanofolio website at: “Monopoles in magnetic ice” – this page has ongoing links to the original publication and review in Nature Physics.

*They are in a magnetic ice after all – but you’ll have to look at the feature to find out more about that!