Joining The Data

A class blog documenting our college project.

Team 1 - Creating an Interactive Map


Creating an Interactive Map

After we presented out three concepts to the clients, we took a step back from our ideas of a heads-up display helmet. The helmet idea was an exciting area to look at but perhaps not a realistic one for the client or the brief. We had to look at the users that use bikes in Dublin. Its a cultural thing that no one within the city wears a helmet, so to get them to wear a heads-up display helmet would be a challenge in itself. 

We did however get great feedback from our body storming session out on the streets of Dublin. This led our design thinking to look away from a helmet that gave live updates on air quality and more towards add ons to Dublin Bike. As a group of three we broke away and conceptualised three ideas we felt fitted the brief, our feedback from the client and the personas created in weeks previous. 


After we presented our three new ideas to the client, all slightly different than the other, we were able to pin point an area we thought best suited the the clients needs. The idea was brought about when we started to sketch out ideas of what a product would look like that showed the best air quality for Dublin Bike users. We began with an idea of the Dublin Bike having a simple indicator that reacts to live data shared, showing the bike user what the quality of air is like in the location they are in at any given time. As we went on, we started to see the project was turning into a service design. A service design that would be an add on to the already set up Dublin Bike service. The idea of an interactive map emerged when we came upon the Paris Metro interaction map. This simple map that allowed users to path out their journey by pressing one simple button let them see clearly the path they should take by highlighting the streets using LED's. The map had a large number of buttons with separate destinations, allowing the user to easily decide on their preferred location. 

4423756547_5bbf70560a.jpg (500×375):

This map really drove our design thinking, and gave us a drive to create a more interactive way for Dublin Bike users to find their way around Dublin City. 

To make this unit we needed a map. Size was something that we discussed thoroughly. We weren't sure if small and discreet would benefit what we were aiming for. Large scale, that draws attention to first time users and create a retro feel that intrigued all generations to want to participate in not only learning new routes around Dublin, but also the cleanest routes. This would educate users about air quality with out forcing anyone to learn facts and figures. The map was first drawn up in large scale on paper.


It was then brought into illustrator where the outlines were created for the laser cutter to cut out the buildings. We done this on plywood which we then build up the building with multiple cut outs to create a 3D form. 



The plans for this map unit is to be the same as the Paris Metro map, but with a slight difference. The map shows you the destination of the next Dublin Bike station to leave your bike off. The map unit gives the user the number of the station you wish to go to and the user enters the number into the bike. The bike then gives you direction options for fast route, or the clean route. 









Team 2 : Let's get digital




During our first stages a majority of our concept focused around the kits. We knew we wanted to included an online interaction too and started to talk about who we were designing for and what would they want.

After revisiting our  activities (you can read more about in Yana's blog Air Kits) and listening to teachers about what was effective in the classroom we decided we needed a number of different profiles, community, teacher and student. This was our first starting point and we created quick site maps to help  understand content and flows.

Version 1.0 sitemap 

Drawing out the site map and rethinking our persona we decided that there were way too many log in's and remembering another password might be a barrier to engagement. We did not want to add any extra work for Karen as she is busy and currently not engaged with air quality. This resulted in just one log in for the teacher while the rest of the community and the students will have a sub set of the teacher content available to them.

We created goals for the site to help set the tone and understand what we wanted to achieved.

  • I am clean and simple
  • If I am used in a classroom many can see me at once even if a group is gathered around a laptop
  • I can be used on a projector or smart board
  • My colour palette is refined, minimum with pops of colour
  • Calls to action are limited per page, no confusion please!
  • The students are the stars of the show, the focus is them
We iterated on the sitemap and considered where EPA could be used and how to include citizen science data. Once a sitemap was loosely defined we then started to make rough sketches considering the content, layout, context and user goals. We made notes beside sketches on possible interactions and what were primary actions vs secondary.

We also wanted to ensure the online experience and the offline (physical kits) felt contented and helped with the learning and sense making of the data. Using elements from the kits we created a digital representation so there would be familiarity and used it as a tool to introduce other elements about air quality like the EPA stations and data. 

considering users with sitemaps

sketching to understand flows and interactions

After receiving feedback it confirmed our thoughts on the direction we wanted to go, an open site for Karen and the community that would include a map showing areas being monitored by the EPA or the students, a page to view the the work and documentation by the students, a page with helpful homework resources and a page about the program.

The teacher view included additional pages or extra content on the community pages. Items from the teacher view could be shared onto the community view or kept private for just the class. 

After deciding the flows and how the site would scale with additional streams of water, soil and waste  (you can read a bit about the streams on Joes blog)  along with considering the features that may need to be applied as it grows we picked the key pages to develop further for Fridays presentation.

Ideally, and what we really needed to do,was to move the sketches into axure or another wire framing tool to work out all the parts in greater detail but due to time restrictions we jumped into high-fi's in photoshop and created the interactions in keynote. Here is just one example of a page and the interactions we considered.

Understanding data in the classroom, using the catching air experiment to help make EPA data relatable 



The screen based interactions on this project was interesting to work on. Next stop final presentation and promo video.

Team 2: Kits Kits Kits


We are providing both student and teacher kits that will be run over the academic year with 6th class students. Each student gets their own kit and the activities work with the existing curriculum so can be included in a number of different subjectsEach kit includes a primary air quality activity with other recommended secondary activities. These can be done in school or at home.  



The Kit is designed to be compact, long lasting and easy to use for both the teacher and student. We began by defining the contents and activities. This allowed us to then design the packaging directly for the users and the activities they would be participating in.



The packaging is all about the student and the teachers, keeping things simple and removing any barriers to the learning process.

Each dox is clearly labeled 1, 2, 3 according the stage of the programme. There is a space to write your name and class on the front edge as they will probably be stacked on a communal shelf or placed in personal cubbyholes in the classroom. When you open the box, it stays open and you’re presented with a set of labeled activity boxes, each of which contains everything required for that activity, from instruction cards to equipment





Kit 1 includes the first group of activities. Kit 1 is an introduction to Air Quality and begins to connect Air Quality with visible items through tangible learning and links to the curriculum through Maths, Science, Art and Geography.

Catching Air (Main Air Quality activity)
Student writes their name on the back of the card

Smear vaseline on the square of the card

Hang up outside in the school grounds

Record the location
Examine one or two weeks later
Compare different areas

Paper Pinwheel
Helps to understand air by making it visible

Lichen Spray
Long term project to be run over the year. Involves monitoring lichen growth in different areas and recoding its progress.

Data Paint
To begin visualising data based on pollutant values



Kit 2, Manipulating Data - NOx Diffusion tubes (Main Air Quality activity)
Sourced the diffusion tubes through the mapping for change project in the Barbican Centre.
• Place around the school grounds - opportunity to bring home
• Collect 2-3 weeks later and send for analysis

• Visualise and share results when received





Kit 3, Going Beyond the School Gates - Electronic AQ sensor (Main Air Quality activity)
We built a simple, low cost, low energy, PM & Temp Sensor which downloads readings to SD Card
Similar to diffusion tubes but with recommended take home period
Upload and share the data as a class




We spoke to some teachers we know as well as those who are studying at NCAD. They provided great insights into how the children might respond to different tasks as well as how to make the kit more attractive to them as teachers. A key insight here was, rather than expecting the teacher to become familiar with the activity before running it with the class just give them a script to read from in the teacher’s kit. 



We ran the Catching Air activity from Kit 1 with a group of 6th class students in St Catherines Down national school. This allowed us to test eek with both the teacher and students.

School Trip Video (Awaiting confirmation)
This is EEK's promotion video. Enjoy!

Team 3 The Construction Process

We began the construction process after we had finalised a sketch model incorporating all of the feedback which we had taken onboard from the user testing. And so we began to examine the technical specifications, and final form which our piece would take. Tara conceptualised a 3D model using Rhino software which she was using for the first time and picked up very quickly. Tara came forth with a really nice 3D model of what the final physical element would take



Then the physical construction process began. Things we needed to consider were the materials as part of our design we aimed to make the installation portable for the client to move to a variety of locations. Therefore, we needed to have light and durable materials, which also needed to incorporate air tight tubing for inflating the balloons. We also hoped that the materials could be shaped to appear as abstract tree branches.

We headed over to Chadwicks to investigate different materials that would suit this. We chose half inch PVC Pipes to use as the branches due to their light weight and because they are easy to bend and manipulate. We also needed to consider a durable but strong tubing to place inside the branches that would fit wiring for the leds and also provide support for the bending of the PVC tubing using a heat gun. We finally acquired a larger 2.5 inch rain pipe which we would use as the trunk for tree.

And so the construction process began....

The tubing was placed inside the PVC piping which we then began to bend and shape using a heat gun in the workshop. In the meantime we also had began some of the laser cutting which included etching information about the pollutants onto large pieces of perspex which would make up the casing for the piece.



As the tree progressed in its form, Tara began to chose the colour that we would spray it. We reviewed a number of colours but it seemed a nice copper finish would give a level of polish to the product which was already made up of cheaper light materials.



And after spraying the tree was beginning to look quite well...



Following this we brought the piece back up to the studio where we began to wire up the led's through the pipes and connect them to the arduino board. We programmed the LED's to have different values depending on the data values of each pollutant. Once we fixed the LED's in place at the end of each of the tubes we were able to attach the large multi-coloured balloons to end of each tube.

The following morning (Friday) we headed back down to the workshop to construct a wooden hexagonal base for the piece in which it would provide a housing for the Arduino, the Air Pump and the power sources.

The base was then taken out and sprayed late on Friday morning so we could begin to piece each element together in the afternoon. On Friday evening it was all beginning to take some shape.


The final piece is shown below while the finishing touches are being made





Team 1: Hi fidelity App development, physical artefact cast and Lap style user testing



Today was another busy day as Dublin Bike, Clean Link pushed forward in many areas of our design phase. We began looking towards high quality prototypes of all aspects of the design, while grounding all developments in user test, constantly bringing reiterating through tests from volunteers.

Our intention is to have a working example of the various different touches points ready to display by Monday 2pm.

Following on from a lo-fidelity paper prototype app click through, realised in Marvel app, we pushed on towards a more finished mobile application which will then be made interactive through Principle.


This time consuming process was highly rewarding as we ironed out the issues that had arisen from early iterations and sketches. We began to gain a better feel for how the feature would be perceived by the public within a new version of the Dublin Bike App.

Down in the workshop, we began to work with the Cellacast cast of the bicycle dash-board that we had made, which was taken forward to a 2 part plaster mould to be vacuum formed in plastic, to house our programmed LED interaction. This was a laborious process to take the initial cast to a state that was able to take the liquid plaster pour. Creating a bed of clay around the cast and building up the walls to have a flat backed finish on each side of the plaster moulds.
In the evening it came time for a lab style test of the LED navigation tool. The product is intended to be used out on the road with a lot of variables and unpredictability, this threw up difficulty in testing. We felt the easiest way to recreate the experience in a safe manner and enabling us to take the navigation out of the control of the tester and place it on the bike so the cyclist must follow the LED instructions, was to head out a get some GoPro footage of a route. Bringing this back into the studio and projecting onto the wall, we set up an elaborate bike rig to so user can have the feel of taking to the streets with Dublin Bike, Clean Link.


Even with all our preparation, users were encouraged to keep in mind that the bike they were using was not a Dublin Bike, 3 speed cruiser, which has the cyclist in a more upright seated position. Another disturbance to the testers experience was that the projected screen had the road appear at disorientating sharp angle. With these taken into consideration, we were given brilliant insight into the overall feel of the navigation tool. 

We now continue and move forward to correct issues highlighted and realise a high degree of finish to all our touch points.......

Team 1: Pushing forward, User Testing and Implementing Final Iterations


Today we pushed forward on the exploration of a next generation version of the Dublin Bike, which caters to the most vulnerable road users to Air Pollution, inner city cyclists.

Dublin Bike, Clean Link: The bicycle navigation tool that allows users to choose cleaner routes to get to their destination and an additional app feature which enables the commuter to plot their path prior to collection of the bike. For interested members of the public there is a detailed break down of the stats of each route, the red route being the quickest path to the station and the green route being the cleanest. For the novice user the simple choice of 2 paths offers an alternative to the quickest route, which will gently entice cyclist to be more conscious of emissions on the road, that air quality changes and has an impact on health.

The day began by having a lengthy discussion about the details of both the interface on the dashboard of the bicycle, and operation of the Clean Link feature within the Dublin Bike mobile Application. We imagine that the version 2 of Dublin Bike would be part designed in conjunction and under the guidance of the EPA.
We sketched ideas and brought these together to settle on the final design.

With the help of our technician Ed Devane we quickly programmed the interactions of the dashboard LED navigation display, to enable the team to user-test the concept. This was realised in two iterations, the initial version was hacked using handle-bar mounted lights for night time illumination of a cyclist. Once we had this prototype operating we brought it to the Dublin Bike, and based off feedback came back to the studio to begin the build of a more hi-fidelity navigation tool. This is how we imagine the final design would look. 

Deciding upon the colour sequence, we believe the centre 6 lights in green give a intuitive direction to follow forward (Green for proceed). The yellow rows of lights on the left and right, alert a user that a turn is approaching, yellow being the symbol for decrease speed, preparing to make a turn.


Our next aim was to try and replicate the
dash-board of the Dublin Bike which will have the circuit board incorporated into it, this process consisted of taking a first mould from the bicycle
 using  rolls Cellacast.

In the mean time, we began to digitise all of the Design tools that we had used to test and explore the service. Testing this design against our primary user ( from our personas the design is specifically looking to target Stephen and Claire) and the context of use of our product. This involved a service blueprint, heuristic evaluation and persona scenarios.

We also began the process of using Adobe After Effects as a way of demonstrating the functions of our design, as many of our early user testing has required the tester to self direct the navigation tool.  This is a problem that we believe through careful thought, a projector and a static cycle bike we can over come to get the best insights from users........


Team 3: Developing the prototype - week 5

We arrived to the studio at the beginning of week 5 and came together to iron out the final details about the form of our piece, the materials is would be made with, the mechanics of how it would work, its scale etc.

After a lot of discussion we decided to stick with the tree form, specifically an abstract angular tree. We also agreed that the piece should have a strong base to support it, and that the Airen 'tree' trunk should be encased in perspex. The rational behind creating a secure base for the piece would be to protect the public, and the piece itself from damage or injury. This enclosure would be hexagonal, so that information about the six different pollutants being monitored could be explained in further detail on the piece. We plan for the information to be etched onto the perspex casing.

We realised that enclosing the tree may encourage people to litter, so we designed a hexagonal pyramid shape to sit on top of the case. This pyramid would fit tightly around the tree trunk so that there would be no space for anything to get in or out.



I created a 3D model of what this form may look like using Rhino3D. Seeing the form helped us to visualise the scale of the product and the materials.

We also created a mock twitter account using a template, to show what Airen's online presence might look like.

After completing all this preparation work we began to source materials to use for the next day, when we would begin building the Airen tree.



Team 2: EEK Kit Contents


Pack 1:
Pack 1, the first pack that the students receive, includes activities and fun experiments that eases and slowly introduces the students to Air Quality. This is the pack that we decided to concentrate on and develop the most. Along with all the packs comes a website that the students can log their activities and collections to share with their parents and the rest of the community. This pack contains:

  • Catching Air Activity: vaseline and card (main activity) where the students spread some vaseline on the card and hang it outside in various locations around the school/ home. After a few days they inspect the cards for particulate matter they may have collected.
  • Paper Pinwheel Activity: paper pinwheel with its arm and leg that need to be assembled. This helps understand air by making it visible.
  • Lichen Spray
  • Data Paint: visualising data by using paint. Introduction to data.
  • Instruction Cards: each pack contains instruction cards that the students will use as a step-by-step guide for the activities.
Pack 1

Pack 2:
I won't go into a lot of detail in this pack or the third pack. The main activity in the second pack are the NOx Air Quality Monitoring tubes that the students can leave around the school/ home to collect NOx samples. This will lead to a brief introduction about the EPA and also an opportunity to start mapping the area for the rest of the community to see. Other activities that might be included would link to the previous pack, for example, documentation of the growing lichen.

Pack 2
Pack 3:
The third pack is the final pack, received during the third school term after having completed the previous two. This is a more advanced pack and it contains sensors that the students can use at school/ home to collect data. This will be further linked into the EPA and data collection. It carries on previous activities by making them more advanced. 


Pack 3
After finishing the 3 packs, after getting feedback from teachers, we decided to not have a reward system. The teachers that we spoke to already had their own reward systems within the class/ school. We are considering various end-of-year exhibitions, showcasing student's work, individual certificates that the students might get and some prizes given out on Sport's Day for best project etc.

Team 1 - User Testing

Back from a weekend of working our concept into an interactive smart glass map above a tactile model which involved testing how the interactive glass would look in after effects.



 We began today by going out into the wild to user test our interactive air quality map with members of the public to gauge their reaction and see what features they would like included or removed.

This process was very helpful and gave us tones of useful feedback and insights about the product.





The public seemed very enthusiastic and yet once brought back to the drawing board we had a good hard look at the concept and felt that it was drifting from the brief of raising awareness of air quality as the more features we added we found the impact of it's air quality capabilities were drifting into the background somewhat.

We called a meeting with our peers in the class in the afternoon to consult them about our fears surrounding our concept. Following a long and helpful conservation, we have decided to change our concept to bring it back more in line with the brief while retaining the core idea of providing air quality data for Dublin bike users in a way that would make the data more meaningful to them.

This will take the form of an app that will allow the user to choose the quickest or the AQ beneficial route to their destination which will then link into the bike as previously with a handlebar light display guiding them to their destination based on the decision they made when picking their route with the app. We look forward to bringing this concept through to our final presentation and doing the large amount of work that has gone into this brief justice.

Team 3 Branding and Colour Palettes

Today we aimed to look at the branding and colour palettes that we aimed to use for Airen our design solution for the EPA and Intel. We examined a number of colour palettes using mood boards and Adobe Colour Palette Selection. We aimed to find a soft colour palette which would also work nicely with the EPA's existing overall branding. We found a nice palette which would wok in this way called pear fizz shown below:


From here, we were able to begin Logo design and Avatar development for our online persona and twitter touchpoint to the project. 

We played around with a number of fonts and colours for both the Avatar and the online persona. Shown below is Airen our online Avatar:


Incorporated into his design is the EPA logo and he is modelled off the sign for an information point. We kept within our colour palette in our design and tried to keep a friendly quirky appearance overall.

The logo we chose to go with also incorporated Airen our little avatar and is shown below. This will be the branding for our final product.

Team 2: Teacher Reviews of the Kit

After figuring out the pack contents we got a group of Primary and Secondary school teachers to come in and review the pack and the idea of our service. We got some really great feedback on how this could be rolled out into schools and also what kind of engagement the students might have, whether they would want to engage with this at all. Our chat with the teachers reinforced our selection of the 5th/ 6th class age group.


Meanwhile we also arranged to go to a local school to speak to a 6th class teacher and to run the Vaseline and card/ jar activity with the class. 

We divided ourselves up: 3 people would run the activity with a group of students and one person would be filming. We prepared a pack for each of us to take. Each pack contained vaseline, jars, card and string. 

The teacher introduced the activity to the class by asking what they thought the phrase "a breath of fresh air" meant. The way we ran the activity was we got each student to put their names on their card/ jar and tie a piece of string on the card. We then went outside into 3 different areas of the school playground and here the students put vaseline on their cards and jars. They then found a spot to hang the cards and place the jars, noting down their locations. The children were all curious as to what we were doing and why, and some of them, surprisingly enough, knew a lot about air quality already.





We are hoping to go back to the school before our final presentation to get the cards back and see if they collected any data. Overall both the students and teacher enjoyed the activity. It did not take up too much time and it was great for us to see it in a real life context.

Team 3 Friday Prototypes, Meetings and User Testing

On Friday morning we began early building a new form prototype in the studio. We tried to incorporate the feedback we had received from the clients from the previous week and our tutors during the current week. We developed  a low fidelity prototype shown below.


In addition to this, we also began to start considering some of the wireframes for the user journey we had suggested for the interaction points of Airen. At this point we were primarily concerned with the wire frames for mobile as this was our main point of interaction with the physical object. 


The ideation behind the microsite we suggested is that it would provide an online interactive experience for users who could not physically engage with the tree. Users would be able to interact with the tree by choosing different locations to check the data along with finding out more information about each pollutant the EPA is currently testing for and what those pollutants mean to the general public. 

IN the afternoon we led a peer-feedback and user testing session with our peers. We asked them to critically analyse our overall service through each suggested touchpoint. We found this really helpful as they had great feedback for us and some really interesting points which we then iterated into our design where possible before heading out to user test.


Our user testing we went very well that afternoon. We headed out around the campus and nearby Dublin 8 to get some feedback on the prototype. We got some really nice feedback surrounding the product.


Some of the feedback we received included:

It was perceived it to be about about pollution
People said they would engage with the tree if they were to see it
Suggestions included placing it in a public space, especially around high commercial areas
Users would engage in online aspect if they were receiving something for free
Users stated it needed to have a balance of fun and putting the relevant information across
Users suggested the form was interesting but needed to be a little more abstracted and appealing