Annotated Image
Activity Type

Description

This activity type can provide additional context to an image through the inclusion of ‘Look Closer’ buttons. Each ‘Look Closer’ button can display open to display rich text, an image gallery, or a video. 

Features

subdirectory_arrow_right

Image Format

This activity type supports jpg and png image files.

subdirectory_arrow_right

Scale to Fit

The image can be scaled to fit the size of the window. This will use a CSS transform to the entire activity container, resulting in the Look Closer buttons scaling proportionally. 

subdirectory_arrow_right

Labels

There is a label button in the bottom left corner that can be opened to display a rich text description. 

subdirectory_arrow_right

Look Closer

Look Closer buttons can be placed on the activity canvas and, when pressed, will display rich text or multimedia.  They can be always displayed, toggleable through a button, or made invisible for integration into an image.

Examples

label

Virtual Birdwalk

This activity displays a illustrative representation of the ecosystems found within the Puget Sound area in Washington State. Each Look Closer button displays a gallery of birds that visitors could find there. 

label

Urban Biome

This activity displays a illustrative representation of an hypothetical urban ecosystem around the Puget Sound area in Washington State. It is one of four like it that are used in a live facilitated activity where students create their own bird species. Each Look Closer button displays things to consider for a bird who may live there. 

label

Northern Flicker Specimen

This activity displays a collections image of a Northern Flicker. Each Look Closer button opens additional photographs of the specimen from different angles. This activity is one of twelve like it that display specimen from the Slater Museum collection and was used as part of a live facilitated activity about creating scientific illustrations. 

Resources

info

Activity Guide

We offer a wiki guide you can follow to create an interactive using this activity type.

assignment

Draft Template

We provide a template in the Open Document Format that can be used with word processors to draft the language and media for this activities before they are coded.

code

Code Editor

We host an interactive JSON editor that can be used to input activity data, then download the completed JSON template.

Community