Note: Play-by-play for the 2012-2013 season is now available.
This page presents play-by-play visualizations of NFL games from the 2011-2012 season. Play-by-play data comes from the NFL.com web site.
For an explanation of how to read the visualizations, look at the brief tutorial below, or read the full description of the methods used to convert a game's plays into a visual representation. If you just want to see the visualizations, click on the links below to go directly to the given week's games
Often, our visualizations are not immediately intuitive. With just a few simple explanations, however, it is easy to understand what each visualization is showing.
We present a game by drawing every play, in order, that occurs during the game. Plays are drawn as coloured rectangles on top of a virtual football field. The colour, height, and width of each play rectangle tells you which team has possession, where the play started and ended, and when the play started and ended.
Here is an example of a play from the Cleveland Browns at the Baltimore Ravens. The home team's endzone (Baltimore) is on the left side, and the away team's endzone (Cleveland) is on the right. Team names (BAL and CLE) are drawn in the endzones to identify them. Unlike a real game, the endzones are fixed and do not alternate between quarters. The three yellow lines on the field show Baltimore's 20-yard line (on the left), the 50-yard line (in the center), and Cleveland's 20-yard line (on the right).
|
Field positions range left-to-right, from Baltimore's 0-yard line on the left to Cleveland's 0-yard line on the right. Game time ranges top-to-bottom, from the beginning of the game at the top of the field to the end of the game at the bottom. So, a play rectangle's colour defines who has possession, the rectangle's left and right ends define where the play starts and ends, and the rectangle's top and bottom define when the play starts and ends. In our example play, Baltimore has possession (purple), the play starts at Baltimore's 15-yard line (left end) and ends at Baltimore's 45-yard line (right end), and the play begins at Quarter 1-15:00 (top) and ends at Quarter 1-14:35 (bottom).
That's all there is to understanding how to read the basics of a play. There are three standard play types: kick, run, and pass. We decorate the play rectangle in different ways to distinguish these play types from one another.
 |
Here are examples of the three play types for Baltimore (purple plays on the top-left) and Cleveland (yellow plays on the bottom-right):
Variations on these basic play types also exist, for example:
|
Now you have everything you need to read any of the NFL visualizations. Let's look at the first few plays from a Cleveland-Baltimore game to show how each play is drawn.
Cleveland's kickoff is shown as a yellow rectangle with an arrow on the left for a right-to-left kick, followed by a striped purple rectangle showing Baltimore's 18-yard return |
4-P.Dawson
kicks 74 yards from CLE 30 to BAL -4. 36-J.Leonhard to BAL 14
for 18 yards (16-J.Cribbs).
|
|
A successful pass by Baltimore shown as a purple rectangle with X's drawn over it |
1-10-BAL 14
(14:56) 5-J.Flacco pass deep right to 85-D.Mason to BAL 33
for 19 yards (24-E.Wright).
|
|
A short rush by Baltimore shown as a striped purple rectangle |
1-10-BAL 33
(14:17) (No Huddle) 33-L.McClain left end to BAL 37 for 4
yards (96-A.Hall, 54-A.Davis).
|
|
A Baltimore pass, a pass, a rush, a rush for no gain on 2nd and 3, and a rush for no gain on 3rd and 3 |
2-6-BAL 37
(13:35) 5-J.Flacco pass short right to 23-W.McGahee to BAL 48
for 11 yards (96-A.Hall). 1-10-BAL 48 (12:52) (No Huddle) 5-J.Flacco pass short right to 86-T.Heap to CLE 37 for 15 yards (54-A.Davis). 1-10-CLE 37 (12:14) (No Huddle) 23-W.McGahee left end to CLE 30 for 7 yards (21-B.Pool). 2-3-CLE 30 (11:42) (No Huddle) 27-R.Rice left guard to CLE 30 for no gain (91-S.Smith, 54-A.Davis). 3-3-CLE 30 (10:48) 27-R.Rice left end to CLE 30 for no gain (54-A.Davis, 52-D.Jackson). |
|
A failed field goal attempt by Baltimore, notice how the kick rectangle fades out at its end to show the play failed |
4-3-CLE 30
(10:10) (Field Goal formation) 3-M.Stover 48 yard field goal
is No Good, Hit Right Upright, Center-70-M.Katula,
Holder-4-S.Koch.
|
|
Cleveland's series, starting from their 38-yard line following the failed field goal: a rush, rush, pass, rush, an incomplete pass and a penalty (illegal formation) declined by Baltimore, an incomplete pass on 3rd and 8, and a punt to Baltimore resulting in a touchback. |
1-10-CLE 38
(10:05) 3-D.Anderson scrambles to CLE 40 for 2 yards
(26-D.Landry). 2-8-CLE 40 (9:37) 31-J.Lewis right end to CLE 43 for 3 yards (92-H.Ngata, 26-D.Landry). 3-5-CLE 43 (8:56) (Shotgun) 3-D.Anderson pass short left to 16-J.Cribbs to BAL 40 for 17 yards (26-D.Landry). 1-10-BAL 40 (8:30) 31-J.Lewis right guard to BAL 38 for 2 yards (92-H.Ngata, 94-J.Bannan). 2-8-BAL 38 (7:51) 3-D.Anderson pass incomplete short right to 12-S.Steptoe. Penalty on CLE-73-J.Thomas, Illegal Formation, declined. 3-8-BAL 38 (7:47) (Shotgun) 3-D.Anderson pass incomplete deep middle to 17-B.Edwards. 4-8-BAL 38 (7:41) (Punt formation) 15-D.Zastudil punts 38 yards to end zone, Center-64-R.Pontbriand, Touchback. |
As you can see, our visualizations are nothing more than the same three basic play rectangles (kick, run, pass) positioned, sized, and decorated to represent each play as it unfolds during a game. The entire CLE-BAL game visualization is available online, as are visualizations for all the other games that have been played.
Roll over the scores to see a thumbnail of that game's visualization. Click on a score to view a full-sized visualization of the game's plays.
We would like to thank NFL Properties LLC (NFLP) for their permission to use feed data from nfl.com as part of our research project. Please note that this use is specifically for non-commercial, non-marketing purposes.
