So you want to add a bit of coding magic to your experiment, but don’t know how to begin? We are here to help you get started!

We all know that Gorilla doesn’t require you to know how to code, but some­times you want to add a little some­thing extra to your experiment. After all, novel research requires novel functionality!

Here at Gorilla we like to describe our plat­form as exten­si­ble. Over 90% of studies run using Gorilla are done with our stan­dard tools, without any coding, but for the remain­ing 10% that need a little extra some­thing, that’s pos­si­ble too. Depend­ing on the com­plex­i­ty, you might simply need to add new lines of JavaScript to the Task Builder, or build a par­tic­i­pant flow from scratch in our Code Editor.  But isn’t it a relief to know that what­ev­er you need, Gorilla will accom­mo­date your needs?

So how do you get started? We’ve put togeth­er a basic intro­duc­tion to some of the lan­guages you may come across, along with links to some handy resources.

In this article we’ll cover:

• How HTML and CSS are useful for chang­ing the visual appear­ance of tasks.
• How JavaScript and jQuery can be used to store and manip­u­late vari­ables cal­cu­lat­ed on the fly.
• Then how these skills are brought togeth­er to extend our ques­tion­naire builder and task builder or to code from scratch in the Gorilla Code Editor.
• Finally, we know a lot of you love R + RStudio, so we’ll talk you through the amazing resources in Gorilla Academy where Dr Joshua Bal­sters goes through classic exper­i­ments in Gorilla, includ­ing their analy­sis.  It’s a great resource for learning.

HTML & CSS

What it is:

Hyper­text Markup Lan­guage (HTML) forms the back­bone of web site. It’s the lan­guage that allows you to struc­ture and nav­i­gate pages dis­played in a web browser. HTML is com­ple­ment­ed by tech­nolo­gies such as Cas­cad­ing Style Sheets (CSS) and script­ing lan­guages such as JavaScript.

CSS — the Cas­cad­ing Style Sheets — is the lan­guage which describes how HTML ele­ments on a page are pre­sent­ed. It is involved with how things look on a page. For an overview of CSS — its usage and advan­tages, see this Code Republics page.

 

How you can learn

HTML is widely used and is there­fore a great start­ing point for people learn­ing how to code! For a very begin­ner overview of HTML you can see this free course from Code Republics.

Alter­na­tive­ly, we are big fans of FreeCode­Camp — a free resource for learn­ing pro­gram­ming lan­guages and gaining pro­gram­ming cer­tifi­cates along the way! We believe it’s one of the best resources out there, and it allows you to learn the basics of HTML with fun, inter­ac­tive exam­ples, and progress to learn­ing HTML’s styling com­po­nent — CSS.

A useful ref­er­ence for cus­tomis­ing colours of your text written in HTML is the HTML Color Codes website. We love this site as it helps you find the perfect colour, as well as great com­ple­men­tary colours too.

 

How you can use it in Gorilla:

You can use HTML in Gorilla for styling the content of your ques­tion­naires and tasks. When you apply HTML to your Gorilla Tasks and Ques­tion­naires, you can look up the HTML for­mat­ting guide on our Support pages. We have also created worked exam­ples on how to use HTML to style your text in Ques­tion­naire widgets and Task Builder zones.

 

JS & jQuery

What JavaScript is:

JavaScript (JS) is a pro­gram­ming lan­guage for the Web. JS can dynam­i­cal­ly update and change both HTML and CSS. It is a pow­er­ful, easy to learn script­ing lan­guage, widely used for con­trol­ling web page behavior.

The most common appli­ca­tion of JS on the web is to run on the user’s com­put­er within the browser. You might also come across arti­cles online dis­cussing its use on web servers, however here we will only talk about the type of JS exe­cut­ed on the web browser.

 

How you can learn more:

As always, we would rec­om­mend FreeCode­Camp as your go-to course for learn­ing JS from the very begin­ning up to advanced func­tions.
Another invalu­able resource and a ref­er­ence that’s worth keeping close to you when­ev­er you are working on web devel­op­ment is the Mozilla Web Devel­op­er page. They have excel­lent courses, doc­u­men­ta­tion and forums that will guide you through build­ing your pro­gram­ming skills and support you with any ques­tions you might have along the way. For an overview of JS and learn­ing resources check out this page.

 

What jQuery is:

Lastly, we would rec­om­mend that you famil­iarise your­self with a bit of jQuery that will make using JavaScript much easier for you. jQuery is a JavaScript Library that focuses on sim­pli­fy­ing DOM (Doc­u­ment Object Model) manip­u­la­tion, AJAX calls, and Event han­dling (Source). The brief jQuery course on the FreeCode­Camp is very straight­for­ward and should give you a good overview of the jQuery func­tion­al­i­ty. For more infor­ma­tion on jQuery, see its offi­cial website: https://jquery.com/.

 

Script­ing within Gorilla

Gorilla tools are created with the inten­tion to reduce the need for researchers to learn script­ing and program their tasks and ques­tion­naires — this can be a long and com­pli­cat­ed process if done from scratch, even for advanced coders! Our team of devel­op­ers are reg­u­lar­ly cre­at­ing new fea­tures that Gorilla users can request through our public Roadmap.

Nev­er­the­less, for those who would like to code and wish to imple­ment some more advanced func­tion­al­i­ty to their exper­i­ments, we have several options:

• Script­ing Widget in the Ques­tion­naire Builder for aug­ment­ing questionnaires
• Script­ing Tab in the Task Builder for aug­ment­ing tasks
• Gorilla Code Editor Tool for build­ing your own client side task while still using the Gorilla server, data­base and par­tic­i­pant man­age­ment tools

These tools allow you to adjust your experiment’s func­tion­al­i­ty to fulfil your research require­ments! Our dev and support teams have put togeth­er some excel­lent walk­throughs to help you get started, whether it’s for a ques­tion­naire or in the task builder. They are also working on reg­u­lar­ly adding new script­ing samples to our exten­sive Script­ing Library where you can find mul­ti­ple exam­ples on how you can alter your tasks using bits of code: from chang­ing the colour of your screen and text, to adding back­ground music for your trials, or ran­dom­ly select­ing a number of stimuli from a greater stimuli set!

 

All script­ing samples in Gorilla are described in details so it’s easy to under­stand their func­tion­al­i­ty and adapt them to your own tasks!

 

We also have excel­lent resources for using the Gorilla Code Editor. See these example projects and Code Editor Tuto­ri­als.

 

For track­ing down the changes and trou­bleshoot­ing while using the Task Builder Script­ing Tools or Code Editor, see our basic Debug­ging guide.

 

 

The resources in this blog will give you a great foun­da­tion to start imple­ment­ing scripts into your experiment, but if you do need more cus­tomised help then we do offer a paid Script­ing Con­sul­tan­cy service. This gives you direct access to our devel­op­ment team to create your script or task to your require­ments. Another great option is to connect with other Gorilla users on our Face­book Com­mu­ni­ty — they’re a great group of people who are always happy to share hints and tips!

 

Bonus! R + RStudio

You may have heard about R, a pro­gram­ming lan­guage which many researchers are now using for data analy­sis. RStudio is an inte­grat­ed envi­ron­ment that will help you write and edit R script.

R is dif­fer­ent to the other lan­guages men­tioned in this blog, as it won’t be used for cre­at­ing your Gorilla experiment. However once you have data from your experiment you may wish to use R to analyse your data. It’s a very com­mon­ly used lan­guage in both acad­e­mia and indus­try, so it’s a great skill to learn!

We’ve got some won­der­ful resources on our support pages to help you get started with R, as well as some amazing walk­throughs with Dr Joshua Bal­sters on Gorilla Academy.  If you’ve won­dered how to process large amount of data into the shape you need for easy analy­sis (i.e. long form to short form) then these resources are for you!

 

Meet Ferenc

The tal­ent­ed and gen­er­ous Ferenc Igali — Lead Tech­ni­cian at Sheffield School of Edu­ca­tion — has been busy this year cre­at­ing a whole host of tremen­dous­ly useful exam­ples of how to extend the Task Builder for student at the Uni­ver­si­ty of Sheffield as well as user requests in the Gorilla Face­book Group.  You can find and use his bril­liant exam­ples from Gorilla Open Mate­ri­als, under Sheffield EduTech Col­lec­tions Page.

Ferenc is also the chair of ATSIP (The Asso­ci­a­tion of Tech­ni­cal Staff in Psy­chol­o­gy). If you are a tech­ni­cian at your uni­ver­si­ty — then check it out! It’s an aston­ish­ing­ly gen­er­ous organ­i­sa­tion with a tremen­dous annual con­fer­ence. #Tech­ni­cians­Mat­ter