Code Archives – Page 2 of 3 – Sinead O'Brien, eSTEAMed

Personalised Lego Character from Photo

This post looks at the ninth of the visualization types created for the MeSch museum post-visit visualization tool. Click here for overview. While investigating methods of creating personalised characters for online site users we explored the idea of using a photograph of a person to act as the basis for a Lego person.

Code Data Visualizations Research

Animal Path Visualisation

This post looks at the eighth of the visualization types created for the MeSch museum post-visit visualization tool. Click here for overview. This visualisation is loosely based around a French paper; Veron, E., Levasseur, M.: Ethnographie de l’exposition, Paris, Bibliothèque Publique d’Information, Centre Georges Pompidou. This Ethnographic study proposed that visitors movements in a museum could be compared to the behaviour of four "typical" animals. They used observational techniques to classify visitors as ANT, FISH, BUTTERFLY or GRASSHOPPER. For meSch we wanted to experiment with this idea and consider how such roles could be assigned to visitors using computational methods applied to the visitors log.

Map of Atlantic Wall Exhibition in The Hague with a visitors path superimposed

Code Data Visualizations Research

Map Visualisation

This post looks at the seventh of the visualisation types created for the meSch museum post-visit website: the Map Visualisation. Click here if you are looking for an overview of the meSch museum post-visit website. This map is a combination of static and dynamic content. The background layer is uploaded and configured by the curator. The curator must upload a background map image and drag the points of interest to the appropriate locations on the map. Once the curator is happy with their basic map they can flag the visualisation as "public".

Code Data Visualizations Research

Timeline Visualisation

This post looks at the fifth and sixth of the visualization types created for the MeSch museum post-visit visualization tool. Click here for overview. On the meSch platform there are two versions of timeline visualisation for the user to experience.

Code Data Visualizations Research

Grid Visualisation

This is the third of a series of posts looking at each of the different visualization types created for the MeSch museum post-visit visualization tool. Click here for the overview. This experimental visualisation was inspired by a page on the Wonderkamers website (which has since been moved to the Kunst museum and updated)

Abstract visualisation of a users visit showing a face at the centre surrounded by a series of circles

Code Data Visualizations Research

Bubbles Visualisation

This is the fourth of a series of posts looking at each of the different visualization types created for the MeSch museum post-visit visualization tool. Click here for overview. The bubbles visualisation is an abstract interactive illustration. A personalised character (similar to the personalised character detailed here) sits at the centre of a number of rings of bubbles (discs). The number of rings is determined by how many perspectives were available at the physical exhibition. For example at the Atlantikwall exhibition in Museon in Den Haag it was possible to experience the offering from one of 3 perspective; a German soldier, a civilian and/or a civil servant. Therefore the bubbles visualisation for this will have 3 rings of bubbles.

Code Data Visualizations Research

Word Cloud Visualisation

This is the second of a series of posts looking at each of the different visualization types created for the MeSch museum post-visit visualization tool. Click here for overview. Continuing the exploration of these visualizations we now look at the word cloud visualisation. The general concept of a word cloud visualisation is nothing particularly novel. As such it is a familiar way for users to interact with a site. The word cloud gives greater prominence to words that appear more frequently in the source. For this particular implementation the text content that the visitor is exposed to during their physical visit is used as the source. Using only the content from the points of interest that the visitor experienced the text is split into an array of words, word frequency is counted, certain words are filtered out and the remaining are displayed in the word cloud.

Code Data Visualizations Research

Personalized avatar using svg.js

This is the first of a series of posts looking at each of the different visualization types created for the MeSch museum post-visit visualization tool. Click here for overview. Each museum visitor can get a postcard with a 11 character string in the format ABC-123-1234. This string is their unique passcode and can be used to access the digital post-visit visualization tool and view further information about their physical visit. One of the many visualizations developed for this online platform is the somewhat abstract SVG character visualization. A unique and personalised character to playfully represent the visitor. This specific idea was proposed by a group of Sheffield Hallam University students tasked with coming up with various ways of representing museum visitors visit visually.

pictures of post visit postcard, how to use passcode on postcard on website, invitation to add your own memories

Atlantic Wall post-visit website

“The Hague and the Atlantic Wall: War in the City of Peace” was a museum exhibition which ran from April to October in 2015 at Museon in the city of The Hague, in The Netherlands. The Atlantic Wall was a set of the defensive lines and placements that were built by the German forces during WWII along the coast of the Atlantic Ocean and North Sea, from Norway to the French/Spanish border. The wall consisted of a 5,000 km long chain of bunkers, anti-tank walls, cliffs and other barriers and was aimed at preventing an Allied attack on the Reich’s Western frontiers. This exhibition focused specifically on the Atlantic Wall in The Hague and the impact of its construction on the city and its inhabitants. Visitors were tracked as they interacted with the exhibition and once they had completed their visit they could visit a checkout point and print themselves a personalized visit souvenir postcard.

Code Data Visualizations Research

Create Kibana visualizations and dashboards dynamically

If you've used Kibana, then you probably know how easy it is to create a dashboard via the GUI. What you may not know is that it is also possible to dynamically create kibana dashboards and visualizations! It is as easy as making a curl request.

kibanagui - dynamically create kibana dashboards

Android Code

Atlantikwall Android App

The video below demonstrates an Android App built for evaluation of Atlantikwall exhibition at Museon in Den Haag. This application has been built on the Ionic Cordova stack. The user first chooses language(Dutch or English), then perspective(Soldier, Civilian or Civil Servant) and may then watch videos for the various points of interest.

Code Research WordPress

iStep in action

What is iStep

iStep is a web based intervention developed by Sheffield Hallam University as part of the EU funded project Innovage. Its aims were to both promote and enable healthy, active lifestyles towards a reduction in levels of problematic obesity in increasingly aging populations. iStep stands for 'Intergenerational Support To Encourage Physical Activity'. The iStep tool was designed to allow a younger and an older person to form a partnerships and track their physical activity. Two people would pair up to form a dyad. They could then compete against other pairs to complete a challenge. Users of the system could see how much activity they had done, compare their progress with other dyads teams, and work towards a series of collective goals, by logging onto the on-line iStep environment.

How does iStep work?

The videos below illustrate each stage of using the iStep platform.

Code Data Visualizations Research

Code

Personalised Lego Character from Photo

Animal Path Visualisation

Map Visualisation

Timeline Visualisation

Grid Visualisation

Bubbles Visualisation

Word Cloud Visualisation

Personalized avatar using svg.js

Atlantic Wall post-visit website

Create Kibana visualizations and dashboards dynamically

Atlantikwall Android App

iStep in action

What is iStep

How does iStep work?

Google Maps API V3 Demos

Make vertical swipe scroll down in browser on Android

The Hague and the Atlantic Wall