PsychoPy Online Demos

If you have routines or experiments that are likely to be useful to others, please create a post in this thread, editing your post to add new demos so there is one post per creator. Ideally set your demos so they can be tested without consuming a credit (if you don’t have a site license) by adding a final routine that can’t end, disabling save incomplete results and adding a small number of credits.

Please do not discuss the demos in this thread or create more than one post unless you have a large number of demos to share, in which case please use separate posts for separate categories.

If you use PsychoPy code in your work please cite it as follows (APA 7th):
Author(s). (Date of last substantial commit). Title [Computer software]. Pavlovia. URL.
where the URL is either to the experiment page on pavlovia.org or an OSF/Zenodo DOI.

Affect Grid code | try it

Based on Russell, Weiss, and Mendelsohn (1989) but with an even number of scale points. Russell, J. A., Weiss, A., & Mendelsohn, G. A. (1989). Affect grid: A single-item scale of pleasure and arousal. Journal of Personality and Social Psychology, 57, 493–502. The grid is created in code using an array of ShapeStim polygons.

Blind Spot code | try it | discussion thread

This experiment updates my previous ScreenScale code to 2023.1.3 and adds a method of calculating visual angle (and viewing distance) using the blind spot method. The program uses the assumption that the centre of the blind spot is about 15 degrees from the fixation point.
Morys-Carter, W. L. (2023, July 6).Blind Spot [Computer software]. Pavlovia. OSF | Blind Spot

Brookes Template 2020 code | try it | discussion thread

Demonstrations of code_JS, embedding html forms and external videos, and using code components for free text responses.

Change Blindness RSVP code | try it | discussion thread

An experiment created in December 2020 for Sasha Andrade (supervised by Michael Pilling). In this case the polygons for each RSVP stream are set up in one routine and then displayed in a second using AutoDraw manipulations to show and hide each frame.

Check Sounds code | try it | discussion thread

Preloads four different types of sound (frequency. note, WAV and MP3 using components and then plays them using code. Written in 2022.1.3. Use this to check repetition of sounds.

Counterbalancing code | try it | discussion thread

This demo uses an outer loop to randomise across a set of stimuli, but runs one task for the first half of the items and a different task for the second half.

Complex Randomisation code | try it | discussion thread

This demo is for anyone who wants to randomise the order of their trials with constraints, and can do so based on the row numbers. In this case the demo produces CVC letter strings by shuffling rows 0 to 4 for the vowels and 5-25 for the consonant, and then adding appropriate items to useRows. The loop itself is sequential. The advantage of this method over preloading stimuli is that it does not require extra loops or lists – the trials loop itself is attached to the conditions spreadsheet as normal.

Demographics code | try it | discussion thread

An embedded html demographics form (online only) using iFrame code shared by @arnon_weinberg. The responses are saved to the data file as expInfo variables, which means that they will appear on every line of the data if the form is placed before the experiment. Use my Form to HTML for Pavlovia web app to convert PsychoPy form csv files to html pages.

Digit Span code | try it

Random digits are presented at a rate of one per second. The first digit cannot be 0 Following digits can be 0 but cannot be the same as the previous digit. If the answer is correct the span is increased for the next trial If the answer is wrong the span is decreased for the next trial. If there are at least two errors at a given span and that represents more than half of the total attempts at that span then the experiment ends, returning a span of one less than the final span attempted.

Emotional Stroop for mobile code | try it | discussion thread

To avoid having to stick coloured dots on the keyboard or a button box, this version of the Emotional Stroop task is designed for mobile devices and presents coloured buttons on-screen. The colour of each word is randomised separately for the words themselves, which are presented in separate blocks for each valence.
Morys-Carter, W. L. & Walter, K. (2022, January 10). Emotional Stroop for mobile [Computer software]. Pavlovia. https://doi.org/10.17605/OSF.IO/EYG7S

Free Recall code | try it | discussion thread

Free text response for up to 20 words/phrases with arrow key and mouse interactions both between and within words. The correct answers for the demo are the numbers one to twenty.

Identity Fusion code | try it

Based on Jimenez et al. (2016).
Jimenez, J., Gmez, ., Buhrmester, M. D., Vazquez, A, Whitehouse, H., & Swann, W. B. (2016). The Dynamic Identity Fusion Index (DIFI): A new continuous measure of identity fusion for Web-based questionnaires. Social Science Computer Review, 34(2), 215-228. https://doi.org/10.1177/0894439314566178
Full text: https://michaelbuhrmester.files.wordpress.com/2015/06/difi_2015.pdf
Morys-Carter, W. L. (2023, August 14). Identity fusion [Computer software]. Pavlovia. vespr / identity-fusion · GitLab

Independent Randomisation code | try it

Pre-load one column from a spreadsheet so that the contents can be displayed in an independent random order alongside the contents of another column. This demo also uses shuffle to randomise the location of the target.

Interactive Slider code | try it | discussion thread

This shows a PsychoPy slider object which can be moved using the left and right arrow keys or hovering over the slider with the mouse. Responses are submitted with a mouse click or the return key. The position of the slider is also recorded every 3 frames and presented on the screen in addition to being saved to the console and the data file. The code for using the keyboard may be useful for anyone wanting to detect whether particular keys are currently pressed or not. A custom slider is also included which looks and behaves the same as the standard slider offline and still works online. The custom slider can cope with changes in the numbers of tick points and labels, wrapping the label text accordingly to avoid overlaps.

Key Check code | try it

A very small demo which you can use to find the PsychoPy name of any key on your keyboard. The only keys that have been preassigned functions are return, space, backspace, lshift and rshift. This is particularly aimed at researchers who need to adapt their code for use with non-English keyboard layouts.

Key Down code | try it | discussion thread

Compares the length of two keyboard components (one detecting key presses and the other key releases) to determine whether a key is currently pressed down.

Letter Search code | try it

A simple visual search paradigm that creates a jittered grid of possible locations so that the target and distractors don’t overlap with each other. Designed for mobile devices.

Moving Cue code | try it | discussion thread

Moves a pulsating circle around the screen like an eye tracker calibration cue. Paths are read from an Excel file but implemented using a TrialHandler in code (which requires a number of edits to work online).

Mouse Test code | try it | discussion thread

Respond to mouse clicks, but only advances if the mouse has been held down for a given duration.

Mouse Tracking code | try it | discussion thread

Originally written in 2017, this demo is a game where the object is to destroy targets using the mouse, where the mouse control has been rotated.

Multi-session Randomisation code | try it | discussion thread

In this demo the random seed of a loop is based on the participant number, but different rows are presented based on the value of session, so that each participant will see all conditions once if they complete all sessions. Each data file will contain information about all conditions, but the ones that weren’t presented can easily be filtered out using the SelectedTrial column.

Music Box code | try it | discussion thread

Plays music (Greensleeves) from a spreadsheet containing three columns: Note, Duration and Octave. The quality isn’t great and it sometimes warbles towards the end so suggestions for improvements are welcome.

Music Player code | try it | discussion thread

An interactive version of Music Box which uses the same Greensleeves spreadsheet. Press the letter of the displayed note and it will be played at the start of the next routine with the specified duration, sharp and octave. Press space if you see “_”.

Navon Figures code | try it | discussion thread

Letters of the alphabet arranged in code into the shapes of larger letters. In the demo each figure has the same local and global letter, but changing the local letter is trivial, as is changing the number of local letters in each global letter – currently set to 9 high. The grey rectangle is to check that the global letters are all the same size.

PM N-Back code | try it

I have been writing prospective memory experiments for students for over 20 years. Most have had a lexical decision ongoing task, but this one has a lexical n-back task instead. The repeated items are randomly inserted rather than using a pre-determined sequential order.

PM Time code | try it | discussion thread

This prospective memory experiment features both event-based and time-based tasks with a clock that appears when the space bar is pressed to allow the participant to check the time. This experiment features my interleaved lists method as detailed in my code snippets page.

Participation Cap | code | try it | discussion thread

This demo is a PsychoPy experiment with two embedded surveys. The first is a consent form, and the second is the Alcohol Use Disorders Identification Test—Consumption (AUDIT-C) . The AUDIT-C is scored within the survey and then participants are allocated to low and high risk groups based on a cut-off. The number of participants in each group are tracked using the shelf. For demo purposes the participation cap itself can be selected in the expInfo dialogue box.

The shelf dictionary was created as {“low risk”: 0, “high risk”: 0}

Points on a grid code | try it

Creates a list of points in a grid with an arbitrary number of rows and columns, with optional jitter. The points are numbered from the top left but can be shuffled before using to assign positions of text, image, polygon or shape stimuli created in a code component. The centre element can be skipped if desired.

Presentation Cap code | try it | discussion thread

Uses the shelf to cap the maximum number of times a given item will be shown across participants. Checking and updating the shelf takes a little time - especially if an item needs to be skipped, so this experiment displays a fixation cross for 1 frame plus that time.

Random Pairs code | try it | discussion thread

In this demo there is an outer loop that cycles through all stimuli. However, the trial itself is only presented on odd-numbered iterations of the outer loop (remember that the numbering starts from zero). The even numbered iterations save the stimulus to a variable ready to be used in the next trial.

Randomisation without repetition code | try it | discussion thread

This demo presents a new method of randomising a set of trial types without consecutive presentation of the same type. Instead of loading the trials into a list and then shuffling until a suitable order has been created, it skips consecutive presentations and then repeats the loop only selecting those trials. Since there is a danger that doing this on the fly can end up with an insoluble problem (for example, the final two trials are of the same trial type), this method will add an extra trial into the new list. The participant may therefore end up seeing one or two additional trials in the experiment, but they can easily be excluded from the analysis if desired, using column that records the presentation number.
Morys-Carter, W. L. (2022, January 4). Randomisation without repetition [Computer software]. Pavlovia. https://doi.org/10.17605/OSF.IO/N6MKV

Reaction Time code | try it

Three quick reaction time tests (simple keyboard, choice keyboard and simple mouse). Mean RTs are calculated for each type.

Repeat Subset code | try it

Adds errors made during the first loop to a list which used by the second loop, so that only incorrect trials are repeated.

RSVP code | try it

Timing is worst at the beginning of a routine, especially for the first iteration of a loop. This Rapid Serial Visual Presentation (RSVP) demo preloads 260 images using a code component and then presents them 10 at a time where each burst is within a single routine. The value of t at each image change is saved so the variability of the presentation times for different methods can be compared. Timing is better when running in full screen than in local pilot mode. Since the burst of images is within one routine, it contains a single keyboard response which remains after the end of the image stream. Press space to continue. Locally in pilot mode it also demos the PsychoPy Monkeys plugin – an automatic key press after 1.5 seconds.

ScreenScale code | try it | discussion thread

Use to ask a participant to work out their screen scale relative to a credit card.
Morys-Carter, W. L. (2021, May 18). ScreenScale [Computer software]. Pavlovia. https://doi.org/10.17605/OSF.IO/8FHQK

Self-Paced Reading code | try it | discussion thread

Based on code from my code snippets Google page and using sentences from @Zeinab_Alipour, this demo includes reading times for each word and an editable text box comprehension question. Variants include incremental phrase, central word, moving window and moving word.
Morys-Carter, W. L. & Alipour, Z. (2022, February 18). Self Paced Reading [Computer software]. Pavlovia. https://doi.org/10.17605/OSF.IO/S2FD6.

Scroll Text code | try it | discussion thread

Scroll a text box up and down using arrow keys, mouse on a scroll bar or dragging and dropping the text itself. The code automatically estimates the total length of the text so the scroll bar is updated when the text is moved by other means. Press spacebar to continue appears once the text has been scrolled to the bottom. I use a new jitter method to update otherwise static components to keep them in front of the scrolling text.

Survey Engine code | try it

This survey engine is designed to work both locally and online. Questions are specified using a spreadsheet with a numeric or mouse/touchscreen response. There is one response per page and a back button. The examples included are the Becks Depression Inventory (vertical orientation) and a brief version of the Big Five Personality Inventory (horizontal orientation).
Morys-Carter, W. L. (2024, April 8). Survey engine [Computer software]. Pavlovia.

Survey Recall code | try it

This demo presents a list of ten words and then uses an embedded survey instead of an editable textbox for free recall. The response is first split (using recalledWords = words.split(/\W/); which has to be manually translated) and then scored.

Survey Test code | try it | discussion thread

Surveys can be selected using the Survey ID (so they always run the latest version) of Survey Model File (so they are protected from changes to the online version). The results of each survey are saved to the PsychoPy data file. However, if you want to access the data during your experiment you should use code of the form surveyResponse = surveyComponentName.getResponse() which copies the data into a dictionary.
In this demo I check whether four consent items have been ticked using if len(surveyResponse['consent']) == 4: and then present the second GAD-7 score on screen using surveyResponse['OHQmean']. The order of presentation is counterbalanced using the shelf, in blocks of 20 participants.

Tone Selection code | try it | discussion thread

In this demo a video is played from a spreadsheet, followed by a random related sound. The set of sound files are loaded on the fly using prepareResources. The participant can then step through the sounds until they reach the one that matches the one in the original video. A bug in PsychoPy online sometimes prevents repetition of the same sound file, so in this demo the lowest and highest sounds alternate between two identical files instead of playing the same version twice.

Trial Switching code | try it | discussion thread

This demo randomises switch and non-switch trials in a classification task. The conditions are preloaded using a code component and allocated to two lists so that switch and non-switch trials can be balanced. The first trial type is random and the final one is allocated based on the remaining condition available.
Morys-Carter, W. L. & Mifsud, R. (2022, January 11). Trial switching [Computer software]. Pavlovia. https://doi.org/10.17605/OSF.IO/87BNX

tTraceTest8 code | try it | discussion thread

This version of the Trail Making Test (Reitan, 1955) uses code to create the targets and text, setting the target list from a spreadsheet, which increases flexibility compared with Andrew Vu’s original version. It will also run on mobile devices, since it is entirely mouse-based. Please cite as:
Morys-Carter, W.L. & Vu, A. (2022, January 24). tTraceTest8 [Computer software]. Pavlovia. https://gitlab.pavlovia.org/vespr/tTraceTest8

Wheel of Fortune code | try it | discussion thread

Use a mouse or touchscreen to spin a wheel. The speed is determined by how fast you move across the disc. Change the initial parameter “inertia” to influence how long it takes for the wheel to stop: 0 = immediate; 100 = never. Try values of around 95 for the best effect. The code uses arctan and skips the calculation when either the old or new mouse position would result in a division by zero error.

YouTube code | try it | discussion thread

Confirmation that the html code to embed YouTube videos from Brookes Template 2020 still works in 2024.2.4.

14 Likes

Countdown | code |

The “Words Round” from Channel 4’s Countdown, including a word checker at the end.
(Local only, for now)

My experiments serve as JavaScript tutorials and demos on how to extend PsychoJS with extra features

JavaScript Debugging Tutorials

tutorial_js_syntax_error

Experiment is stuck on “initialising the experiment…” code | try it

tutorial_js_semantic_error

PsychoJS shows a dialog with an error message. code | try it

tutorial_js_network_error

PsychoJS shows a dialog with “unknown resource” message. code | try it

tutorial_js_console_log

Get additional info about what is happening in the code of your experiment. code | try it

tutorial_js_expose_psychojs

Find out how your to expose PsychoJS objects to the web browser, so that you can access them via the browser console, and try things out in order to see what works (or not). code | try it

assignment_stroop

An exercise, featuring an experiment with a syntax, semantic, and network error. code | try it

Demos that extend PsychoJS

demo_eye_tracking2

Eye-tracking via a webcam. code | try it | discussion thread 1 | discussion thread 2

mouseview_demo

Mouse-tracking. code | try it

demo_gyroscope

Tells the orientation of a hand-held device. code | try it

demo_keyup

Log the duration of a keypress. code | try it | discussion thread

demo_multikey

Register multiple keys being up or down at the same time. code | try it

demo_dynamic_loops

A loop that is set up via code instead of reading directly from a conditions file. code | try it

demo_dynamic_allowedkeys

Illustrates how to have a Keyboard Component in PsychoJS listen to a set of keys specified in a conditions file. code | try it

demo_chaining

How to daisy chain Pavlovia with another website (like Prolific or Qualtrics). code | try it

demo_embed_html

Embed an HTML page or a form.io form into a PsychoJS experiment. code | try it

demo_polyfill

JS workarounds of @wakecarter’s crib-sheet, upgraded and bundled up in a single JavaScript file code | try it

3 Likes

I’ve decided that this thread is a good place to keep links to my Pavlovia resources as well as my demos.

PsychoPy Primer slides

Introductory Google slides using PsychoPy version 1.90.3

PsychoPy Python to JavaScript Crib Sheet 2021 | 2020 | discussion thread

Extensive tips and notes on how to make the most of Auto translate code components in PsychoPy.

Code Component Snippets link | discussion thread

Examples of Python / JavaScript code based solutions.

Form to HTML for Pavlovia link | discussion thread

Convert csv files created for the PsychoPy form component into html suitable for embedding.

Participant IDs for Pavlovia link | discussion thread

Assign consecutive participant numbers to your participants by recruiting using a link to this page instead of directly to your experiment. Values for id, session and researcher can be passed through unchanged, or consecutive values for session can be generated if you send a value for participant. No data is stored about participants other than the experiment folder, the time and, if applicable, the incoming participant id.

VESPR Study Portal link | discussion thread

Allows researchers to host study information, assign consecutive participant numbers, allocate evenly to groups (compensating for non-finishers) and anonymously withdraw consent or submit their email (e.g. for entry into a prize draw).

Anonymous Participant IDs link

This tool calculates a code from the participant’s email address and emails it to them. Ideal for anonymous test-retest. The code cannot be converted back into the original email address. It is possible, but highly unlikely within any given study, for two email addresses to convert to the same code.

1 Like

Using Slider Position to Change Opacity of Image code | try it | discussion thread

Changes the opacity of an image depending on current slider position: a light bulb lighting up depending on Aha! rating. In the demo, this effect is achieved by making an underlying version of the same image with a different color more or less visible.

4 Likes

Getting Typed Responses Locally or Online (Pavlovia) video link | discussion thread

Video demonstration and code (in video link) for getting typed responses from participants. Works locally and online.
3 Likes

Some tools for auditory scientists:

Headphone check test code | try it | paper
an online headphone check test using dichotic pitch stimuli to ensure that your participants use heaphones rather than speakers.

Sound volume setting procedure code | try it | paper
A sound level meter helps you and your participants to reliably control stimulus amplitude in online testing.

Adaptive Staircase Thresholding Procedure code | try it | paper
A plugin to do staircase online

1 Like

Simple “Video Player”-Controls Implementation for MovieStim (Online and Offline)
Utilizing the Likert-Scale-Component to mimic a video progress-bar and polygons to match “Play”- and “Stop”-Buttons.
Try it | Code | Discussion

Upload Local Images to a Local Blob and use in PsychoJS Experiment (Online)
This demo is a PoC of using a dynamic File Upload Field to allow local blob encoding of images (“participant can upload their images”).
Try it | Code | Discussion

Using HTML-Markup in TextComponent for Online Experiment TextToHTML
A “simple way” to use HTML/CSS/JavaScript in TextStim in Online Experiments on Pavlovia.
This is still a WIP but for Standard Desktop-targeted Experiments
Try it | Code | Discussion

Simple/Basic Dropdown-Selection for Online and Offline Experiments
Dropdown-Example that works online and offline.
Try it | Code | Discussion

Using a JSON-File for Paramters in Online and Offline Experiments
Using an external JSON-File to manage e.g. textSizes and Positions. This can be used to change the Layout or other experiments-settings without regeneration of PY/JS-Code.
Try it | Code | Discussion

Simple Demo Project to show how to implement continuous mouse and key presses in PsychoPy
Simple Demo Project to show how to implement continuous mouse and key presses in PsychoPy. This works online and offline.

Try it | Code

Tips & Tricks:
Tricks for Local-JS-Debug: Tips & Tricks: Ensure Newest File-Versions in Local Debug of PsychoJS-Experiments

2 Likes

PsychoPy Merger try it | discussion thread

An R-based online applet to easily merge mutiple .psyexp files into a single one.

PavloviaSwitch try it | github | discussion thread

An R-based online applet to implement controlled/deterministic counterbalancing for pavlovia experiments (i.e., a VESPR study portal alternative). try it only is for checking it out. If you really want to use it, implement it on your own server.

1 Like

Hi @ajus, I couldn’t get the link for this to work - is it working for you?

Thanks for the heads up. I’ve fixed @ajus 's links.

2 Likes

Time reproduction and production task code | try it

A brief demo for a time reproduction and time production task with commented code components for trials feedback and whole tutorial feedback

I posted these in their own thread, but I’m adding them here since this seems to be the main repository for online demos:

Online microphone recording: code | try it

This demo shows how to create an experiment that records audio via a participant’s microphone online. It also checks whether the participant has granted microphone access, and if they have not, prompts them to do so.

Headphone check: code | try it

This demo, based on the headphone screener made by @sijiazhao (and shared above in this thread)—it uses the audio files for the Huggins Pitch task available from that project’s github. It differs from that project in that (1) it was made in the Builder (with a few JS code components), so you don’t need to modify the auto-generated JS file from the Builder, and (2) it saves the results to the participant’s data file, rather than terminating the experiment upon failure of the check.

3 Likes