Progress Meters

A Progress Meter visually represents progress toward a goal in activities like TeamRaiser events, donation campaigns, or advocacy alerts. These meters can be traditional styles like thermometers or bar graphs, or more creative visuals such as a cyclist, runner, or ship moving toward a destination. You can also design custom graphics.

You can add a Progress Meter using the Widget Progress Component or by selecting it from the Components menu in the Content Editor (WYSIWYG).

Components of a Progress Meter

• Initial Image: Represents the starting point (0% progress).

• Background Image: Shows the path toward the goal (e.g., a race track or beach scene). This is where the progress marker moves.

• Goal Achieved Image: Displays when 100% of the goal is reached or exceeded.

• Sliding Marker: Moves along the background to indicate current progress. It stays centered over the percentage complete. If the marker includes a pointer, it must also be centered.

Design Considerations

• If you include a scale on the background, it must start and end exactly half the width of the slider from the left and right edges, respectively. This ensures accurate percentage calculations.

• Progress can be displayed horizontally (e.g., a runner heading to a finish line) or vertically (e.g., a thermometer filling up).

Managing Progress Meters

Created meters are found in the Progress Meters List, where you can edit, copy, or delete the meters.