DEWG Testing – 5th Dec

Article published on: Dec 7th, 2019

Updated on: Apr 16th, 2020

Estimated Reading Time: 3 minutes

Kelly sikkema 1 RZL8BGBM unsplash

unsplash-logoPhoto by Kelly Sikkema

I am fortunate to be a member of the Digital Education Working Group (DEWG) at the University of Southampton, although I wont go into too much detail, its worth sketching out the group a little, we are hoping to become a committee one day.

The group comprises of individuals from across the University in Academic, Research and Professional service roles who have a keen interest and background in technology and learning. I tend to be there to lean on the Humanities side and get us to think about the people using the technology and how we leverage and delight the people in our organisation to better deliver world class education. We as a group try (very hard) not to get sidelined by what technology we should use or deploy but consider the overarching aims of empowerment through technology and how to better support our staff and ultimately our students as they enter a constantly networked and digitally connected world, no matter their core discipline of study. So I tend to be talking about digital literacies and the pitfalls of navigating our information society.

We meet once a month and initially our work has been quiet reactionary, with thoughts and reflections on the roll out of services like Office 365 and one larger piece of work was providing recommendations to the University Education Committee on what they must be doing to meet the new web accessibility laws as they come into effect for public organisations within the UK.

However our main task has been to discuss and create a vision for Digital Education at the University of Southampton which would connect to and inform the Universities Education Strategy, we have debated a lot about the word digital as we think everything is digital and this type of thinking should just be inside the Education Strategy however that is something that may take a while to change. For now we need a vision and some factors around what makes a great educator at the University of Southampton.

So at the last meeting after an update on some of the accessibility work being carried out internally to make our Blackboard Inc. installation more inclusive we where tasked to use either post it notes or a Padlet in groups of 3 to revisit the vision and connected topic, our group was assigned the topic educator.

It dawned on me why use Padlet when we could use instead, this would also test my theory around being able to “spin up” an instance easily and to instantly work on an idea in a group. I managed to persuade the group quickly to not use Padlet and test Within less than a minute we where all hooked up to a new instance, by following my simple guidance. We started working on co-creating some thoughts on the task at hand. The only blip was Microsoft Edge on a Dell XPS (with touch screen) seemed to have some issues creating or joining an instance, but quickly switching to Chrome seemed to resolve this. Also the Dell machine seemed to have issues with the double clicking to edit as well, which didn’t really matter for the task at hand but was odd. The other member of the group seemed to instantly understand how to use and very little guidance was needed. I also later made a special direct link to this instance and shared it with the whole digital education working group. We shall see whether anyone else adds to or creates more connections remotely. One of the questions was why use that when we have a Padlet, my initial answer was because is Free Open Source Software (FOSS), which quickly resolved the argument.

As an aside I noting afterwards Padlet’s privacy policy which we would be agreeing to just by using it. Here is a quick peak at some high level points it makes, some designed to improve the service but most ultimately connected to adverts. 1

So by choosing we kept all the data to ourselves and this was all stored locally on the laptops in the room, this got some approved nodding in the group and we didn’t inadvertently share any of our device details, IP address or provide data for 3rd party advertisers. A small win for I would say.

Screenshot 2019 12 06 at 18 37 34

Main take aways

  • Being able to quick create a shared (private) digital space was as easy asa I hoped
  • Shared digital space inclusive by design, you didnt need an account or must use ‘twitter’
  • Very little explanation was needed, can I / do I need to make thiz zero
  • Edge browser needs checking
  • Edit mode needs checking

    • track behaviour on Padlet
    • show third-party ads
    • we collect your IP address
    • we may also obtain information, including personal information, from third-party sources
    • collect device-specific information such as:
    • device brand, version, and type
    • operating system and version
    • browser type and version
    • screen size and resolution
    • battery and signal strength
    • show ads about Padlet outside of the Service (e.g. on LinkedIn)

Current Tech Stack – Nov 2019

Article published on: Dec 2nd, 2019

Updated on: Apr 16th, 2020

Estimated Reading Time: 2 minutes

Holly stratton jN1C3 edaro unsplash

unsplash-logoPhoto from Eaters Collective

I have recently found myself sharing again a link from Nov 2017 about some of the prototypes back then, so it become apparent I need to provide an update on the tech stack being used now within my project, without the need to dive into the code itself.

The stack is now Vue.js with Vuex connected to CouchDB via PouchDB. The resulting information is rendered in html using a number of components and standard SVG elements to create interactive views. The use of additional plug ins has been removed unless necessary, this helps keep the project inline with the GNU Licence.

The biggest change is to move to CouchDB and PouchDB this has replaced my previous use of deepstreamHub which initially looked like a great open source alternative to Google’s Firebase however the deepstreamHub which was a cloud instance of deepstream stopped working and hasn’t been updated in a long time. I made a number of attempts to run my own deepstream, which was one of the reasons for picking the platform, the open source server tech, but trying to get this running in the same way the hub version worked proved to be fruitless.

It become very apparent this was a major block in the project. I reached out to a developer friend of mine to see what else he could also locate out there, we chatted over the general project aims, realtime nature, the vue.js json style structure and had been useful within firebase, we also discussed the ownership of the data so he went off to think about what could provide the underpinning structure I wanted.

He came back with the suggestion of CouchDB and subsequently PouchDB which would also answer my need for local storage and offline capabilities. After making the changes to the project to use PouchDB and CouchDB I also was pointed towards an interesting article from ink and switch looking at the development of local first software and the concept of owning your data, in spite of the cloud, which chimed very much with my research 1 and although they seemed to rule out CouchDB, due to some concerns over conflict resolution and its ability to do realtime, I have not hit those kinds of issue and have realtime collaborative capabilities working.

A little gif showcasing’s use of realtime collaboration.

Realtime couch

Main take aways

  1. They have very recently released PUSHPIN which is a collaborative spatial interface tool.

Testing – 29th Nov 2019

Article published on: Nov 29th, 2019

Updated on: Apr 16th, 2020

Estimated Reading Time: 2 minutes

David pennington T GjUWPW oI unsplash

unsplash-logoDavid Pennington

This testing session was carried out with year 3 Games Design & Art. This test was using version 0.0.24d (YouTube explainer). The students were presenting a series of potential game ideas to each other, some of them in teams. The format for each was a 12 minute presentation of their 3 game ideas with accompanying slidedeck. The other students used a instance to comment as the presentation was happening and afterwards for a few brief moments. The one main question I posed to each team to outline that could be answered collectivly via was what is there biggest struggle issue? For example choosing which game idea to go forward or another aspect that the “crowd” could help on. In reflection from this session I think a more focussed use of on the question at the end could have worked better as I noticed that contributing live specifically with the spatial view only on show was much harder, the cognative load was high, to listen type and see spatially. This was in part to removing the list view, this again gives rise to the idea of a series of views that work better for different types of sessions for using Although some of the connections and such started to be draw as seen in this screenshot, even with the shortcuts, the crowd couldn’t think that fast.

Wip nodenog

Also I felt much more this time as I was involved in thiking and responding during this session as well I think I miss some of the issues students hit with In future I need to either be recording the session in a way that is useful for my own reflection or get another staff member to use the tool in a perscibed way with students while I just observe the use. We have a big session set for the end of January which I need to prepare the use case / cases so I can gain the most useful feedback from this as much as possible. This will likely include blocking in some time to get students to write feedback into discourse. May need to use Microsoft Forms as discourse is public and students need to join to complete, which is a barrier for sure

This testing has shown that the spatial view is a slower thinking space, which needs to be coupled with a quicker throw thoughts into a bin exercise.

For this work we first need a bucket collect mode. Then we move into a spatial view where these are first neatly arranged1 and then facilitate a spatial process on the ideas, discarding some, clustering some, connecting some and making new informed and more details inputs into the spatial view.

The spatial view does needs to trim up the text, but there has to still be the ability to glance at the information and arrange as having to keep opening a reader view may be too slow even in the spatial mode.

For now I’ll call these two actions modes, Bucket mode and Consideration mode.

Main take aways

  • Bucket mode to be turned on.
  • Reader view needs some work.
  • Gathering more feedback in sessions is really important.

  1. Some type of initial auto placement. based on entry time perhaps?

No log ins please!

Article published on: Nov 20th, 2019

Updated on: Apr 16th, 2020

Estimated Reading Time: 3 minutes

Gary bendig XWRC2hjx 1A unsplash
unsplash-logoPhoto by Gary Bendig

I was keen to eliminate the need for any type of log in, as storing usernames and passwords would be problematic, this is due in part to one of the privacy design principles for in that the system must only store data it needs to know and then any said data should be encrypted and decrypted to the owner of that contribution. Also this would require the process of signing up, which would drastically slow down the ability to just point a group of designers/makers to a URL and start working together, this would also rub up against one of the other principles of delightful design, signing up and saving passwords even with 1Password is not really delightful. does however need a way to identify contributions and so it uses the value attached to the device name (client id), this is decided by the contributor when they arrive at the initial URL for the first time, this is then used as the name of each document1. When you decide on a device name this creates the new document which is the data structure for contributions. Clustering contributions into documents to a device enables differences in read / write access to said data and enables the contributor to easily remove, export and single out their own contributions. Other data such as positions and connections are stored as separate documents to simplify the way to create and manage shared views.

Screenshot 2019 11 13 at 22 04 40
Screenshot 2019 11 13 at 22 05 02

I had specifically been looking at the process that was used within and I had used to some degree before back in my PHP coding days, that of using a URL with a token appended, this URL is then emailed to you This would negate the need to store usernames or passwords but would require a way to email said URLs from the server, which I was not keen on, although Sendy2 could have possibly done this and has many options to not track, however this felt overly complicated for what I required.

IMG 0322B3E11A3A 1

During some of this researching I was reading around using Javascript Object Notation (JSON) Web Tokens (JWT), which led me to web storage. I soon realised that I could use web storage to store the device name within localStorage 3 so that after the initial ‘log in’ vue.js could check on any arrival if this storage was in place and redirect the visitor straight to making contributions on said instance, thus “logging” them in.

When you first visit the URL you are requested to input a “device name” this is then stored on your browsers local storage and enables you to “log in” without the need for a username and password. When you next load the page this token is looked for and if found connects you to the correct document store. Deleting the local storage would require that you enter a device name again, however specifying the same device name would basically connect you to the same document store.

Screenshot 2019 11 20 at 19 35 14
This approach worked really well in the end. In testing students could all quickly grasp the idea of naming their device and would quickly assume pseudo names. I would like some feedback on changing the wording of “device name” to something the seems to be less technical as this could be a bit of a barrier to the intuitive nature of getting up and running, I think it causes a huh moment, a pause and thus a break in user 4 flow as each time we have tested I have always said “put in a device name it can be anything you want it to be.”

  1. CouchDB’s data structure uses documents instead of tables and is formatted as Javascript Object Notation (JSON) which also easily matches vue.js’s data structure.

  2. Sendy is a self hosted email newsletter application that lets you send emails via Amazon Simple Email Service (SES).

  3. localStorage is a persistent storage kept in browsers until the user chooses to remove it

  4. I really dont like using the term user but just replacing it with human is odd, I might start using designer/maker


Article published on: Nov 13th, 2019

Updated on: Apr 16th, 2020

Estimated Reading Time: < 1 minute

Thomas galler hZ3uF1 z2Qc unsplash

unsplash-logoPhoto by Thomas Galler

I plan to post more updates to going forward with some more details on the project milestones as we ramp towards the end game, the schedule and thoughts. Although I highly recommend following my discursive and specifically the PhD category, you could use NetNewsWire to do this as I document ongoing thoughts and things related to this project in much more casual and regular basis. Here the posts will be milestone documentation. The Official research documents will be on All feedback welcome at discourse, each post here will have a specific option to pull in comments as well. Also I started using MarsEdit to post to the blog so that should make things much easier.

Year 1 Testing – 4th Nov 2019

Article published on: Nov 4th, 2019

Updated on: Apr 16th, 2020

Estimated Reading Time: 2 minutes

Charles YJxAy2p ZJ4 unsplash

After using with the final year students a number of times with a reasonable success. I realised that the session I had planned with our first year students was a week before their very first presentations and that it could be another way to test my hypotheses from the very first test that could be used to calm the nerves of students as deadlines approach. By making the students anonymously come to the realisation that everyone felt very similar and had the same types of concerns. For this session I also removed the list view from within and presented just the spatial view on its own, and removed the ability to see device names increasing the level of anonymous interactions.

We posed a question to respond to inside What are you worried or concerned about for Friday’s Presentation? As the students started to add comments you could feel the tension lowering in the room as it dawned on them that they all had similar issues, the fact it was anonymous was also again popular. One student also without prompting started to organise and cluster the nodes together spatially as similar thoughts appeared, this may have been prompted by me suggesting this, I am not sure, however interestingly as one student had taken the lead on this task and others didn’t mess around with this student being the designated organiser, although we didn’t know who it was until I was walking around the room looking at students use the platform. I tried to elicit feedback afterwards on discourse but that didn’t work! I will allow time for this feedback to be gathered in the future.

Again I had my mac plugged into the main screen projecting the activity in, which reminded me of a view mode toggle that would be good as a present mode.

Screenshot 2020 01 06 at 14 05 56
As staff we then talked through the concerns on screen and this made the session really useful for collective reflection and pause with an impending deadline.

Main take aways

  • Clearly working to help support end of project concerns, realising your not the only one.
  • I was able to help by talking about the collective concerns.
  • Could you have an option lock down spatial arranging to one person.
  • The concept of big screen viewing mode would help.
  • Reflective use prior to deadline.
  • Allocate time for discourse feedback (make students do it).

1 Theme Testing – 1st Nov 2019

Article published on: Nov 1st, 2019

Updated on: Apr 16th, 2020

Estimated Reading Time: < 1 minute

Rene bohmer YeUVDKZWSZ4 unsplash
unsplash-logoRene Böhmer

This test was where I introduced the spatial mode and the list mode together for the first time. Students also started to use the different types of nodes including the link node and attachment node. However viewing the attachments and linking out was not possible.

Screenshot 2019 10 26 at 11 08 28

Students started automatically moving around the objects in the spatial view, which was good to see, this seemed to be more on ability to view them rather then to order them to start, I also think the number of students contributing dropped. I think the main reasons that links and attachments where added this time versus the last was there was a view of the types now, in the spatial view but also I specifically asked for students to think of links and attachments and pointed out how to edit the Create type and that they could use Add to add(upload) files and images from there own devices.

Screenshot 2019 12 19 at 15 52 39

Screenshot 2019 12 19 at 15 53 06

Main take aways

  • Need quicker way to detect and add links
  • Attachments could do with drag and drop
  • If link pasted in is to image it should somehow upload as an attachment

Connections Test – 23rd Oct 2019

Article published on: Oct 23rd, 2019

Updated on: Apr 16th, 2020

Estimated Reading Time: < 1 minute

Clint adair BW0vK FA3eg unsplash
unsplash-logoPhoto by Clint Adair

Even with the simplest additions to testing with people is crucial, I know this is obvious but with a tool that has multiuser capabilities testing on your own is impossible, which means you cant fall to often into the trap of assuming things will be used in a specific way. After the previous testing I wanted to get the ability to make connections up and running as fast as possible in So I focused on adding this ability. I then added a number of buttons and keyboard shortcuts to also speed up the process of moving in-between interactions, create, finish, connect and zooming. I took the updated version to a team of 4 to see how create nodes and create connections I could see that they did some unexpected things. Firstly I had mapped the controls to CTRL but these conflicted with the browsers default, I had been using macOS, 3 of them had Windows. So I quickly changed that to Shift, which of course introduced an issue with Capital letters triggering the shortcut by mistake, also CMD is not considered a modifier key so I couldn’t have macOS style shortcuts. I am not sure on the best way to solve this yet.

Screenshot 2019 12 03 at 14 45 00

Once I had the shortcuts working what I was not expecting was when a person went into connection mode they might then start dragging nodes around again, I was expecting them to be just interested in connecting nodes. This was easily fixed by turning off connection mode if someone started dragging icons.

Main take aways

  • Popping into the studio to quickly test a small function is very useful
  • Providing specific tasks can help direct testing
  • Need to do more ad-hoc testing

3 Themes Present – 18th Oct Testing

Article published on: Oct 20th, 2019

Updated on: Apr 16th, 2020

Estimated Reading Time: < 1 minute

Nathan dumlao ewGMqs2tmJI unsplash

unsplash-logoPhoto by Nathan Dumlao

The next test of was with the returning Year 3 Games Design & Art students we had a slighly updated version of however I disabled the spatial view as this had connection and arrangement issues and so I just displayed the shared text list view. In this first test of the new academic year I replaced my previous use of an etherpad with which is also why I was happy with testing just the list text view.

Students where presenting three themes they had been researching in a 8minute presentation while all the other students where encouraged to connect to and respond live with text commentary to the presentation. Students had to select one theme to take forward and deep dive into. So other students were also encouraged to vote.

Students appreciated this approach as they tried to help each other with ideas to follow up the theme and which theme to select. We could have just as easily used etherpad or word online, but these don’t offer the simple anonymous approach and wouldn’t test to see what works and what was still causing usability issues. In this version after each presentation I had to copy and paste the responses into a text document as the system only had the capability to connect to a hardcoded instance.

Main take aways

  • unlike etherpad students couldn’t all write together as list view showed each student as a block
  • students didn’t like to create more that one thing they just typed
  • no styling or use of line breaks which was not good
  • there was not easy was to vote against current text again due list view being blocks
  • spatial view and connections may resolve the above

Keeping a record

Article published on: Sep 3rd, 2019

Updated on: Apr 16th, 2020

Estimated Reading Time: 2 minutes

Travis yewell F B7kWlkxDQ unsplash
unsplash-logoPhoto by Travis Yewell

After reviewing some of my explanation videos I realised that I needed to keep a more accurate record of what where the updates to and when they actually occurred. This would help mr to use the clips as reference material to any testing that takes place, so I can see which version was used within testing but also it would enable me ton look back at the project and review and record why changes had been made. My previous Youtube Video’s had been a little haphazard in this regard and I needed a more logical system.

I was listening to Accidental tech podcast and they mentioned the semantic versioning system to better describe updates, so I applied this to my versioning system. I also found some of the built in features within Open Broadcast Studio to stamp on screen the date and time. I am still using the same process to stream the recording live to Twitch and afterwards download the video to be upload to my YouTube channel, there is a seven day window to download from Twitch, which I do need to be aware of. Brent Simmons developer of NetNewsWire whose contribution notes I have taken great inspiration from also mentioned adding a letter to the build to signify its state of play as well, so all versions currently end with the letter d for development. For now the alpha build however is also a mirror of the dev build.

These small changes I hope will help provide a usable level of the documentation of the thoughts and ideas from each version and I expect the explainer videos to get shorter as I just cover updates and why those choices have been made.


  • development is at
  • alpha is at
  • beta is at
  • release will be at

Main take aways

  • Need to automate build process to each URL asap
  • Need to work on safe guarding data in beta and alpha
  • Being organised is important !
  • Need to be consistent (as much as possible)