An elegant implementation of Implicit Association Test (IAT), an SPA and a serverless backend, powered by Vue.js and Tencent Serverless Functions.
A full stack project for Implicit Association Test, with SPA + Serverless backend + Analysis.
Please give this project a star if it helps you. ❤️
The implicit-association test (IAT) is a measure within social psychology designed to detect the strength of a person’s subconscious association between mental representations of objects (concepts) in memory. It is commonly applied to assess implicit stereotypes held by test subjects, such as unconsciously associating stereotypically black names with words consistent with black stereotypes. The test’s format is highly versatile, and has been used to investigate biases in racial groups, gender, sexuality, age, and religion, as well as assessing self-esteem.
This IAT is inspired by Project Implicit.
This project uses Tencent cloud function (aka. Tencent SCF), the main logic is defined in /serverless/iat/main.py
.
This project basically uses Vue + Typescript + Element-UI.
A mock server is needed to run the SPA without backend. Besides, npm
and Node.js
is required, this project is also yarn
compatible.
This project use json-server
as a mock API server. To run the SPA, follow the instructions below:
Node.js
and npm
Click here to know How to install Node.js and npm?
json-server
by running command: npm install -g json-server
node spa/iat/mock/server.js
to start local mock RESTful API servernpm install
in project root directory to install project dependenciesnpm serve
to run SPA and see what it looks like in the browserFeel free to open an issue if you need help.
Each single test can be an image or a word.
export interface SingleTest {
testDescription: string;
positiveOrNegative: "positive" | "negative";
isImage: boolean;
imageURL?: string;
}
All test interfaces are defined in /spa/iat/src/interfaces/test.ts
.
Write your own test packs according to TestPack
interface, in /spa/iat/src/data/index.ts
like:
{
instruction: {
title: "Part 1: Normal Test",
cmds: [
"Instruction 1 lorem ipsum vanilla ipsum lorem",
"Instruction 2 lorem ipsum vanilla ipsum lorem",
"",
"Instruction 3 lorem ipsum vanilla ipsum lorem",
"Instruction 4 lorem ipsum vanilla ipsum lorem",
"Instruction 5 lorem ipsum vanilla ipsum lorem",
"",
]
},
positiveTitle: "Happy",
negativeTitle: "Unhappy",
// Shuffle() is defined in /spa/iat/src/core/index.ts
testCases: Shuffle([(testCase1 as SingleTest), (testCase2 as SingleTest)])
};
Test instruction:
Single test of image:
Single test of word:
Homepage:
Test welcome & user basic information form:
Test result page: