Good (and bad) examples of cards

[badlydrawnrob]

Here you can add some examples of your decks, which would be good to see how people are using it:

• Using the Anki app (the good and the bad) #72

[badlydrawnrob]

Bad: No context

A little better: Context with a hint

Still suffers a bit by asking too many questions at once:

1. What is this function type called?
2. What will this function return?

Better solution: split into two cards

1. Title changed
2. Split out into different questions
3. Add a hint to show this is a repl output (not a comment)

Room for improvement ...

Asking two questions in a card is a bad idea?

Card 1: What kind of function do we call this?
Card 2: What Type will this function output?

These are two distinct questions and you don't have to think about them if they're two separate cards.
In the above image our cloze card shares the same title. There's two questions there.
You'd have to:

1. As yourself which question fits the cloze field?
2. Which answer fits the question?

Try to be explicit wherever possible.

[badlydrawnrob]

Too much code (and too many bullet points!)

The answer "steps" are too long as well.
Ideally should be viewed at a glance.
Our answer notes are trying to tell us too much!!!

⚠️ It breaks the rule:

• ☝️ONE IDEA PER CARD

Better solution (less code, fewer notes)

1. Reduce code to only List.map viewThumbnail functions
2. Use comments to explain the model (instead of adding more code)
3. Split out the explanation of what List.map does to another card
4. Or, add a link with an example of List.map in use.
5. Add a link with the full working program (ideally with notes)
6. The Key Point is that we can curry the function ...
7. And pass it another variable later (with the help of List.map)
8. We don't need to know what selected does, nor classList
9. Anything extra we can add to another card!
10. We can show what the viewThumbnail would return given only one argument

[badlydrawnrob]

A card with a link to a bigger program

Here we're asking ourselves to fix a bug
Requires using an external repl

Sometimes you need to solve a problem with a card, but there's so much information that it makes no sense having a code example on the card. One example is a card that says:

Here we have an error in the program. What is it? How do we hunt it down?

Problem: link is too small on a mobile

Looks better if you flip phone on it's side

Better: view the link only in desktop app

You can then view it at it's proper size, and if you need to actually edit the program it's waaay easier on a desktop than with a fiddly mobile phone.

[badlydrawnrob]

Making the ★ Key point notes stand out at-a-glance

• Currently the text all blends into each other. The reverse of the card could do with some extra formatting to make the point stand-out:
  • Make the main point bold text
  • Have the main point as a - bullet list or on it's own line
  • Change the CSS to make a card's answer bigger text

Better: the key learning point first and foremost, in bold

[badlydrawnrob]

Good: a link for context, a small piece of code for revision

Linking through to a simplified piece of code

This snippet of a program is greatly reduced from the original. It gets to the meat of the problem as quickly as possible. The comments in the card's code aren't so great, so they could be improved too.

Can we do better?

Option 1: add the whole codebase to the card (cognitive load)
Option 2: get to the nub of the problem, fast.
Option 3: Some half-way house solution I haven't thought of yet¹

I honestly don't know a better way to write this card up. The full program takes at least a minute to look through and connect the dots; the smaller snippet still takes longer than we'd want to navigate to and understand.

Footnotes

1. This could involve adding some bits of code as hints within comments, or the whole program but with some bits ... dotted out. In general, I don't think it's a good idea for a card to have to take more than 30 seconds to look at. ↩

[badlydrawnrob]

Good: simple example, key points about Maybe

Succinct, easy-to-glance, a link for further info.

[badlydrawnrob]

Good or bad? A large chunk of code with a reveal

The question is reasonably clear, but there may be
a little too much code on this card. This kind of card
could use a better highlighting method ...

missing-card-with-large-code-chunk.mp4

[badlydrawnrob]

Too many learning points -> ONE learning point

I'm conflating two things here: a Maybe List and a type Custom
The question is a bit jarring when looking at the Model with two fields ...
What am I looking for? The question has nothing to do with custom types? So on ...
The question is also a bit vague: Which function: Maybe.withDefault? view functions for Nothing and Just a?

"What function do we use when rendering a possible empty list in our HTML?" is longer-winded but clearer.
Be as explicit as possible! In what context do we need to use the function? Why? Where?

Better: a clearer question, no custom type, focused key points

Only mentioning type Custom in passing. Even that could be removed, but it's good to note why Maybe is an easier choice than a custom type.