The main display

The way you interact with FlashGrid is that it pops up a dialog like this one every time Anki shows you a flashcard during a practice session. In this case the front of the card is just some audio that is automatic played, and the back has an image and written meaning. FlashGrid randomly selects three other card backs of the same flashcard type, so that you have to decide which one to click.

Once you've clicked on the correct card back, the dialog disappears and Show Answer is pressed automatically.

FlashGrid is designed to work with any Anki deck, provided that it makes sense to select among card backs after looking at a card front. There can be great variation in flashcard designs across decks, so FlashGrid uses the same code that Anki itself does for displaying the cards, with these caveats:

• It tries to shrink cards down to fit better into a grid, mainly by reducing image size. If you can reduce the font sizes used in your cards, that can help too.

• For some decks, the back of a card is "Front + horizontal line + Back" since you've already seen the front anyway. In FlashGrid, this would give everything away and use too much space, so it tries to only display the actual card back.

The Japanese deck shown below has five types of cards total (I've color-coded them for clarity). It has two record types ('note types): a Sentence has two card templates, and a Vocabulary item has three. So, Anki will auto-generate either two or three cards for each record.

• (a1) Here, the Front shows English text and a picture; the Back shows Japanese text and plays audio.

• (a2) If FlashGrid is enabled, then between those two steps, this grid will pop up. It shows the Front unmodified (on the left). The Back is mixed randomly into a grid of Backs, and audio is suppressed until after you've selected the correct Back.

• (b1) Here, the Front of a Sentence displays Japanese text; the Back shows the English and an image.

Note that if you scrolled up here, you'd see the front and a horizontal line.

• (b2) Again, if FlashGrid is turned on, a grid will pop up in between and will show the Front unmodified and the Back mixed randomly into a grid. Images are automatically restricted in size for the sake of the grid.

Note: This image reflects the fact that I manually tweaked the card Backs' templates' font sizes down from 40 pt to 18 pt.

FlashGrid automatically removed the Front from each card Back, but that template also included a {{Reading}} field on the back. This should be removed or moved up above the <hr/> horizontal line in order to not 'give anything away'.

• (c) If you toggle the grid size up to 3x3, do make sure your flashcards are clean/small enough to fit comfortably. This template would need to be reduced, probably by removing fields or line breaks, or reducing font sizes.