Friday, 8 July 2016

Unexpected ethical challenges in using screen grabs of youths' #participatoryculture productions #visualresearch

Written primarily for researchers interested in the ethics of sharing young people's visual culture productions :

Advances in online image and text search may pose unexpected ethical challenges to researchers in protecting the privacy of their participants while sharing visual productions. I mistakenly assumed that depersonalising screen grab imagery would be sufficient to conceal teenagers' identities. However, in testing "depersonalised" screenshots of my participants' online portfolio screen grabs, I learnt that the ever-growing accuracy of text-and/or-image searches (i.e. via Google Image, TinEyeBing, Pinterest et al.) requires additional steps for dis-identification. Without these, sharing webpage screen grabs can potentially be used by undesirable audiences to locate young people's websites and contact details. Screen grabs may also pose reputation risks in potentially being shared long after participants might want them to be. Both types of risks will be weighed up against the benefits of sharing select students' e-portfolio productions in my thesis. These include visual representations making it easier for readers to become familiar with the online portfolio genre. Screen shots also provide visual support for research themes emerging from young people's choices.

Background to my visual research ethics challenge.

I had developed an original method for multimodal content analysis that used screen grabs to reverse-engineer the choices that 29 visual arts students made in using Carbonmade. To keep the rich nature of my visual data, I analysed these privately using NVivo. I then sought to de-identify select web page screenshots for sharing in conference presentations. I followed a process for visual anonymization, which was not extensive as I wanted to preserve most of the screen grab for accuracy. The anonymizing process involved Adobe Photoshop's blur function being used on several fields of every webpage. This ranged from the web address and portfolio name on every page to all mentions of their name on their profile pages and their contact details. It also involved checking that the e-portfolio's creator was not identifiable from their portrait picture and that no images disclosed their school's identity (i.e. school poster designs or uniforms). To further protect anonymity, image files were titled using pseudonyms.

"George", 'depersonalised' About page, 2012. A participant who gave permission for portfolio screen grabs to be shared. 
I also added select screen grab, two per A4 page, into my draft thesis's case study chapters. During their review, Associate Professor Marion Walton advised me to remove screen grabs that might expose its creators to ridicule and also to check the reverse search-ability of all images. She was concerned that these might not be truly anonymised. In checking, I learnt that the depersonalisation measures I took were insufficient. A 'visual specific dilemma' existed whereby my participants could still be traced through the following types of internet searches:

  1. An internet text search using text used in students’ self-descriptions under their About Us page; 
  2. An internet text search using the folder titles shown by the screenshots (i.e., in Google, using <e-portfolio software name> + <folder title>)
  3. An internet search using the image titles shown in the screenshots (i.e. in Google, using <e-portfolio software name> + <image title>)
  4. An internet image search using the screen grabs (for example in 'Google Images');
  5. An internet image search of the images inside the screenshots; 
  6. In addition, location information and other information in the case studies and school backgrounds could be used in narrowing image and text searches.

Testing the first four types revealed I had not successfully de-identified several screen grabs.

Ethical concerns and considerations.

This was concerning as it held ramifications for my future and past publications. It also had consequences for the ongoing e-portfolio pedagogy at the independent school research site:

I warned the e-portfolio educator, "Mr Proudfoot", that he should take additional steps to better protect student privacy via revising their e-portfolio pedagogy: my action research project found that teaching students to hide their contact details did provide a false sense of security, since teachers mistakenly believed that this made their students difficult to contact. Simply using students’ real names in online searches quickly served up their social network profiles. Some of these were public by default. Teachers must better support students with resources and examples of effective privacy protection that can at least minimise the dangers of ill-considered self-disclosure. This could include case studies of bad examples and in-depth advice on constructing pseudonymous personas. Schools should also provide support, such as policies and staff that young people can readily refer to in case of unsolicited online contact.

When my fieldwork began in 2010, I did not ask for student permission to use screen shots of their work. This was simply not a focus at the time. However, during my fieldwork I pioneered a screen grab analysis method that became heavily used in my 'Evidence' chapter. I also thought that screen grabs would prove helpful in adding a rich visual context to readers of my content analysis and eleven students' case studies.

I recently asked an ethics expert about protecting students' privacy and his advice contrasted to the cautious visual research feedback that I expected. He advised that since the screen shots are of web pages they are in the public domain already, I actually do not need these students' permission. Despite it not being a legal or institutional requirement, I remain mindful of the assurances that I gave to schools and students on protecting the research participants' privacy. Such assurances helped me overcome one challenge in securing ethics approval from the Western Cape Education Department/Department of Education and my two research sites. I am also aware that only a few of my case study subjects responded to Facebook or emailed requests for retro-active permission to publish anonymised screenshots in my thesis. 

My concerns around potential disclosure and lacking participants' explicit consent resonates with Prosser, Clark and Wiles' (2008) contention that concrete contextual issues and a researcher's individual moral framework must be added to legal and institutional requirements in making ethical visual research decisions. The risks to participants associated with disclosure may be small, but it does not sit well with my moral compass that the screen grabs in my thesis might provide visual evidence for subverting past assurances. Particularly now that the thesis itself is easy to source and search. In the past, the provision of UCT thesis hardcopies were mostly limited to its library. However, these are now automatically digitised for sharing post-graduation online via the library's website (and possibly Open UCT). Further, since I have already shared many screen grabs online in conference presentations, I must also explore reciprocal measures to protect my participants' privacy. For example, by replacing the screen grabs I shared in old presentations with properly anonymised ones.

To find out how other researchers have tackled the problem of depersonalising screen grabs, I did Google Scholar searches for guidance on anonymising 'screen grabs', 'screenshots' or 'screen captures'. I could not find relevant content, which seems to mirror the reality of screen capture techniques being mostly used for exemplars rather than in the research process itself.  Lacking a matching example to follow in visual culture research, I found Dr Kirsty Young's discussion of her research experiences with young people's online spaces (2013) particularly informative. It highlights several ethical dilemmas posed by new forms of research enabled by the internet.

My research project is unusual in being human subject research focused on public texts. It is the former as I have been involved in developing a new syllabus and doing face-to-face research with youths throughout e-portfolio lessons. However, I am also researching public texts since all my participants Carbonmade portfolios have no privacy restrictions. Given its unusual position in straddling both methods, I cannot expect unanimous agreement in the academic community regarding how the ethical principles of consent and anonymity pertain to my study. The public text argument versus one for the more onerous rules governing human subject research could easily be argued in both cases. This may pose unexpected problems for the publication of my visual research data. If research data cannot be shared it becomes redundant, which itself is unethical in wasting participants' time (Young, 2013).

In response, I must be cautious and take steps to ensure that my project's ethics in sharing screengrabs cannot be faulted from a human subject research perspective. While all participants and their parents/guardians consented to my research, some were only asked after my fieldwork concluded for permission to re-publish their work. I had not considered the future need to use young people's webpages publicly in academic publications. Given that the webpages are the intellectual property of their authors and that their content would be displayed more widely than the youth possibly intended, I intend to secure written consent for their academic use. This consent will address the timespan that informed consent is given for and afford options for the level of anonymity required. I will show my case study subjects examples of their dis-identified webpages to assist their decision-making.

Additional steps for depersonalising or anonymising screen grab images

Given the ready availability of image search sites and image reverse search applications, it is important for researchers to take steps to fully depersonalise images for participants' anonymity. As web page design is multimodal, it is also important that researchers filter both images and text. For example in my research into students' e-portfolios, I had to avoid mentioning folder titles verbatim in my thesis. I also must try to avoid quoting students’ profile descriptions verbatim for longer than three words.

The two alternate options (A - B) I tested for depersonalising screen capture images were:

A. Black out all text and replace profile image with silhouette outline

Option A. "George" depersonalised About page with with all text blacked out and profile image in silhouette outline, 2012

All text is blacked out, making it impossible for viewers to copy text strings in their searches. The blurred outline image is replaced with an outline drawing to add some visual information. 

B. Only add depersonalised screen grabs at small thumbnail sizes, organised inside tables

Option B. "George" de-personalised e-portfolio pages from 2012 reduced into thumbnail images in a table 

Here the size of each image is reduced to a thumbnail size for making their recognition via reverse image search more difficult. I tested each option in reverse image search engines and neither options A nor B produced results linked to its creator, let alone Carbonmade.

Google image search result for option A's image, 2016

Google image search result for option B's image, 2016

Both options enabled sufficient levels of anonymity in their results being linked to generic software entries. I then tested what would happen if a thumbnail image of student's work was selected from the table of thumbnail images. At such a small size, the highly-pixelated image results did not link back to their creator or Carbonmade during a reverse image search.

Google Images result for "George" depersonalised thumbnail painting crop 2016
While the process of dis-identifying over 80 images will be lengthy, I am pleased that I can use heavily anonymised imagery, rather than none. In addition to changing these thesis' images, I must also reciprocally update them in old presentations, which need then to be reloaded to Slideshare.

Request for comments... or turning this post into an academic paper.

This post was written to stimulate discussions on ethical issues related to the use of screen grabs.
It heeds the call to engage the general internet publishing publishing population in debates about the use of content for research purposes as this can ensure the ethical use of online content, (Young, 2013). Kindly add your thoughts by commenting below.

There is also a gap in the literature concerning ethical issues related to sharing screen grabs of young people's participatory culture as research evidence. If you would like this post to be upgraded into an article for helping close the gap, please get in touch. For updates on my research, follow this site or @travisnoakes.

Tuesday, 5 July 2016

How to extensively customize your Blogger template with custom-designed, menu buttons etc. @Blogger #gHelp

+ Written for Blogger users who want a high-level introduction to extensively customizing their template. This includes adding custom-designed navigation menu buttons. I couldn’t find an FAQ topic addressing this topic anywhere on the web, so here’s a post to help close this gap :
This high-level ‘how-to’ is written as an interview between Jonathan Whelan (this blog’s designer and template coder) and I (his Blogger-using client). We cover the why’s and how’s of my old blogs’ custom template’s look-and-feel being completely reworked to look and function impressively. This includes the process he followed for adding custom-designed buttons to the navigation menu of a basic Blogger template.
Image 1. in Macbook, May, 2016.
Image 1. in Macbook, May, 2016. Adobe Photoshop by Jon Whelan.

Travis: This custom Blogger template that I last edited in 2009 had become way past its use-by date. It looks jurassic compared to contemporary layouts. It also did not work well on mobile phones, while its custom code seemed to obstruct Google’s add-in gadgets for social network sharing. Being close to finishing my thesis’ full draft, I wanted its design to reflect my aspirations for it as a ‘post-PhD’ blogsite. The new, next-level up, look-and-feel also needed to reflect broader personas than a ‘researcher’s blog’ could. It took a while to decide on a graphic metaphor that resonated with my different roles, but I eventually came up with the idea of a ‘plus’ sign. This suggests how each individual combines and expresses varied personas - a key focus of my PhD {The nerdy humorist in me also hopes that geeks will appreciate its tangential nod to ‘Google Plus’ ;) }. In my life, the roles of Researcher, Educator, Design Thinker, User, Speaker and Volunteer have become the most salient. So, I sketched some icon ideas for these pluses. These were incorporated into a creative brief (see look-and-feel update brief 2016), for Jon to quote on.

Jon: Being a graphic design professional, it was easy for me to rework the plus icon ideas into versions that would look good even at a small mobile phone screen scale.

Image 2. New button icon designs for, June, 2016. Adobe Illustrator by Jon Whelan.
Travis: Yes, it’s very easy to ignore these users when enjoying these designs on a wide, monitor screen in the office.

Jon: Right. For me another conversion issue was becoming familiar with how Blogger organises pages and add-ins, versus how Wordpress CMS supports in-depth design customisation. The way a Blogger theme is built is slightly different and it took some learning from my side appreciate how it applies html and css: Blogger themes are structured in sections and built out of widgets/gadgets. With this in mind, I proposed building the theme from the ground up to be more efficient than hacking a free or a paid-for one.

Travis: That proved the right way to go. Compared to WordPress, Blogger seems not to offer the same level of template customisation and control. This probably contributes to why Blogger seems not be as widely used as WordPress by Capetonian designers or academics. Nevertheless, I was not keen to shift to a Wordpress blog. I am pleased at my blogsite's search engine recognition, especially for its niche subject-matter. I also like Blogger’s ease-of-use and not having to worry about back-end maintenance, such as updating it. I was hoping to benefit from the multi-device compatible (mobile and tablet) publishing and fast page download speeds it provides. Then there’s the Google translate widget, which allows viewers to select their preferred language translation of a post. I’m especially happy that this makes it easy for its e-portfolio lessons to be viewed in Afrikaans, Sesotho, Xhosa and Zulu. I enjoy the live internet traffic stats that Blogger shows too. And its easy integration with Google Adsense has taught me how difficult it is for niche bloggers to cover one’s hosting fees. The unfortunate side effect of my Blogger fanboy-ness was Jon having to attend a crash-course at “Blogger University” ;) ...

Jon: True. I think that most locals also use WordPress, because it is extensible, easy to customise and manage. By contrast, Blogger has limitations with regard to adding custom features. My jump into Blogger’s “deep-end” proved daunting, given the tight deadline I was working towards and needing to follow a ‘site design and build method’ comprising wireframe-, mockup-, code- and testing phases. The wireframe was easy to mock up into two draft .html mockups for button varieties one and two. However, there were several stumbling blocks that needed to be overcome before the chosen design could be implemented in Blogger.

Travis: Correcting my ‘plus’ symbol ideas that might be perceived as medical or religious was a breeze in comparison?

Jon: Sometimes over-using the plus symbol seemed to take away from the simplicity that we wanted. Also, I spent quite a while reworking the icons to make sure their quality will not deteriorate as they scale down. The simplified design of the buttons was done to suit Google’s Material standards. Although quite literal, the new buttons’ advantages were that they quickly communicated what they were about. Once you had chosen a combination of icons from both sites, I broke up the html from the test sites. These were added to Blogger widgets in my test blogsite’s basic template. Only once I was confident that the template actually worked, was I then prepared to apply it to Travis’ live blogsite.

Travis: You made several backups and I was very happy that you didn’t need to use them. Another plan B was contracting freelance Blogger experts via, such as Prayag Verma or Nicholas P. Both had many positive reviews in what seems to be a niche area of expertise.

Jon: It took a while to figure out ways in which the site could work like Travis originally wanted it to. For example, there was no online ‘how to’ on linking designed buttons from a navigation menu. I worked out that I could use a widget for writing html and css to address this potential showstopper. Travis gave me access to the CPanel service for his webhost’s domain. I needed to store the icon images in the domain, and link the images to his blog. This allowed me to add links from the button images to old and new pages, or addresses pointing to a label query (i.e.

Travis: There was a minor technical delay before Jon could put this into practice. After trying to login unsuccessfully to the CPanel address, I logged a support ticket. The upshot was that we needed to wait for my webhost to activate the CPanel’s functionality and for my new access details to work. Hopefully our readers are now forewarned to check with their webhost and set up domain access early on. Do not confuse such access with their basic hosting account, like I did.

Jon: In working on the navigation menu widget, I also discovered that by removing the skin, I know it sounds painful, I could style the design better. I then did another iteration of the site to show what a possible working prototype would look like. I preferred to do this, so that the icons could be viewed from the user's perspective. This also helps me in my design process as I can see how it works online as opposed to a nice A4 printed presentation.

Travis: Yes, it was reassuring for me as the client to see a working prototype before the migration.

Jon: Then when it was time to do the transfer. I backed up the old site before I did anything. I organised his redirect page as I started applying the new look-and-feel, so that visitors to the site would not have access to the "renovations" and get a teaser of the imminent update.

Travis: While you were doing this, I could also log into Blogger and see the site running the new template. Jon used all the gadgets from its previous version and I could see this still running, which was neat.

Jon: Yes, I also refined the desktop navigation icons, which were center aligned to take up less space. I added a page to link to each button and checked the 'plus' favicon' was visible. The pageviews were still 95,867, as they were. All the other elements were there. I hardcoded a social media links tab to appear in each post… The reason I hardcoded the social media icons was to ensure the look and feel was consistent with the rest of the theme, the icons and also because there weren't any gadgets available to meet our needs. For the Adsense gadget, I just changed the sidebar one to be 'responsive' to make it look better on mobile.

Travis: On that, my blog’s appearance on mobile is light-years from where it was.

Jon: The desktop too, as we can see in my images.

Image 3., viewed via iPhone, June, 2016. Adobe Photoshop by Jon Whelan.
Image 4. viewed via desktop browser, June, 2016. Adobe Photoshop by Jon Whelan.
Travis: I hope our chat has given Bloggers insight into an approach they might follow to extensively customise their blogs’ ‘look and feel’.

Jon: Yes, and if you need in-depth help, please contact me via

Travis: And if you have any suggestions or concerns, please add a comment below, ta.

Total pageviews since 2008's launch.


> Translate posts into your preferred language


> Search my blogsite with keyword(s)


+ or search it with these labels


> Connect with me on social networks

diigo education pioneer Social bookmarker @ .

About Me

My Photo

Visit my blog or @travisnoakes to learn more about what I do.


+ or simply follow this blog by email