Options Button Y=, Tables and Lists Panning and Zooming Graphing Transformations Factoring Formula Library Fractions Simplified Button Layout More Ideas

Pan and Zoom

Evolution of Prototypes

 

Initial Design

 

Try prototype

User can actively pan or zoom to adjust the window screen by pressing the "Pan" or "Zoom" buttons, and then using the arrow keys

Allow dynamic window adjustments with instant feedback using the directional pad.

To adjust the window, the user may press on the "Pan" button to turn on "pan mode".

After pressing on the "Zoom" button, the user may use the up/down arrow keys to zoom in or zoom out.

 

Iteration 1

Try prototype

Design change: Extend interface

  • After pressing on "Pan" or "Zoom", display an animated graphic to encourage users to press on the arrow keys.
   

Rationale

1/2 students

Pan/zoom modes had no effect except for the label change; there is no indication what should be done after pressing the "Pan" or "Zoom" button

One user pressed the "pan" button and did not know what to do next.

 

Iteration 2

Try prototype

Design Change: "Smart" pan/zoom

  • Automatically zoom and pan to ensure that all points are covered on the screen.
  • If desired, user can manually pan or zoom, as shown in the previous iteration.
   

Rationale

6/8 users

Users were confused, because they were initially presented with a "blank" screen, since the data points were out of the default screen. The fact that the axes were not labeled added to the confusion (See Graphing - Transformations), because users were not clear how much each tick mark represents. Of these users, 3 users eventually figured out how to pan.

1 user tried to use the arrow keys to pan without pressing the "Pan" button.