Interactive Flashcard Template with Drag and Drop & Feedback

Hi everyone,

I’m excited to share a new template I created for Anki, inspired by a discussion I found about interactive card templates on the Anki forum (you can check it out here: https://forums.ankiweb.net/t/interactive-card-templates/48792).

This template is versatile and can be used for a variety of study purposes. It allows you to drag and drop terms into specific categories or zones, providing immediate visual feedback with ‘+1’ icons for correct answers and ‘-1’ icons for incorrect ones. The layout can be configured to display either horizontally or vertically, depending on your needs.

Note: This template was fully customized with the assistance of ChatGPT.

When creating cards, use the | character to separate multiple correct answers within the same field.

You can find the template on GitHub here: https://github.com/cjdduarte/anki-template-interactive-drag-drop

You can also download an example deck here: https://github.com/cjdduarte/anki-template-interactive-drag-drop/blob/main/Example.apkg

I’d love to hear your feedback and any suggestions you may have.

10 Likes

The “nouns”, “verbs”, “adjectives” headers do not appear in Android. Also, can we make the drag and drop more responsive in mobile? It takes a little too much time to select a word to drag it. Dark mode support would be nice too.

So far, this template has only been tested on PC. I am evaluating how it performs on other platforms, such as mobile devices, and I will update you soon.

1 Like

Thank you for your feedback!

I tested the headers (“nouns”, “verbs”, “adjectives”) on Android, and they appeared correctly for me, which is why I’d like to confirm your setup. Could you let me know what version of Android you’re using and the language your device is set to? This will help me investigate further.

As for the drag-and-drop responsiveness on mobile, this behavior is typical on mobile devices, but I’ll see what can be improved. I’m also working on adding dark mode support.

1 Like

I’m on Android 11, AnkiDroid is 2.19beta1 version. My device language is set to English.

Can you also look into the width? My card scaling is set to 100% in Settings > Accessibilty but the card doesn’t fit properly in screen.

Change Log:

v1.1 - 2024-09-04

  • Added trim to terms comparison to remove spaces around ‘|’ separators.
  • Evaluated forgotten terms as incorrect with -1 feedback.
    - Dynamic headers and terms handling for up to 5 columns.
  • Added support for dynamic vertical and horizontal table generation based on layout.
  • Fixed comparison logic for terms with multiple answers using ‘|’ to trim extra spaces.
  • Added visual feedback for both correct (+1) and incorrect (-1) answers, including forgotten terms.

v1.0 - Initial release

i like the concept. Do you have any other ideas of interactive cards

I like the concept, but it’s way too much information for a single card. You have, like, 15 answers in one card.
I like this more: Interactive card templates
ezgif-7-6213ee4eb8

I’m curious which one will end up being more popular, considering that they are conceptually similar.
Btw, I’m collaborating with the guy who made this one, there will be another note type - Randomized Cloze. It also aims to solve the “memorizing the shape of the question rather than the content” problem.

i don’t see the use case for the +1 and -1. Maybe if there was a total score how many you got right and how many you got wrong.

This is just an attempt at visual gamification. I have other ideas, but that’s why

1 Like

15 terms was just an example. But what I actually use is 2 columns and 2 or 3 terms, no more than that. I prioritize minimal information, but I want to keep it flexible for everyone.

i like the idea. just had a thought on what kind of things i can use this note type. Like a bunch of drugs. And I have to put them in the rigth field. Like which drugs are typical and which are atypical anipsychotics.

An idea I had from my note type. That you can try and put. Is a settings button. And there the user can enable disable things. Like if you decide to add audio effects whether they got it rigth or wrong they can go there and mute it.