diff --git a/docs/markdown_docs/plugins/jspsych-survey-multi-picture.md b/docs/markdown_docs/plugins/jspsych-survey-multi-picture.md
new file mode 100644
index 00000000..a499c6b1
--- /dev/null
+++ b/docs/markdown_docs/plugins/jspsych-survey-multi-picture.md
@@ -0,0 +1,56 @@
+# jspsych-survey-multi-picture plugin
+
+The survey-multi-picture plugin displays a set of questions with multiple picture response fields. The subject selects a single answer.
+
+## Parameters
+
+This table lists the parameters associated with this plugin. Parameters with a default value of *undefined* must be specified. Other parameters can be left unspecified if the default value is acceptable.
+
+Parameter | Type | Default Value | Description
+----------|------|---------------|------------
+questions | array | *undefined* | An array of strings. The strings are the prompts/questions that will be associated with a group of options (images). All questions will get presented on the same page (trial).
+options | array |  *undefined* | An array of arrays of objects containing url key and label key(label is optional). The innermost arrays contain a set of options to display for an individual question. The length of the outer array should be the same as the number of questions.
+horizontal | boolean | false | If true, then questions are centered and options are displayed horizontally.
+preamble | string | empty string | HTML formatted string to display at the top of the page above all the questions.
+
+## Data Generated
+
+In addition to the [default data collected by all plugins](overview#datacollectedbyplugins), this plugin collects the following data for each trial.
+
+Name | Type | Value
+-----|------|------
+responses | JSON string | A string in JSON format containing the response for each question. The encoded object will have a separate variable for the response to each question, with the first question in the trial being recorded in `Q0`, the second in `Q1`, and so on. The responses are recorded as the image url for the picture clicked on.
+rt | numeric | The response time in milliseconds for the subject to make a response. The time is measured from when the questions first appear on the screen until the subject's response.
+
+## Examples
+
+#### Basic example with multiple questions on a page.
+
+```javascript
+    // defining groups of questions that will go together.
+    var page_1_questions = ["I like vegetables.", "I like fruit."];
+
+    // definiting two different response scales that can be used.
+    var page_1_options = [{url: "http://www.thetechconnectioninc.com/assets/img/Twitter.png", label: "twitter"}, {url: "http://www.freeiconspng.com/uploads/facebook-logo-png-20.png", label: "facebook"}];
+    var page_2_options = [{url: "http://www.gameswithwords.org/WhichEnglish/images/1_1.jpg", label: "dog chase cat"}, {url: "http://www.gameswithwords.org/WhichEnglish/images/1_2.jpg", label: "cat chase dog"}];
+
+    var multi_picture_block = {
+        type: 'survey-multi-picture',
+        questions: page_1_questions,
+        options: [page_1_options, page_2_options],  // need one scale for every question on a page
+    };
+
+    var multi_picture_block_horizontal = {
+        type: 'survey-multi-picture',
+        questions: page_1_questions,
+        options: [page_1_options, page_2_options],  // need one scale for every question on a page
+        horizontal: true  // centers questions and makes options display horizontally
+    };
+
+    jsPsych.init({
+      timeline: [multi_picture_block, multi_picture_block_horizontal],
+      on_finish: function() {
+        jsPsych.data.displayData();
+      }
+    });
+```
diff --git a/docs/markdown_docs/plugins/jspsych-survey-multi-select.md b/docs/markdown_docs/plugins/jspsych-survey-multi-select.md
new file mode 100644
index 00000000..82d7899a
--- /dev/null
+++ b/docs/markdown_docs/plugins/jspsych-survey-multi-select.md
@@ -0,0 +1,58 @@
+# jspsych-survey-multi-select plugin
+
+The survey-multi-select plugin displays a set of questions with multiple select response fields. The subject could select multiple answers.
+
+## Parameters
+
+This table lists the parameters associated with this plugin. Parameters with a default value of *undefined* must be specified. Other parameters can be left unspecified if the default value is acceptable.
+
+Parameter | Type | Default Value | Description
+----------|------|---------------|------------
+questions | array | *undefined* | An array of strings. The strings are the prompts/questions that will be associated with a group of options (check boxes). All questions will get presented on the same page (trial).
+options | array |  *undefined* | An array of arrays. The innermost arrays contain a set of options to display for an individual question. The length of the outer array should be the same as the number of questions.
+required | boolean | true | If true, then at least one option must be selected.
+required_msg | string | `*please select at least one option!` | Message to display if required check is not met.
+horizontal | boolean | false | If true, then questions are centered and options are displayed horizontally.
+preamble | string | empty string | HTML formatted string to display at the top of the page above all the questions.
+
+## Data Generated
+
+In addition to the [default data collected by all plugins](overview#datacollectedbyplugins), this plugin collects the following data for each trial.
+
+Name | Type | Value
+-----|------|------
+responses | JSON string | An array containing all selected choices in JSON format for each question. The encoded object will have a separate variable for the response to each question, with the first question in the trial being recorded in `Q0`, the second in `Q1`, and so on. The responses are recorded as the name of the option label.
+rt | numeric | The response time in milliseconds for the subject to make a response. The time is measured from when the questions first appear on the screen until the subject's response.
+
+## Examples
+
+#### Basic example with multiple questions on a page.
+
+```javascript
+    // defining groups of questions that will go together.
+    var page_1_questions = ["I like vegetables.", "I like fruit."];
+
+    // definiting two different response scales that can be used.
+    var page_1_options = ["Strongly Disagree", "Disagree", "Neutral", "Agree", "Strongly Agree"];
+    var page_2_options = ["Strongly Disagree", "Disagree", "Somewhat Disagree", "Neural", "Somewhat Agree", "Agree", "Strongly Agree"];
+
+    var multi_select_block = {
+        type: 'survey-multi-select',
+        questions: page_1_questions,
+        options: [page_1_options, page_2_options],  // need one scale for every question on a page
+    };
+
+    var multi_select_block_horizontal = {
+        type: 'survey-multi-select',
+        questions: page_1_questions,
+        options: [page_1_options, page_2_options],  // need one scale for every question on a page
+        horizontal: true  // centers questions and makes options display horizontally
+    };
+
+    jsPsych.init({
+      timeline: [multi_select_block, multi_select_block_horizontal],
+      on_finish: function() {
+        jsPsych.data.displayData();
+      }
+    });
+```
diff --git a/examples/jspsych-survey-multi-picture.html b/examples/jspsych-survey-multi-picture.html
new file mode 100644
index 00000000..c4fff1e7
--- /dev/null
+++ b/examples/jspsych-survey-multi-picture.html
@@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Document</title>
+  <script src="../jspsych.js" ></script>
+  <script src="../plugins/jspsych-survey-multi-picture.js" ></script>
+  <link rel="stylesheet" href="../css/jspsych.css"></link>
+</head>
+<body>
+
+</body>
+  <script>
+  var questions=["Please choose the picture which describes the following sentence: The dog is chased by the cat."]
+  var choices = [{url: "http://www.gameswithwords.org/WhichEnglish/images/1_2.jpg", label:""}, {url: "http://www.gameswithwords.org/WhichEnglish/images/1_1.jpg", label:""}]
+   var multi_choice_block = {
+      type: 'survey-multi-picture',
+      questions: questions,
+      options: [choices],
+      horizontal: true,
+      on_finish: function(data) {
+        console.log("i'm data", data)
+      }
+   };
+    jsPsych.init({
+      timeline: [multi_choice_block],
+      on_finish: function(data) {
+      },
+    });
+  </script>
+</html>
diff --git a/examples/jspsych-survey-multi-select.html b/examples/jspsych-survey-multi-select.html
new file mode 100644
index 00000000..e2c80cee
--- /dev/null
+++ b/examples/jspsych-survey-multi-select.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Document</title>
+  <script src="../jspsych.js" ></script>
+  <script src="../plugins/jspsych-survey-multi-select.js" ></script>
+  <link rel="stylesheet" href="../css/jspsych.css"></link>
+</head>
+<body>
+
+</body>
+  <script>
+   var questions=["Which of these colors do you like?", "Which of these foods do you like?"]
+   var choices = [
+     ["Red", "Yellow", "Green", "Blue", "Black"],
+     ["Apples", "Bananas", "Carrots", "Donuts", "Eggplant"]
+   ]
+   var multi_choice_block = {
+      type: 'survey-multi-select',
+      questions: questions,
+      options: choices,
+      horizontal: true,
+      required: true,
+      on_finish: function(data) {
+        console.log("i'm data", data)
+      }
+   };
+    jsPsych.init({
+      timeline: [multi_choice_block],
+      on_finish: function(data) {
+      },
+    });
+  </script>
+</html>
diff --git a/plugins/jspsych-survey-multi-picture.js b/plugins/jspsych-survey-multi-picture.js
new file mode 100644
index 00000000..0fdd44fa
--- /dev/null
+++ b/plugins/jspsych-survey-multi-picture.js
@@ -0,0 +1,145 @@
+/**
+ * jspsych-survey-multi-picture
+ * a jspsych plugin for multiple choice survey questions
+ *
+ * documentation: docs.jspsych.org
+ *
+ */
+
+
+jsPsych.plugins['survey-multi-picture'] = (function() {
+  var plugin = {};
+
+  plugin.info = {
+    name: 'survey-multi-picture',
+    description: '',
+    parameters: {
+      questions: {
+        type: [jsPsych.plugins.parameterType.STRING],
+        array: true,
+        default: undefined,
+        no_function: false,
+        description: ''
+      },
+      options: {
+        type: [jsPsych.plugins.parameterType.STRING],
+        array: true,
+        default: undefined,
+        no_function: false,
+        description: ''
+      },
+      required: {
+        type: [jsPsych.plugins.parameterType.BOOL],
+        array: true,
+        default: false,
+        no_function: false,
+        description: ''
+      },
+      horitzontal: {
+        type: [jsPsych.plugins.parameterType.BOOL],
+        default: false,
+        no_function: false,
+        description: ''
+      },
+      preamble: {
+        type: [jsPsych.plugins.parameterType.STRING],
+        default: '',
+        no_function: false,
+        description: ''
+      }
+    }
+  }
+  plugin.trial = function(display_element, trial) {
+    var plugin_id_name = "jspsych-survey-multi-picture";
+    var plugin_id_selector = '#' + plugin_id_name;
+    var _join = function( /*args*/ ) {
+      var arr = Array.prototype.slice.call(arguments, _join.length);
+      return arr.join(separator = '-');
+    }
+    // trial defaults
+    trial.preamble = typeof trial.preamble == 'undefined' ? "" : trial.preamble;
+    trial.required = typeof trial.required == 'undefined' ? null : trial.required;
+    trial.horizontal = typeof trial.required == 'undefined' ? false : trial.horizontal;
+
+    // if any trial variables are functions
+    // this evaluates the function and replaces
+    // it with the output of the function
+    trial = jsPsych.pluginAPI.evaluateFunctionParameters(trial);
+
+    // inject CSS for trial
+    var node = display_element.innerHTML += '<style id="jspsych-survey-multi-picture-css">';
+    var cssstr = ".jspsych-survey-multi-picture-question { margin-top: 2em; margin-bottom: 2em; text-align: center; }"+
+      ".jspsych-survey-multi-picture-text span.required {color: darkred;}"+
+      ".jspsych-survey-multi-picture-option { line-height: 2; margin-bottom: 10px; }"+
+      ".jspsych-survey-multi-picture-horizontal .jspsych-survey-multi-picture-option { display: inline-block;  margin-left: 1em;  margin-right: 1em;  vertical-align: top;}"
+
+    display_element.querySelector('#jspsych-survey-multi-picture-css').innerHTML = cssstr;
+
+    // form element
+    var trial_form_id = _join(plugin_id_name, "form");
+    display_element.innerHTML += '<form id="'+trial_form_id+'"></form>';
+    var trial_form = display_element.querySelector("#" + trial_form_id);
+    // show preamble text
+    var preamble_id_name = _join(plugin_id_name, 'preamble');
+    trial_form.innerHTML += '<div id="'+preamble_id_name+'" class="'+preamble_id_name+'">'+trial.preamble+'</div>';
+
+    // add multiple-picture questions
+    for (var i = 0; i < trial.questions.length; i++) {
+      // create question container
+      var question_classes = [_join(plugin_id_name, 'question')];
+      if (trial.horizontal) {
+        question_classes.push(_join(plugin_id_name, 'horizontal'));
+      }
+
+      trial_form.innerHTML += '<div id="'+_join(plugin_id_name, i)+'" class="'+question_classes.join(' ')+'"></div>';
+
+      var question_selector = _join(plugin_id_selector, i);
+
+      // add question text
+      display_element.querySelector(question_selector).innerHTML += '<p id="survey-question" class="' + plugin_id_name + '-text survey-multi-picture">' + trial.questions[i] + '</p>';
+
+      // create option clickble images
+      for (var j = 0; j < trial.options[i].length; j++) {
+        var option_id_name = _join(plugin_id_name, "option", i, j),
+          option_id_selector = '#' + option_id_name;
+
+        // add image container
+        display_element.querySelector(question_selector).innerHTML += '<div id="'+option_id_name+'" class="'+_join(plugin_id_name, 'option')+'"></div>';
+
+        // add label
+        if(trial.options[i][j].label){
+          var label = trial.options[i][j].label;
+          var option_label = '<label class="' + plugin_id_name + '-text">' + label + '</label>';
+          display_element.querySelector(option_id_selector).innerHTML += option_label;
+        } else {
+          var option_label = '<label class="' + plugin_id_name + '-text"></label>';
+          display_element.querySelector(option_id_selector).innerHTML += option_label;
+        }
+        display_element.querySelector(option_id_selector + " label").innerHTML =
+          '<img style="width: 250px; height: auto;" class="'+plugin_id_name+'-image" src="'+trial.options[i][j].url+'">' +
+          display_element.querySelector(option_id_selector + " label").innerHTML;
+      }
+    }
+    var matches = display_element.querySelectorAll(".jspsych-survey-multi-picture-option");
+    matches.forEach(function(currentImageDiv, index){
+      currentImageDiv.addEventListener('click', function(event){
+        var endTime = (new Date()).getTime();
+        var response_time = endTime - startTime;
+        var question_data = {};
+        var id = 'Q' + index;
+        var val = currentImageDiv.querySelector('.'+plugin_id_name+'-image').src;
+        var obje = {};
+        obje[id] = val;
+        Object.assign(question_data, obje);
+        var trial_data = {
+          "rt": response_time,
+          "responses": JSON.stringify(question_data)
+        };
+        display_element.innerHTML = '';
+        jsPsych.finishTrial(trial_data);
+      })
+      var startTime = (new Date()).getTime();
+    })
+  };
+  return plugin;
+})();
diff --git a/plugins/jspsych-survey-multi-select.js b/plugins/jspsych-survey-multi-select.js
new file mode 100644
index 00000000..a1991bfe
--- /dev/null
+++ b/plugins/jspsych-survey-multi-select.js
@@ -0,0 +1,177 @@
+/**
+ * jspsych-survey-multi-select
+ * a jspsych plugin for multiple choice survey questions
+ *
+ * documentation: docs.jspsych.org
+ *
+ */
+
+
+jsPsych.plugins['survey-multi-select'] = (function() {
+  var plugin = {};
+
+  plugin.info = {
+    name: 'survey-multi-select',
+    description: '',
+    parameters: {
+      questions: {
+        type: [jsPsych.plugins.parameterType.STRING],
+        array: true,
+        default: undefined,
+        no_function: false,
+        description: ''
+      },
+      options: {
+        type: [jsPsych.plugins.parameterType.STRING],
+        array: true,
+        default: undefined,
+        no_function: false,
+        description: ''
+      },
+      required: {
+        type: [jsPsych.plugins.parameterType.BOOL],
+        array: true,
+        default: false,
+        no_function: false,
+        description: ''
+      },
+      horitzontal: {
+        type: [jsPsych.plugins.parameterType.BOOL],
+        default: false,
+        no_function: false,
+        description: ''
+      },
+      preamble: {
+        type: [jsPsych.plugins.parameterType.STRING],
+        default: '',
+        no_function: false,
+        description: ''
+      }
+    }
+  }
+  plugin.trial = function(display_element, trial) {
+    var plugin_id_name = "jspsych-survey-multi-select";
+    var plugin_id_selector = '#' + plugin_id_name;
+    var _join = function( /*args*/ ) {
+      var arr = Array.prototype.slice.call(arguments, _join.length);
+      return arr.join(separator = '-');
+    }
+
+    // trial defaults
+    trial.preamble = typeof trial.preamble == 'undefined' ? "" : trial.preamble;
+    trial.required = typeof trial.required == 'undefined' ? true : trial.required;
+    trial.required_msg = trial.required_msg || '*please select at least one option!';
+    trial.horizontal = typeof trial.horizontal == 'undefined' ? false : trial.horizontal;
+
+    // if any trial variables are functions
+    // this evaluates the function and replaces
+    // it with the output of the function
+    trial = jsPsych.pluginAPI.evaluateFunctionParameters(trial);
+
+    // inject CSS for trial
+    var node = display_element.innerHTML += '<style id="jspsych-survey-multi-select-css">';
+    var cssstr = ".jspsych-survey-multi-select-question { margin-top: 2em; margin-bottom: 2em; text-align: left; }"+
+      ".jspsych-survey-multi-select-text span.required {color: darkred;}"+
+      ".jspsych-survey-multi-select-horizontal .jspsych-survey-multi-select-text {  text-align: center;}"+
+      ".jspsych-survey-multi-select-option { line-height: 2; }"+
+      ".jspsych-survey-multi-select-horizontal .jspsych-survey-multi-select-option {  display: inline-block;  margin-left: 1em;  margin-right: 1em;  vertical-align: top;}"+
+      "label.jspsych-survey-multi-select-text input[type='checkbox'] {margin-right: 1em;}"
+
+    display_element.querySelector('#jspsych-survey-multi-select-css').innerHTML = cssstr;
+
+    // form element
+    var trial_form_id = _join(plugin_id_name, "form");
+    display_element.innerHTML += '<form id="'+trial_form_id+'"></form>';
+    var trial_form = display_element.querySelector("#" + trial_form_id);
+    // show preamble text
+    var preamble_id_name = _join(plugin_id_name, 'preamble');
+    trial_form.innerHTML += '<div id="'+preamble_id_name+'" class="'+preamble_id_name+'">'+trial.preamble+'</div>';
+
+    // add multiple-select questions
+    for (var i = 0; i < trial.questions.length; i++) {
+      // create question container
+      var question_classes = [_join(plugin_id_name, 'question')];
+      if (trial.horizontal) {
+        question_classes.push(_join(plugin_id_name, 'horizontal'));
+      }
+
+      trial_form.innerHTML += '<div id="'+_join(plugin_id_name, i)+'" class="'+question_classes.join(' ')+'"></div>';
+
+      var question_selector = _join(plugin_id_selector, i);
+
+      // add question text
+      display_element.querySelector(question_selector).innerHTML += '<p id="survey-question" class="' + plugin_id_name + '-text survey-multi-select">' + trial.questions[i] + '</p>';
+
+      // create option check boxes
+      for (var j = 0; j < trial.options[i].length; j++) {
+        var option_id_name = _join(plugin_id_name, "option", i, j),
+          option_id_selector = '#' + option_id_name;
+
+        // add check box container
+        display_element.querySelector(question_selector).innerHTML += '<div id="'+option_id_name+'" class="'+_join(plugin_id_name, 'option')+'"></div>';
+
+        // add label and question text
+        var form = document.getElementById(option_id_name)
+        var input_id_name = _join(plugin_id_name, 'response', i);
+        var label = document.createElement('label');
+        label.setAttribute('class', plugin_id_name+'-text');
+        label.innerHTML = trial.options[i][j];
+        label.setAttribute('for', input_id_name)
+
+        // create  checkboxes
+        var input = document.createElement('input');
+        input.setAttribute('type', "checkbox");
+        input.setAttribute('name', input_id_name);
+        input.setAttribute('value', trial.options[i][j])
+        form.appendChild(label)
+        form.insertBefore(input, label)
+      }
+    }
+    // add submit button
+    trial_form.innerHTML +='<div class="fail-message"></div>'
+    trial_form.innerHTML += '<input type="submit" id="'+plugin_id_name+'-next" class="'+plugin_id_name+' jspsych-btn"></input>';
+
+    trial_form.addEventListener('submit', function(event) {
+      event.preventDefault();
+      // measure response time
+      var endTime = (new Date()).getTime();
+      var response_time = endTime - startTime;
+
+      // create object to hold responses
+      var matches = display_element.querySelectorAll("div." + plugin_id_name + "-question");
+      var question_data = {};
+      var has_response = [];
+      matches.forEach(function(match, index) {
+        var val = [];
+        var inputboxes = match.querySelectorAll("input[type=checkbox]:checked")
+        inputboxes.forEach(currentChecked => {
+          val.push(currentChecked.value)
+        })
+        var id = 'Q' + index
+        var obje = {};
+        obje[id] = val;
+        Object.assign(question_data, obje);
+        if(val.length == 0){ has_response.push(false); } else { has_response.push(true); }
+      })
+      // adds validation to check if at least one option is selected
+      if(trial.required && has_response.includes(false)) {
+        var inputboxes = display_element.querySelectorAll("input[type=checkbox]")
+        display_element.querySelector(".fail-message").innerHTML = '<span style="color: red;" class="required">'+trial.required_msg+'</span>';
+      } else {
+        // save data
+        var trial_data = {
+          "rt": response_time,
+          "responses": JSON.stringify(question_data)
+        };
+        display_element.innerHTML = '';
+
+        // next trial
+        jsPsych.finishTrial(trial_data);
+      }
+    });
+
+    var startTime = (new Date()).getTime();
+  };
+
+  return plugin;
+})();