Amgueddfa Cymru

Hafan

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.

Hafan yr Amgueddfa

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.

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

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.

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

#rainbow_toolbar.safari_trick
{
	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 .colour_block.blue { background-color: #0000ff; }
#rainbow_toolbar .colour_block.green { background-color: #00ff00; }
#rainbow_toolbar .colour_block.yellow { background-color: #ffff00; }
#rainbow_toolbar .colour_block.orange { background-color: #ff7f00; }
#rainbow_toolbar .colour_block.red { 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) {
        $(window).scrollTop(150);
    }
});
$(window).scrollTop(50);

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.

::-webkit-scrollbar
{ 
    visibility: hidden; 
    display: none;
}
				
#content-frame
{
	background-color: #e4e4e4;
	height: 100vh;
	width: 100vw;
	padding: 0;
	border: 0;
	overflow-y: scroll;
}
					
#content-frame::-webkit-scrollbar
{ 
	display: initial;
	visibility: visible;
	background: #f4f4f4;
	color: #ffffff;
}
		
#content-frame::-webkit-scrollbar-track
{
	background-color: #f4f4f4;
	border-radius: 8px;
}
		
#content-frame::-webkit-scrollbar-thumb
{
	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 ) {
		e.preventDefault();
	}
}, 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. 

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).  

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

 
 

Language

7 May

2015

June 2015

July 2015

Aug 2015

7 Sept

2015

Video (film plays)

 

1717

1085

1735

2833

352

7722

Chalkie Interview

EN

1280

1044

1362

1953

338

5977

Chalkie Interview

CY

124

123

164

237

38

686

NME magazine

EN

1209

961

1205

1841

355

5571

NME magazine

CY

60

56

72

148

17

353

NME Next Page

 

1974

2119

2099

2324

530

9046

NME Previous Page

 

1303

1025

1098

1666

463

5555

NME Zoom Photograph

 

985

681

909

1317

430

4322

Music Memories

EN

1409

1076

1464

2311

378

6638

Music Memories

CY

71

60

95

138

17

381

Music Audio (track plays)

 

1766

1583

1806

2410

486

8051

Comments

EN

881

702

840

1383

230

4036

Comments

CY

71

54

78

105

11

319

Comments submitted

 

124

131

168

260

30

713

What's On

EN

783

684

847

1335

241

3890

What's On

CY

55

50

63

126

12

306

Totals

 

12509

10409

12907

18721

3465

63,566

 

Wi-Fi Audio Tour

Using their own mobile devices

 
 

Language

7 May

2015

June 2015

July 2015

Aug 2015

7 Sept

2015

Audio (plays)

EN

316

212

262

394

124

1308

Audio (plays)

CY

10

3

4

4

1

22

Totals

 

326

215

266

398

125

1,330

 

Number Gallery Visitors

 

7 May

2015

June 2015

July 2015

Aug 2015

7 Sept

2015

 

Totals

 

9108

7107

10688

14130

1961

42,994

 

Dyma flog i werthfawrogi gwagle.

Dydyn ni ddim yn cael llawer o gyfle i fyfyrio am ein gwaith, achos ma' wastad mwy ohono i'w wneud. Felly, cyn i mi fynd i'r afael ag ail-wampio'n tudalennau llogi preifat; gorffen paratoi ar gyfer cynhadledd Archif Menywod Cymru a dechre helpu efo tudalennau 'cynnig syniad am ddigwyddiad', dewch i ni eistedd am eiliad a syllu 'mewn i'r gagendor mawr tawel, ac anadlu.

Min y Môr

Neis, ond'yw e? [The Sea's Edge, Arthur Giardelli]

Gan fod 'cadw'n brysur' yn un o'n chwaraeon cenedlaethol, dyw hyn ddim at ddant pawb - ond dwi'n licio'r syniad o bwyso a mesur, aros yn llonydd am ennyd, a gwrando. Mi ddoiff na alwad bob tro: ebost sydd di syrthio lawr cefn y mewnflwch; llyfr 'dych chi wedi bod yn meddwl ei ddarllen ers sbel; neu bydd cyd-weithiwr liciech chi dreulio mwy o amser yn dysgu ganddynt yn taro'u pen trwy'r drws i weld a ydych chi ffansi paned.

Gwerthuso ac Archwilio

Rydym ni'n newid fel adran ar hyn o bryd - bydd dau aelod newydd yn ymuno â'r tîm yr wythnos hon - a rydym ni i gyd wedi bod yn gweithio ffwl-sbîd, os braidd ar wahan, ar brosiectau gwahanol ar y we, mewn orielau, y cyfryngau cymeithasol, rheolaethol, ymchwil a chynllunio.

Mae Graham, sy'n arwain y tîm cynnwys, wedi bod yn cymryd rhan mewn prosiect sector-gyfan sy'n edrych ar fodelau gwerthuso, pwyso a mesur, o'r enw Let's Get Real. Yr wythnos ddiwetha, mi fuodd gerbron y 'Crit Room' ym Mrighton, yn cyflwyno'n gwaith ar gyfer ei archwilio a'i feirniadu. Diddorol a brawychus.

Mae canlyniad y 'crit' wedi bod yn galonogol iawn - roeddwn i wedi bod yn poeni braidd am faint ein rhwydwaith twitter, am fod cost amser hyfforddi pawb yn tyfu drwy'r amser i fi. Ond, cawsom adborth fod hyn yn arwydd da ein bod yn ffynnu ar-lein, ac i boeni llai amdano.

Dwi'n ceisio dilyn eu cyngor nhw, go iawn.

Adborth y Stafell Feirniadu

Tafod allan-o'm-boch, dwi'n hapus efo sut 'dyn ni'n gweithio fel rhwydwaith dyddie 'ma, ac yn falch iawn pan dwi'n gweld pobl yn llamu 'mlaen yn defnyddio'u sgiliau newydd ar y cyfryngau cymdeithasol. Wrth dynnu rhifau at ei gilydd ar gyfer adroddiad arall, fe sylwais ein bod wedi cyrraedd carreg filltir bwysig iawn yn y misoedd diwetha: dros y rhwydwaith, mae gennym dros 125,000 o ddilynwyr. Dwi'n gwbod mai nid o rifau'n unig yr adeiladir llwyddiant ar-lein, ond, dwnim, mae 'na rywbeth tawel, boddhaol am weld rhes o '000'au gwag, cegagored.

Mi gafodd Chris, sy'n gyfrifol am adeiladu seiliau ail-ddatblygiad y wefan (a llawer mwy), a gweddill y tîm, hwb gan y Stafell Feirniadu, hefyd - yn benodol, fod ein harlwy ar-lein yn 'werthfawr iawn, yn gyfoethog ac yn foddhaol'. Alla i ddim peidio â meddwl am goffi pan dwi'n darllen y geiriau yna. Amser i stopio blogio am stopio a dechre stopio am baned.

Casgliad Radical

Creadur archifol ydw i wrth reddf - dwi'n hapus iawn fy myd yn pori trwy hen recordiau, lluniau neu ddogfennau. Mae lloffa trwy 'stwff' yn bleser anghyffredin 'nawr 'mod i'n gweithio yn yr adran ddigidol - yn ddibapur, bron.

Dwi wrth fy modd; boed yn gasgliad feinyl, yn gatalog gerdiau, neu'n bentwr o hen lythyrau a thocynnau o'r ganrif ddiwetha (mae'n scary gallu gweud hynna: "fues i i gig Levellers yn y ganrif diwetha". Ych.).

Anwylaf ymysg yr archifau ma Archif Sgrîn a Sain y Llyfrgell Genedlaethol (sef ble bu Dad yn gweithio tan ei ymddeoliad) ac Archif Sain Ffagan. Yn Sain Ffagan, mae hanes y casglu radical, y synau cefndir, y tafodiaethau a'r lleisiau wedi fy hudo ers bron i ddegawd.

Mae'n gasgliad cytbwys iawn hefyd, sy'n nodi gwerth hanes menywod ac yn rhoi lle i ni ddweud ein hanes yn eu geiriau ein hunain, i rannu'n caneuon a'u coelion. Dyw hanes-ar-bapur ddim yn gyfystyr rywsut, ein gwasgu i'r marjin neu'r troed-nodyn caiff ein lleisiau yn aml iawn. Rhaid nodi nad yw'n gasgliad hollol gynrychioladol, ond mae'r tîm wedi ymdrechu'n ddiweddar i wirio hyn, trwy gasglu hanesion llafar pobl LGBT, er enghraifft.

Darganfod Llais fy Nain

Wnai fyth anghofio dod o hyd i llais fy Nain yn eu plith. Bu Nain farw pan oeddwn i'n ifanc iawn, felly does dim cof gen i ohoni tu hwnt i luniau ohoni a'i barddoniaeth.

Nancy Hughes Ffordd Deg Bach © R I Hughes
Fy Nain ym 1926 © R I Hughes

Roedd yn storïwraig o fri, a braint oedd cael copi ar CD ohoni yn adrodd rhai ohonyn nhw - a chlywed ei llais am y tro cynta fel oedolyn - nid yn unig am fod dawn dweud mor dda ganddi, ond am fod swn Taid i'w glywed yn y cefndir hefyd. Roedd ei lais llawer yn llai bas nag oeddwn i'n ei gofio o 'mhlentyndod, yn datgloi llond drôr o atgofion. 

Mi berswadiodd yr achlysur yma fi 'mhellach bod archifau yn llawn haeddu statws fel casgliadau ystyrlawn, a'u trin nid fel adnoddau cefnogol, ond fel casgliadau cyflawn sy'n haeddu cymaint o sylw mewn amgueddfa â gwrthrychau archaeolegol neu weithiau celf.

Yr Archif Heddiw

Dw i wedi bod yn gweithio efo'r tîm ers sbel - Richard (@archifSFarchive) sy'n rhan o dîm @DyddiadurKate, a 'nawr efo Lowri a Meinwen, sy'n gofalu am y llawysgrifau a'r archif sain. Mae'n nhw ar ben ffordd efo'r blogio, felly gobeithio y gwelwn ni fwy ar ochr honno'r casgliadau ar-lein yn fuan. 

O fewn yr adran ddigidol, rydym ni'n brysur yn gweithio ar ail-wampio ein tudalennau am draddodiadau Cymreig, a deunydd archif. Tra bod y gwaith hwnnw'n mynd rhagddo, dwi wedi bod yn edrych yn fanylach at botensial y cyfryngau cymdeithasol i rannu clipiau sain gyda chynulleidfa ehangach.

Rhannu Sain ar y Cyfryngau Cymdeithasol

Roedd y platfformau cymdeithasol sy'n rhedeg 'da ni - twitter, facebook a tumblr, yn rhy effemeral rywsut.

Mae trydar yn rhy fyr-eu-hoedl, yn enwedig gan fod cymaint o gyfrifon cyfochrog yn rhedeg yn Sain Ffagan; a dengys ein data bod ein ffans ar facebook yn ymddiddori mwy yn ein rhaglen weithgareddau na'n casgliadau. Gallai rhywbeth â ffocws fwy penodol, fel hanes llafar neu ganu gwerin, fynd ar goll yn hawdd neu fethu ei darged.

Felly, dyma ofyn i Gareth a Rhodri am eu profiad o rannu cerddoriaeth efo soundcloud, bandcamp ac ati. Penderfynais greu pecyn o recordiadau archifol oedd wedi'u paratoi'n barod yn defnyddio bandcamp, a rhyddhau y clipiau i gyd fel un grwp, yn hytrach na'u dosrannu fesul un ar y blog neu ar twitter. 

Rhinwedd bandcamp yw bod modd atodi mwy o wybodaeth, fel nodiant, geiriau a hanes y recordiad; a bod modd creu ffurff 'albwm'. Ro'n i hefyd yn awyddus i ddefnyddio'r ffwythiant 'tala os ti moyn' i weld a fyddai honno yn ffrwd roddion fechan y gallwn ni ei gwerthuso yn y dyfodol.

Lawrlwytho Albwm Arbrofol

Dyma hi te: O'r Archif: Caneuon Gwerin

Casglwyd y recordiadau yn bennaf gan Roy Saer, a threfnwyd y sain a'r nodiant gan Meinwen Ruddock-Jones yn yr archif. Ymchwilwyd y caneuon ymhellach gan Emma Lile. Mae'r clawr yn eiddo i'n casgliad celf, gwaith a briodolwyd i'r peintiwr teithiol W J Champan.

Mi ddefnyddiais Canva i gaboli'r hen sgans o nodiant, ac i ychwanegu rhyw damaid am hanes yr archif. Os oes camgymeriad yn y llyfryn, felly, arna i mai'r bai am hynny! Mwynhewch, rhannwch, canwch, rhowch ac arbrofwch - ac os oes adborth neu gwestiwn 'da chi, dodwch nhw yn y sylwadau! 

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.