Code Visualising Tool

Computer Programming is generally taught using the “formal” method (Turkle and Papert 1990), often the preferred programming style for men. Thus, women, who tend to prefer a more concrete and creative approach to programming, are discouraged from continuing with computer programming and focus on subjects in which they can use intellectual styles that they are most comfortable with. This increases the gender gap in the computer programming field.

The code visualising tool that I am currently developing, using JavaScript and SVG, analyses code entered by the student and shows graphically in real-time the flow of the code, which not only helps a student design and understand algorithms but also greatly helps visual learners in understanding how computer code works.

The application can also be used across all disciplines as it allows the lecturer to capture any process as a set of simple instructions or flow of events and immediately generate a process diagram in real-time. This can be used to capture any process whether it be scientific, political, or indeed anything that has a flow and decisions to achieve a goal. The tool, was tested by the UoW programming teaching team and colleagues from the jQuery project. Students will be offered to test the tool online to provide feedback that will drive refinements and improvements.

This tool will be embedded into the teaching and learning of level 4 computing students and also made widely available as an open source project.

It is anticipated that students will gain a better understanding of programming and more concrete learners will engage with computer programming modules.


Release of Level 4 Performance Tracker Beta version

Every year, some Level 4 students fail to understand what they need to achieve in order to pass a module and/or progress to level 5. It seemed that the best way to help them understand this would be to provide them with an application with which they can experiment and explore various scenarios. Philip Trwoga and myself developed an iPad app as part of a WEX funded project a few years ago for students to record and predict their performance. I was keen to build on this by creating a Mobile Web version that would be accessible on both Mobile and Desktop browsers, which would also incorporate the University and Course regulations. I have just released the 1st version of this application, following some thorough testing from Registry and in particular Sarah O’Donoghue who has provided me with a lot of testing time and support regarding the university and course regulations.

The application has been designed and developed to be intuitive and simple to use. The student can choose a module from the left hand-side menu, and enter their mark using the sliders:

performance tool image 1

The application will tell them the module outcome, as well and the progress for this module (a tick in each checkbox is required to pass the module). After entering marks for all their modules, the student can review their Level 4 summary:

performance tool image 2

The final step is to view the year outcome by pressing the corresponding button:

performance tool image 3

Currently, this only works for students on the Computer Science, Software Engineering and Mobile and Web courses.

Future developments will include:

  • Provide the ability for students to enter referral marks,
  • Provide the ability for students to construct their course, and therefore make it usable by all students in the
  • Include level 5 and level 6 modules
  • Predict the final degree classification
  • Provide the ability to save the data

1st year computing students get £31,000 worth of training

Marc Grabanski, CEO of Frontend Masters, gave a donation of a 6-month membership to 199 students registered on the ECSC407 Web Technology module. Frontend Masters Training is a comprehensive set of workshop videos to be watched at a self-guided pace online.

The students have access to about 50h of video between now and the beginning of November. This includes the latest front-end web technologies, such as HTML5, CSS3, Responsive Web Design, JavaScript, jQuery, AngularJS, etc. These are a series of professional training videos delivered by renowned industry experts and book authors aimed at professional Web developers that would normally cost $39 per month per student.

This is a great opportunity for our students to keep up their learning with these engaging and extremely well delivered teaching videos during their long summer break. It will give them a great head-start and introduction to some of our taught material on front-end Web development and will hopefully pique their interest and encourage them to engage in self-learning.

The training material exposes the students to the latest technologies used in the industry, engages their interest in the field and encourages them to become part of the Web developer community. Furthermore, this is a great enhancement to our taught programmes and the type of collaboration we want to encourage with our industry partners.

Anne-Gaelle Colom says: “I was approached by the company who were keen for students to have access to this material, and I was happy to facilitate this. This is a real bonus for the students on this module, which consists of all the 1st year students on the computing courses, and I hope that they enjoy using this material and find it instructive and helpful for further improving their Web Development knowledge and skills.”

More details of Frontend Masters training can be found at

1st year computing students get £31,000 worth of training

The students in their revision lecture, receiving news of their free 6-month membership.

jQuery Dev Summit – Oct 2012

As a member of the jQuery team, I was invited to join the first ever jQuery Developer Summit held by the jQuery Foundation in Washington DC, mid October. The summit was taking place on the 15th and 16th at the AOL Campus, followed by a team meeting on the 17th and a board meeting on the 18th.

After a brief morning overview of the major jQuery tools and processes, over 120 team and community members set to work on nearly every aspect of the jQuery projects.

We were divided into 18 teams and focused on everything from triaging and fixing bugs and documentation for jQuery Core, UI, and Mobile, to working on design, implementation and deployment of our entire network of sites, to improving our automated testing and gathering and analysis of metrics on how people use our libraries and websites. I was leading the jQuery UI and jQuery Mobile documentation. Participants came with a range of skills and abilities and we ensured that everyone was able to contribute, and many carried out their first git commands and Github pull requests. My table created 3,000 lines of documentation in those two days, but more importantly 8 people learnt and became familiar with the framework, and were able to contribute to a very successful open source project.

Of course, the hard work was rewarded with fun activities: Bowling on Monday evening for all participants and baseball, softball, golf range, and crazy golf on Wednesday night for team members.

It was amazing to spend four days with the whole jQuery team, and finally meet face to face people I meet on IRC and Google hangouts nearly every evening. Helping Rick Waldron setup his demo of the Johnny-five framework that he developed to control arduino-based robots in JavaScript was fantastic, as was having a surprise visit from Chris Williams and his wii-drone (quadcopter controlled by a wii remote using node.js and Johnny-five). This was extremely inspirational and I hope to convince students to carry out work of this nature for their final year project.

As an official jQuery Content team member, I am now also contributing to the jQuery Learn site, and will be writing teaching content for it which I will be able to use also at the University. Additionally, I am looking at creating an advanced front end development module where I will be able to teach more JavaScript as well as some jQuery core and jQuery UI, which is a technology used by 52.7% of all web sites.

Here’s a picture of the jQuery team, taken at the team meeting on the 17th October at the AOL Campus, Dulles, VA.