DEV Community

What Japan's Elite Cram-School Handouts Teach Us About Page Design

A one-page mathematics handout can tell a student what to do before the teacher says a word.

Hi, I'm KKTeX. I publish LaTeX packages on CTAN and build typesetting tools for education in Japan.

Japan has a large system of private after-school education known as juku. One unusually intensive public example is Tetsuryokukai. According to its official profile, it is a six-year secondary-school program specializing in preparation for the University of Tokyo and was founded in 1983 by students and graduates of the university's medical and law faculties (official profile).

The institution is interesting. But for a typesetter, the more interesting question is smaller:

What does an intensive mathematics handout ask the page itself to do?

This is my answer, built from scratch in LuaLaTeX:

An original one-page Japanese exam-prep-style mathematics handout

This is not a reproduction of a Tetsuryokukai handout, and I am not claiming that the organization uses TeX. It is an original reconstruction of the broader visual grammar surrounding high-density Japanese exam preparation.

The page gives instructions

Look at the page before reading the mathematics.

The dark 07 badge answers: Where am I?

The segmented header answers: What kind of object is this?

The right-hand 標準 (standard) chip answers: How demanding is it?

STRATEGY answers: What should I notice before calculating?

SOLUTION answers: How do I verify the argument?

KEY POINT / 要点 answers: What should I retain for the next problem?

QUICK RETRIEVAL answers: Can I rebuild it later without rereading?

None of these elements is merely decorative. Together they turn a page into a sequence of learning actions:

  1. locate;
  2. classify;
  3. calibrate;
  4. choose a method;
  5. verify;
  6. remember;
  7. retrieve.

That sequence is especially useful in a weekly booklet. Students do not read such material once from beginning to end. They return to it before a test, search for a familiar problem type, cover the solution, and try again.

Dense does not have to mean noisy

An intensive handout needs to carry a great deal of information, but visual weight must remain scarce.

In this design:

  • black is reserved for mathematics and the main structure;
  • blue-slate identifies navigation;
  • a dotted outer boundary and a solid inner rail establish each teaching object;
  • a thin antique-gold inset reads like the molding inside a picture frame;
  • compact C-scrolls and shell-like palmettes terminate the four corners;
  • pale gray is reserved for secondary labels.

The result is dense, but it still has a reading order. I call this production variant the Rinceau Frame / 唐草額. Its structure comes directly from my ascolorbox4 experiments: the title interrupts the top rail, a dotted boundary sits outside it, and inward quarter-circles turn all four corners. I then rebuilt those corner terminals with the grammar of a Western picture frame—C-scrolls, a small palmette, and a second molding line—without letting the ornament enter the reading column.

The most important design decision is not the color. It is placing the strategy before the full solution. A student first receives a way into the problem, not an answer to copy.

The TeX idea

The page uses one reusable component for each pedagogical role:

\LessonHeading{07}{LESSON}{A Parameter and a Quadratic}

\begin{DrillBox}
  {EXAMPLE 12}{Positive for Every Real \textit{x}}[2]
  ...
\end{DrillBox}

\begin{StrategyBox}
  ...
\end{StrategyBox}

\begin{SolutionBox}{SOLUTION}
  ...
\end{SolutionBox}
Enter fullscreen mode Exit fullscreen mode

The content says what an object means. The style file decides how that meaning should look.

That separation is what makes TeX unusually well suited to systematic teaching materials: the visual language can remain stable across hundreds of pages.

Two tools from the same desk

Disclosure: these are my projects.

Evolton turns a photograph or screenshot of a mathematics problem into a polished solution PDF. It treats the answer as a teaching object, not merely a block of correct text.

Evolton interface and solution-PDF examples

MathHover opens a LaTeX panel beside the cursor and inserts the finished formula into the application you are already using.

MathHover formula panel showing a completed limit and integral

The next article opens the same component system and explains the engineering behind title-cut rails, ornamental corner geometry, and page-break states in a longer specimen.

Top comments (0)