Skip to main content

Someone wanted to learn this too, so Grasp built them a personal learning path.

You can keep exploring this one or create your own

Explain It Like I'm 5: UX/UI & Code

Introduction

Hello! In our previous lesson, we focused on the generation effect and the power of "productive failure"—struggling to find an answer before you're given the solution. This process primes your brain for deeper learning by revealing what you don't yet know.

Today, we'll explore a closely related and equally powerful technique: self-explanation. If generation is about producing an answer, self-explanation is about articulating the process, reasoning, and connections behind it. It’s the art and science of teaching yourself what you've just learned to ensure the knowledge truly sticks.

Our learning outcome for this lesson is to use self-explanation to process and articulate new UX/UI concepts or code syntax in your own words. We will focus on a famous and highly effective framework for this called the Feynman Technique. By the end of this lesson, you will have a structured method for moving beyond surface-level definitions to build genuine, intuitive understanding.

What is Self-Explanation?

At its core, self-explanation is the process of explaining a concept to yourself, in your own words, as if you were teaching it to someone else. This act forces you to move beyond simply recognizing terms and concepts and toward actually understanding how they work and relate to each other.

A well-known structured method for self-explanation is the Feynman Technique, named after the Nobel Prize-winning physicist Richard Feynman, who was famous for his ability to distill complex ideas into simple, intuitive explanations.

Let's start with a video that introduces the core idea and the steps of this technique.

How to Learn Faster with the Feynman Technique (Example Included)

This video from Thomas Frank, 'How to Learn Faster with the Feynman Technique', provides a clear overview of the technique's origin and its four fundamental steps.

Please watch from 00:30 to 03:36. Focus on understanding the motivation behind the technique and the four steps he outlines: Write down the concept. Explain it in simple terms. Identify shaky areas and go back to the source. Simplify and create analogies (remove jargon).

Why Self-Explanation is So Effective

The Feynman Technique seems simple, but it triggers several powerful cognitive processes. When you force yourself to explain a concept simply, you are engaging in a highly constructive activity. This is much more effective than passively re-reading notes.

Research in cognitive science highlights why this works. Explaining material to yourself:

  • Integrates new information with prior knowledge. You are forced to build bridges between what you're learning and what you already know.
  • Forces you to make inferences. You have to fill in the logical gaps that are often skipped over in textbooks or lectures.
  • Helps you monitor your understanding. You immediately discover where your explanation becomes vague or reliant on jargon—these are your knowledge gaps.

To give you an idea of its proven value, especially in technical fields, let's look at a research paper on this very topic.

[PDF] Prompting for Free Self-Explanations Promotes Better Code ...

This academic paper, 'Prompting for Free Self-Explanations Promotes Better Code Comprehension', studied the effect of self-explanation on learning to code. You don't need to read the whole paper, but a specific section gives excellent, concrete instructions.

First, skim the section '2. RELATED WORK' to see the cognitive theory behind self-explanation. Then, carefully read the block-quoted text in the section '3. EXPERIMENTAL SETUP'. This is the exact prompt the researchers gave to students to guide their self-explanations. These questions are a fantastic practical tool for you.

The key takeaway from that paper is a set of guiding questions you can use every time you self-explain. When learning a new concept, ask yourself:

  • What new information does this line/paragraph provide?
  • How does it relate to what I’ve already read/know?
  • Does it give me a new insight into how this works?
  • Does it raise a question in my mind?

This structured self-interrogation is the engine of deep understanding.

Test your understanding!

Imagine you are learning about CSS Flexbox for the first time. You just read about the property justify-content. How could you use the questions above to self-explain this property?

Show answer

Your thought process might look something like this:

  • What new information? "The property justify-content controls how items are aligned along the main axis of a flex container."
  • How does it relate? "Okay, this seems to be the counterpart to align-items, which I just learned controls alignment on the cross axis. So I have one property for horizontal alignment (in a row) and one for vertical."
  • New insight? "Ah, the values like flex-start, center, space-between aren't just arbitrary names. They describe the distribution of empty space. space-between pushes items to the ends, while space-around gives each item equal space on both sides. This is why it's so useful for creating evenly spaced navigation bars or card layouts."
  • Question raised? "The default is flex-start. What happens if I'm using a flex-direction: column? Does justify-content now control the vertical alignment since the main axis has changed? I should test that."

This is far more effective than just memorizing the definition.

Application Exercise: Explaining a UX Principle

Now, let's apply the full Feynman Technique to a topic from your field of expertise: UX Design. This will help you practice the process in a familiar context before applying it to newer domains like coding or data analysis.

Below is a mind map of common UX design principles.

UX Design Principles Mind Map
A mind map showing eleven core UX design principles. This provides a set of concepts to choose from for your self-explanation practice.

Your Task (15-20 minutes):

  1. Choose a Concept: Select one principle from the mind map. A good choice would be one you feel you understand but perhaps couldn't explain perfectly to a new team member, like "Hierarchy" or "Design Context".

  2. Get Raw Material: Do a quick 2-3 minute search and read a short article or definition of the principle you chose. Don't spend too long on this; the goal is to get just enough information to start the explanation process.

  3. Apply the Feynman Technique: Grab a piece of paper or open a blank document and follow the four steps.

    • Step 1: Write the Name. At the top, write the name of the principle (e.g., "Visual Hierarchy").
    • Step 2: Explain it Simply. Write an explanation of the principle in plain English.
      • Crucially, anchor it with a concrete example from a past project you've worked on. For instance, "On the Experian dashboard project, we used visual hierarchy by making the user's credit score the largest and boldest element on the page..." This connects the abstract concept to your concrete experience.
    • Step 3: Identify Gaps. Read your explanation aloud. Where did you stumble? Where did you have to use fuzzy language or jargon? What part of your own example doesn't quite fit the explanation? Circle these areas. These are your knowledge gaps. Go back to your source material (or find a new one) to clarify these specific points.
    • Step 4: Refine and Simplify. Rewrite your explanation, paying special attention to the gaps you identified. Challenge yourself to eliminate all UX jargon. Could you explain this concept clearly to a stakeholder in marketing or sales? Could you explain it to a new intern? Your goal is an explanation that is both simple and precise.

This exercise isn't about producing a perfect document; it's about practicing the mental motions of deconstructing, explaining, and rebuilding your knowledge.

Conclusion

In this lesson, we moved from generating answers to generating explanations. Self-explanation, particularly through the structured Feynman Technique, is a powerful strategy for transforming fragile, surface-level knowledge into deep, durable understanding.

Key Takeaways:

  • Self-explanation is an active learning strategy. It involves teaching a concept to yourself in simple terms to identify gaps in your understanding.
  • The Feynman Technique provides a four-step framework: (1) Choose and study a concept, (2) Explain it in simple terms with examples, (3) Identify and review weak points, and (4) Refine the explanation and eliminate jargon.
  • It works by forcing you to connect new information to existing knowledge, make logical inferences, and monitor your own comprehension.
  • This technique is versatile. It is equally effective for understanding conceptual topics like UX principles and for grasping procedural or syntactical knowledge like code.

In our next and final lesson for this module, we will step back from active cognitive strategies and look at a crucial biological process that underpins all of them: the role of sleep in memory consolidation. You'll learn why a good night's rest isn't a luxury but a non-negotiable part of an effective learning process.

Can't find a good explanation? Sign up and we'll make it for you

Sign up