Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

With the Image Matching Activity, learners scroll through images until they find the
one that is associated with the given image.

This is an image to image matching activity. See an online example.

Panel
bgColor#DEEBFF

Things to know

Activity title:

Up to 35 characters look best (50 max)

Activity instruction:

Up to 50 characters look best (500 max)

Number of activity cards:

Up to 4 cards look best (12 max).

A vertical scrollbar appears at the left after 4 cards.

Activity image best practice:

1:1 Aspect Ratio images work best for 6 match pairs.

16:9 or 4:3 Aspect Ratio images work best for 4 match pairs.

Panel
bgColor#DEEBFF

Image pixel size per aspect ratio (without text):

1:1 Aspect Ratio - minimum:
182 pixel x 182 pixel

4:3 Aspect Ratio - minimum:
?? pixel x ?? pixel

16:9 Aspect Ratio - minimum:
288 pixel x 162 pixel

  • Double the pixel size if the image has text.

A 1:1 ratio means that an image’s width and height are equal, creating a square. (Example: a 1080 x 1080 pixel image)

There are several free image editors available to adjust the image aspect ratio.

Panel
bgColor#DEEBFF

To maintain image quality, crop the image dimensions using any image editor (ex. Paint/Paintbrush).

If an image is re-sized but not cropped to match pixel dimensions, the image may be stretched or squeezed to fit which can degrade the image quality.

Panel
bgColor#DEEBFF

Tip

  • Learners can click the magnifying glass icon to enlarge the image.

  • Images with little or no text work best

    .

    Panel
    bgColor#DEEBFF

    Activity Image

    Image Matching Activity.pngImage Matching Activity - Set of 6.pngImage Added
    Panel
    bgColor#DEEBFF

    Tip

    1. Learners can click the magnifying glass icon to enlarge the image.

    2. Images with little or no text work best.

    Image Matching with Magnifying Glass icon.pngImage RemovedImage Matching with Magnifying Glass icon.pngImage Added
    Panel
    bgColor#DEEBFF

    Tip

    1. Learners can click the magnifying glass icon to enlarge the image.

    2. Images with little or no text work best.

    Panel
    bgColor#DEEBFF

    Accessibility

    Screen readers will also read out loud:

    • Activity Title

    • Activity Instructions

    • Activity Keyboard Command List

    • Image alt text

    Panel
    bgColor#DEEBFF

    Keyboard Command list for Activity

    Image Matching Activity Keyboard commands.png

    Create an Image Matching Activity

    Panel
    bgColor#DEEBFF

    Build the Activity

    1. Click the ‘Add Matching’ + icon to create an image matching pair.

    2. Click Select File to insert
      a local image file,
      SoftChalk Cloud image file or
      URL image file location for
      each matching image pair.

    3. Add alt text for each image.
      (required)

    4. Repeat STEPS 1-3 until all
      matching image pair sets have
      been created.

    5. Add points to the activity,
      enable Retry, Show Answers
      or Feedback sounds
      (optional).

    6. Click OK to insert the activity
      into your lesson

    Panel
    bgColor#DEEBFF

    Image Matching Activity video

    Iframe
    allowfullscreentrue
    srchttps://softchalkcloud.com/file/files/dSwktYHqEVOZLG/Image%20Matching%20Activity5%20-%20Trim.mp4
    width100%
    framebordershow
    alignmiddle
    height450px
    longdescThis video demonstrates how to create a Connections Activity. Read more about the Image Matching Activity in the SoftChalk Cloud user guide.

    Image Matching Activity Mobile Views

    Vertical

    Horizontal

    Image Matching-Dentistry-Vertical Mobile View.pngImage Matching-Dentistry-Horizontal Mobile View.png