Amgueddfa Cymru — National Museum Wales


To celebrate Pride Cymru coming to Cardiff this weekend, our homepage has had a little touch of colour applied to it. If you use Safari on the Mac, you may notice another special feature - your browser's toolbar itself is emblazoned with rainbow colours.

Museum Homepage

If you use Safari regularly, you'll be familiar with the visual effect that sees page colours slip behind the browser toolbar as you scroll. It's a neat effect but I hadn't heard of a site actively utilising it before and I wondered if, with a bit of HTML, CSS & JavaScript, we could fix a set of colours there. The vibrant rainbow colours of Pride seemed like the perfect fit. In this blog entry, I'll describe in tedious/fascinating* (*delete as appropriate) technical detail how we achieved it.

The Technique

At first I tried setting the margin of my element to a negative value to push it into the toolbar area. Unsurprisingly, this doesn't work - it's simply not displayed. The actual solution was almost as simple itself and we were pretty pleased with the result.

To start off, all we need are two divs.

    <div id="toolbar-colours">…</div>
    <div id="content-frame">…</div>

The first div will contain the colours we want to show in our toolbar. We give this a fixed height, 150px in this example.

The second div will contain our content. We give this a fixed width and height of 100vw and 100vh. This means it will neatly and seamless fill the browser viewport area.

	background-color: #b20034;
	height: 2px;
	display: flex; /* We actually use Sass includes for cross-browser flex-box support */
	width: 100%;
	padding: 0;
	margin: 0;

	height: 150px;

#rainbow_toolbar .colour_block
	flex: 1;
	height: 4px;
	padding: 0;
	margin: 0;

#rainbow_toolbar.safari_trick .colour_block
	height: 130px;

#rainbow_toolbar .colour_block.violet { background-color: #9400d3; }
#rainbow_toolbar .colour_block.indigo { background-color: #4b0082; }
#rainbow_toolbar { background-color: #0000ff; }
#rainbow_toolbar { background-color: #00ff00; }
#rainbow_toolbar .colour_block.yellow { background-color: #ffff00; }
#rainbow_toolbar { background-color: #ff7f00; }
#rainbow_toolbar { background-color: #ff0000; }

Using a little JavaScript, we can make sure that we're always scrolled past the first div, making it colour the browser toolbar.

$(window).scroll(function() {

    if ($(window).scrollTop() < 150) {

The only thing remaining is to sort out our scrollbars which are giving the game away. We hide the main browser scrollbar and give our content-frame a standard-looking scrollbar instead.

    visibility: hidden; 
    display: none;
	background-color: #e4e4e4;
	height: 100vh;
	width: 100vw;
	padding: 0;
	border: 0;
	overflow-y: scroll;
	display: initial;
	visibility: visible;
	background: #f4f4f4;
	color: #ffffff;
	background-color: #f4f4f4;
	border-radius: 8px;
	width: 4px;
	border-radius: 8px;
	background-color: #b4b4b4;
	border: 3px #f4f4f4 solid;

There are few more JavaScript tricks we can use to tidy up our implementation. This includes managing the up arrow and page-up keys which create a visual glitch:

// disable page up and arrow up when at top of content
window.addEventListener('keydown', function(e) {
	if( $('#content-frame').scrollTop() <= 0 && [33, 38].indexOf(e.keyCode) > -1 ) {
}, false);

The Caveats

It's a neat little trick but also somewhat of a hack. Putting your content in a scrolling div carries a small but noticeable performance penalty when scrolling and when using a touchpad to scroll you may get an occasional visual glitch. Finally, it is only available to Mac-based Safari users. No other combination of OS and browser has the translucent toolbar effect for us to take advantage of. For this reason, it's not something I'd want to use for a lengthy period of time. But for one weekend only, here it is.

Visual Audio Display Units (VADUs) still exist in the National Museum Cardiff galleries. We know, because with almost every finger touch on the touchscreen, it sends a little signal to the web server that includes a piece of information describing the last interaction (i.e. ‘please play the video’, ‘please display the menu list’). We record all those messages, firstly to make sure the kiosk is actually working day-to-day and secondly to find out which aspects are popular or not popular, knowledge that is useful to guide future kiosk development. 

Gallery Statistics (diagram)
Figure 1, a cartoon of kiosk development process - an attempt to show the separation from the web server, while maintaining rudimental communication from the gallery space (satellite to mothership).

Each message is sent as an AJAX call (asynchronous JavaScript and XML) from the kiosk, which is usually a standalone bundle of files running through a web browser (HTML, CSS & Javascript files). The main bulk of the kiosk development is carried out through our in-house web CMS (called Amgueddfa CMS) on a computer that mirrors the public web server, it’s only before the launch that all the necessary files are copied over to the computer in the exhibition space (wrapped up as an ‘App’), where it remains like a satellite away from its mothership (the web server). Beep beep, beep beep.

Patterns of Frequency

A single recorded kiosk command is not particularly exciting by itself but when there are greater numbers, patterns emerge. For instance, if we record each time a video is started on the kiosk we get a round number to how many people were interested in the subject matter of the video (information gathered before they had seen the video). If we also record when people stop playing the video we can start to distinguish patterns in their viewing behaviour. Judging by the average video length played the majority of the visitors saw less than 39% of the total video length, with the longest average being three minutes 17 seconds. Of course, there were also lots of visitors who watch the videos until the end; as you can tell by the 'happy-tail' patterns formed by visitors reaching the film credits at the end of the film (figure 2).  

Figure 3 shows all video stop points for five videos presented as scatter plots against the video length in minutes.
Figure 2 shows all video stop points for five videos presented as scatter plots against the video length in minutes. Judging by the average video length played, which is shown in green - the majority of the visitors saw less than 39% of the total video length, with the longest average being three minutes 17 seconds. Of course, the there were also lots of visitors who watch the videos until the end (as you can see by the 'happy-tail' patterns formed as they reach the film credits at the end of the video), but on the whole I wouldn't recommending placing feature length films on kiosks.

Figure 3 shows the raw data stored on a database table on the web server.
Figure 2 shows the raw data stored within a database table on the web server.

Overview of the Numbers

I signed-off my last blog with a promise of data relating to the Wi-Fi audio tour during the Chalkie Davies exhibition last year, which I’m including below. To placing the Wi-Fi statistics within the gallery space, I’ve also gathered data from the four large screen kiosks in the exhibition against the monthly visitor figures.

It is immediately clear that the four large kiosks were very popular - they contained a great deal of curated content which included a composite NME magazine, Chalkie Davies film, Youth Forum audio interviews, a comments section and What’s On calendar. I can imagine the relative attraction and easy access of the kiosks goes a long way to explain the comparatively lower figures of the Wi-Fi audio tour, but let us not be downbeat - the feedback received from the visitor survey about the Wi-Fi was positive. 

  • 93% of survey monkey results either felt they ‘learnt a lot about the exhibition’ or ‘it improved their experience as a visitor’ - it must be noted that the number of people who filled in the survey and used the Wi-Fi audio tour was extremely low compared to the overall gallery visitor figures (12 / 42,000), but the survey morsel is still very positive.    

However, I would be cautious in suggesting an Wi-Fi audio tour for short-run exhibitions, mainly due to the diminished numbers compared to the insitu kiosks - the Wi-Fi audio tour could gain popularity following a less exhibition-specific avenue (e.g. providing audio descriptions for the top ten popular objects), which would allow the audio catalog to be built gradually and remain available all year around throughout the museum.

Future Beeps

To conclude, we have been collecting kiosk statistics since 2011. The storage method may change, we could additionally store the data on Google servers via Google Analytics, but however the beeps are stored the way visitor interact with museum kiosks will continue to guide the future kiosk development. 


Table showing all the touchscreen events for the Chalkie Davies exhibition with visitor figures for the gallery:

Large touch screen x 4



7 May


June 2015

July 2015

Aug 2015

7 Sept


Video (film plays)








Chalkie Interview








Chalkie Interview








NME magazine








NME magazine








NME Next Page








NME Previous Page








NME Zoom Photograph








Music Memories








Music Memories








Music Audio (track plays)
























Comments submitted








What's On








What's On

















Wi-Fi Audio Tour

Using their own mobile devices



7 May


June 2015

July 2015

Aug 2015

7 Sept


Audio (plays)








Audio (plays)

















Number Gallery Visitors


7 May


June 2015

July 2015

Aug 2015

7 Sept












This is a void appreciation post.

It's not often that we have a lot of time to reflect on what we do, because there's always so much to do. So, before I jump into venue hire revamps; finishing off a piece of prep for this Women's Archive Wales conference and helping with new 'suggest an event' pages, let's look into the murky abyss and just take a minute to breathe.

The Sea's Edge

Nice, no? [The Sea's Edge, Arthur Giardelli]

Since 'keeping busy' is the other Welsh national sport, it's not for everyone - but I'm a firm believer in taking stock, staying still for a minute, and listening. There'll always be a call: an email that's fallen down the back of the sofa, a book you've been meaning to pick up, or a colleague you'd like to make more time for will pop upstairs and say hi.

Evaluation and Taking Stock

We're in transition as a department - welcoming two new team members this week - and have been working, quite separately and like the clappers recently, on various projects, on web, galleries, social, governance, research and planning.

Graham, who heads the Content Team (and who I will now be calling Captain Content if he lets me), has been taking part in a cross-sector project looking at evaluation and taking stock, called Let's Get Real. Last week, he braved their Crit Room in Brighton, where he presented our work for open criticism and questioning. Curiously scary.

The results of the crit have been a real encouragement - I had been worrying about the size of our twitter network, since the time cost of keeping everyone trained up is ever growing for me. But, we were encouraged to see it as a sign that we're a healthy, tweeting organisation.

I am really trying to believe them.

Feedback from the Crit Room

Self-deprecation aside, I'm quietly happy with how we're working as a network, and really chuffed to see people really run with the new skills they've acquired on social media. In fact, while totting up some numbers for an unrelated report last week I saw we'd passed a great milestone - as a network, we now have over 125,000 followers on twitter alone. I know it's not just a numbers game, but there's something reassuring about those great, neat, empty 000s in a row.

The Crit Room also had great words of encouragement for Chris, who's built all the foundation for the website redesign (and much more besides), and the rest of the team - namely that our digital offer was 'highly rewarding, rich and satisfying'. I can't stop thinking of coffee when I read those words. Speaking of which: time to stop blogging about stopping now, and start stopping for a cuppa.

A Radical Collection

I'm content when I'm rummaging through old records, photographs or documents. Gleaning through 'stuff' is an unusual pleasure now that I work in the Digital dept, my day-to-day work mostly bereft of bits of paper.

I love the feel of ruffling through collections; whether it's a pile of vinyl, a card catalogue, or a box of old letters and tickets from the last century (it's scary to say that: "I went to a Levellers gig in the last century".)

Nearest and dearest to me are the Screen and Sound Archive at the National Library (where my Father worked until his retirement), and the Archives at St Fagans National History Museum. At St Fagans, the history of those early, radical curators, the background noises they capture, the dialects and the voices have had me in awe for almost a decade now.

It's also a relatively egalitarian collection, that notes the value of women's histories and makes space for us to tell our stories in our own words, to share our songs, recipes, beliefs and superstitions. Paper history doesn't match up somehow, where our voices oftentimes get squished to the margins and footnotes. It must be said that it isn't a completely intersectional collection, though efforts have been made in recent years to address this, for example, in recording stories from LGBT people.

My Grandmother's Voice

I will never forget finding my Grandmother's voice in the archive. She died when I was very young and so I don't remember very much about her, apart from what I've picked up from photos and from her poetry.

Nancy Hughes Ffordd Deg Bach © R I Hughes
My Grandmother in 1926 © R I Hughes

She was an excellent storyteller, and it was a privilege to receive a CD of her telling a few tales. Her voice had been there, kept safe all along - and I was bowled over, not just by her turn of phrase and sense of humour, but by the noises my Grandfather was making in the background as he tinkered around. His voice was not as deep as the one I'd committed to memory, and unlocked a drawerfull of memories besides.

This encounter further convinced me that archives deserve to be recognised as inherently meaningful collections, to be treated not as a supporting cast, but as whole collections which deserve pride of place alongside archaeological objects and artwork in our museums.

The Archive Today

I've been working with the team for a while - Richard (@archifSFarchive) who is part of the @DyddiadurKate team, and now with Lowri and Meinwen, who look after the manuscripts and sound archive. I've been showing them how to use our blogging platform, so hopefully we'll see a bit more of the life of those collections online soon. 

Within the digital department, we're busy revamping our pages on Welsh traditions and folksongs. While that work is going on, I've been looking in more detail at how we could potentially reach a wider audience by sharing sound clips on social platforms.

Sharing Sound Socially

The platforms we currently run - twitter, facebook and tumblr - seemed too ephemeral somehow.

Tweets don't live long enough, especially since we have so many accounts running in St Fagans; and the data shows us that our facebook fans are more interested in our events programme than our collections. Something as focussed as oral history or folk music could easily get lost or miss its mark.

So, I asked Gareth and Rhodri about their experiences of sharing music on soundcloud, bandcamp etc. I decided to create a package our of existing digitised material using bandcamp, and to release them all in one go, father than drip-feed them on the blog or on twitter.

One of the lovely things about bandcamp is the ability to add more information, like sheet music, lyrics and the history of the recording, and that I'm able to package things in an 'album' style. I was also really keen to use the 'pay if you like' function to see if we could open up a small donations stream that could be evaluated in the future.

Download 'O'r Archif'

Here it is then, a selection of folk songs, recorded from 1960 onwards by our archive at St Fagans: O'r Archif: Caneuon Gwerin

Most of the recordings were made by Roy Saer. The sheet music and sound was arranged by Meinwen Ruddock-Jones in the archive, and additional research carried out by Emma Lile. The cover for the collection is held in our art department, and is attributed to the travelling artist W J Champan.

I used Canva to tie together the older scans of the sheet music, and to add a word or two about the archive's history. If there are any errors, therefore, they are mine! Enjoy, share, sing, donate and experiment - and if you have any feedback, please pop it in the comments!

Dwi'n edrych ymlaen at ein digwyddiad sgyrsiau fflach yfory - cyfle i staff o wahanol adrannau gyflwyo eu hymchwil mewn pum munud.

O ystyried amrywiaeth y disgyblaethau a'r arbenigedd sy'n bodoli 'ma (o ddaeareg gynnar i gelf modern, gofalu am esgyrn i dynnu llo...), dwi'n disgwyl dysgu rhywbeth, a'n gobeithio rhannu arfer da.

Pum Munud i Drafod Dyddiadur

Fe fydda i'n cyflwyno pum munud am @DyddiadurKate - er fod calon ymchwilydd gen i, y tîm yn Sain Ffagan sydd wedi bod yn dod â hanes Kate a'i chynefin at gynulleidfa newydd. Yn aml fe fydda i'n ymladd fy ngreddf i ymgolli mewn casgliadau a'n atgoffa fy hun mai pen hwylusydd sydd gen i - a mai fy rôl innau yw i greu gofod ar gyfer y tîm, eu hannog, a rhannu eu gwaith da ymhellach. 

Model Rhannu Casgliadau

Dwi wedi fy argyhoeddi fod model @DyddiadurKate yn un y gellir ei ddyblygu i rannu casgliadau eraill - yn enwedig y gwrthrychau cynnil hynny na fydd byth yn ennill teitl fel 'trysor' neu 'eicon'. Ond ofer fyddai mentro'r un peth eto heb ymroddiad tîm, a'r holl gynnwys cefnogol sydd gennym ar flaenau'n bysedd. 

O gronfa ddata casgliadau'r Rhyfel Mawr, i adnoddau allanol fel Papurau Newydd Cymru - a mewnbwn ein cynulleidfa - mae'r dyddiadur wedi bod yn sbringfwrdd i straeon amrywiol iawn am Gymru, a thu hwnt, gan mlynedd yn ôl.

Technoleg Gefnogol

O ran stwff nyrdlyd, technolegol, mae arferion rhannu asedau da wedi helpu, yn ogystal â phlatfform rhag-bostio, er mwyn rhyddhau'r curaduron o'r dasg ddyddiol o bostio, i greu amser iddyn nhw afael mewn pynciau perthnasol a'u hymchwilio ar gyfer y blog, neu greu cysylltiadau efo casgliadau eraill.

Y Rhife

Hyd yn hyn, mae dros 207,000 o argraffiadau wedi'u cofnodi ar y cyfri - llawer iawn mwy nag y gallen ni ei hwyluso yn gofforol, a mwy nag y gallai'r ddogfen ei ddioddef, yn gorffol, hefyd. Mae'r prosiect wedi codi traffig i flog Cymraeg yr Amgueddfa dros 800% o'i gymharu â llynedd - sy'n fy argyhoeddi mhellach o bwysigrwydd creu cynnwys gwreiddiol ar gyfer siaradwyr Cymraeg y we, i ateb galw go iawn, ac i greu cysylltiadau rhithiol ar hyd a lled y wlad, o'n swyddfa fach y tu ôl' i'r orielau celf.