Chapter 14. The Harmony of Surprise and Familiarity: Four Principles and Flow

In Chapter 13, we saw that a button is not the experience itself but a signifier of experience. We now move to the first impression people should receive from a first screen made of those signifiers. Our scope here extends only to the mixture within the screen. Chapter 18 will address the preview that promises the impression in advance outside the screen, while Chapter 15 will separately examine how the world answers after a button is pressed.

The praise heard most often when making a new game is “This feels fresh.” The complaint heard most often is “This is difficult.” Yet the two often come from the same screen.

To a planner, one is praise and the other a complaint, so they are opposites. To an ordinary person, they are the same. Before an unfamiliar screen, they cannot distinguish “fresh” from “I don't know what this is.” Unfamiliarity is simply unfamiliarity, and when it accumulates on one screen, it becomes difficulty. What we call novelty, they read as difficulty.

Planners commonly treat unfamiliar controls, unseen screens, and new rules as weapons, believing differentiation itself is appeal. That belief is only half right. People are drawn to the new but also stop before the unknown. If the entire first screen is new, they ask “How do I use this?” before feeling that it is fresh. If the question lingers, freshness becomes a wall rather than an attraction. Novelty and familiarity are not a matter of seasoning but of proportion.

Two Reviews of One Game

Enter an imaginary character game. It is a game for raising and customizing characters and sharing short conversations. Suppose two people encounter the same first screen.

The first person becomes absorbed within ten seconds. Seeing a round button at the bottom of the screen, they immediately press it and the character responds. They swipe upward and the next character appears. No one taught them, yet their hand moves by itself because the same hand used to swipe through short-form videos and photos works here. Having entered through something familiar, they show an unfamiliar expression when the character asks their name and starts a conversation. “Oh, it's talking to me.” They entered with a familiar gesture and met something new.

The second person enters the same game by a different route. Unlike the first, who landed directly on the customization screen through a friend's link, they download it after seeing an app-store ad and enter through an opening that shows the main combat first. They close it within thirty seconds. On the first screen they see, an unfamiliar joystick sits at the lower left, two unexplained colored bars fill the top, and a character stands in the middle. A gamer reads the two bars at a glance as health and stamina. A newcomer cannot even tell whether something is filling up or whether they indicate an ad coming to an end. They do not know what to press or where to look. There is so much novelty that they close the screen without even classifying what they do not know. The two screens were different entrances to the same game: one opened through familiarity, while the other was blocked by novelty.

MEJE Aidong World deliberately places its controls in familiar territory. On the screen for customizing the dog Aidong, petting it by hand and placing stickers are the same actions fans used to decorate photo cards and phones. Choosing colors and adding decoration are what they did in journaling crafts. Everything the hand does comes from where the fan used to live. The result is what is new. Pet Aidong and it giggles; choose a color and a one-of-a-kind Aidong comes into the world. Make the gesture familiar and the result surprising.

Borrow Three and Make Only One New

Leave the degree of familiarity vague, and every decision depends on intuition. We therefore divide it into four criteria. When all four are met, people feel they can “read” the first screen.

First is intuitiveness. Can people guess what the screen is for before hearing an explanation? A round button looks pressable, and a character looks touchable. Knowing by looking is intuitiveness. Second is familiarity. Do the screen's actions resemble things people already do elsewhere? Swiping to move on, pressing to choose, and pulling to refresh are daily actions; the more they resemble those actions, the less there is to teach. Third is consistency. Does a rule that works on one screen work on the next? If swiping upward reveals the next item here but swiping sideways is required there, people must learn again on every screen. The same action should produce the same result. Fourth is a low barrier to entry. Is the threshold before the first action low? If users must pass through login, terms, and a long explanation before touching the first character, they are tired before they ever touch it. Strictly speaking, the first three concern whether a screen is readable, while the fourth is closer to the costs discussed in Chapter 11. We keep it here because it follows as an outcome of the other three. An intuitive, familiar, and consistent screen has nothing to teach, so the cost of reaching the first action naturally falls.

All four stand on the side of familiarity. Where, then, does novelty go? Here we reach the chapter's rule for proportion: make one unfamiliar and three familiar. Make only one of the things the first screen asks of people new, and fill the rest with things they already know. If the controls are new, keep the screen layout, rewards, and world in familiar forms. If the world is entirely new, keep the controls, rewards, and screen exactly as people know them. To be clear, there is no strict proof that the four must be controls, screen layout, rewards, and world. They are not laws but a practical heuristic that divides the major things people must first read on a screen. Sound or characters can be added as a fifth cell without changing the rule. The point is not the number of cells but the proportion. Novelty charges an attention cost by itself, and the first screen can barely afford one unit. With only one novelty, people have room to focus on it. When two or three overlap, none feels fresh; together, they simply feel difficult.

We can pair them more precisely. Make the controls familiar and the meaning new. Borrow what the hand does from where people used to live, but let the meaning produced by the gesture exist only here. Make the reward familiar and the world new. Keep the familiar structure of receiving something after doing well, but make what is received and the world it belongs to new. Familiarity is the door that lets people in, while novelty is the reason they stay. If the door is unfamiliar, people do not enter; if the interior is only familiar, they have no reason to remain.

Is Difficulty Really a Virtue?

This chapter has two conventions to inspect. The first is a belief rooted deeply in the culture: games are naturally difficult, and overcoming difficulty is a virtue of games.

The belief comes from the long history of games as a medium of challenge and overcoming. The thrill of defeating a difficult boss after dozens of attempts, the pride of mastering controls known only to experts, and a culture that looks down on easy games make this belief true among gamers. To them, difficulty is not an insult but an invitation. The taunt “Can you beat this?” pulls them in. The statement that challenge is a virtue is true inside the world of gamers.

Ordinary people do not share this agreement. To someone filling the time between two subway stations, difficulty is not a provocation but an inconvenience. They did not come to accept the taunt “Can you beat this?” They came for a moment of pleasure. To a gamer, the first wall is a challenge worth crossing. To an ordinary person, the first wall is the exit. They do not doubt themselves before it; they simply do something else. With YouTube and short-form media beside them, there is no reason to hold onto something difficult. The same first difficulty is an attraction for one group and a reason to leave for another. Apply gamer culture's common sense that “challenge is a virtue” directly to the first screen, and we lose at the entrance the majority we meant to attract.

The costs this convention imposes on ordinary people are wounded pride and wasted time. When blocked on the first screen, people briefly feel slow and close the app to avoid feeling that displeasure again. Keep the essence and change the form. The pleasure of challenge and achievement is a valuable essence of games, so do not discard it; defer it until after people have opened their hearts instead of placing it on the first screen. Lower the first wall, then slowly raise the challenge after people decide to stay. At a first meeting, the most important thing is not challenge but the feeling that it is safe to be here.

Numbers have also shown that an “easy first stage” is a gain rather than a loss. A mobile puzzle-game developer reportedly tested different stage difficulties. Raising the difficulty of early stages made people leave sooner over the long term, while those retained by an easy first stage stayed longer, though individual stage difficulty changes continually in a live game. A difficult first stage may appear to test people on the spot, but over time it pushes away even those who would have stayed. Laying out an easy first stage and letting people remain goes farther than testing them with difficulty.

There is another convention to inspect: asking users to select difficulty on the first screen and showing a game-over screen after failure. A screen asking users to choose Hard, Normal, or Easy has long seemed natural in games. To gamers, this is considerate because it gives them the right to adjust the experience to their skill. To a newcomer, it is different. They do not yet know how difficult the game is, yet before starting they are asked to declare their ability. Not knowing what to choose, they are blocked by the first choice. The game-over screen is the same. To gamers, “YOU DIED” is a familiar signal to try again. To ordinary people, it reads as the verdict “You failed,” turning someone who came for brief play into a loser. These conventions charge drop-off before starting and after failure. Keep the essence and change the form. In the first experience, do not ask the difficulty. Watch the person's first few attempts and let the game adapt by itself. Turn failure from a game-over verdict into a light slip from which they can immediately try again. A failure that invites another try is experience; a failure that makes another try undesirable is farewell.

The Place Where Flow Does Not Break

Lowering difficulty does not mean making a game easy and monotonous. People leave when it is too easy because they are bored and when it is too difficult because they are blocked. The place of deepest absorption lies somewhere between: a point that is slightly tense but manageable, where the task is just barely within reach of one's skill. There, people lose track of time and briefly forget the world beyond the screen. Academia has a separate name for this state of immersion, but the first screen does not need the name; it needs the feel. When difficulty slightly exceeds skill, people leave from anxiety. When it falls far below skill, they leave from boredom.

This balance is difficult in a first experience because incoming skill levels vary. One person has hands trained by many games, while another is entirely new. A single difficulty cannot satisfy both. The first few stages should therefore be designed to make failure almost impossible, keeping difficulty below skill until the person's hand learns what to do. If this seems to contradict the claim that immersion lies at the edge of ability, remember that learning the controls is itself a challenge at first. Even an easy stage already feels within the zone of flow. Raise difficulty slightly for the first time around the moment trained hands would become bored. While the person improves little by little without noticing and the game grows harder in step, the two curves rise together and the person remains in flow. The goal of the first screen is not to test people but to bring them into this flow.

Here we can see the danger of a tutorial that explains everything. Flow begins as people discover through their hands. Pour every rule into an explanation at the beginning, and there is no place for flow to start. Telling someone who came to play that they must read and memorize before starting is giving them an exam first. Let them begin with familiar actions, and give explanations one piece at a time, in place, when they become blocked. Flow is not made through explanation but grows while doing.

▶ Three Questions to Apply to My Screen

Is there truly only one new thing this first screen asks of people? Are two or more of controls, screen, reward, and world marked “new”?

Is the gesture used for the first action the same gesture people already perform every day in other apps?

Can a newcomer reach the end of the first stage without getting stuck once? If any answer is “no,” freshness turns into difficulty at that point.

Therefore, Decide What Will Be New First

The first decision in balancing novelty and familiarity is not the visual design of the screen but the single new thing in our game. Are the controls new, the world new, or the meaning of the reward new? Once that one thing is chosen, the rest follows. Everything except the single novelty is borrowed in a form people already know. When novelty gathers in one place, people feel it as attraction. When it is scattered across the screen, they feel it as difficulty.

Go one level deeper, and the four cells are not equal. Novelty in controls and novelty in world carry different risks. Portal kept the gestures of a first-person shooter and twisted only the space beyond the hand, earning love. QWOP twisted the controls beneath the hand itself and became a wall to many. Even the iPhone's supposedly new multitouch borrowed familiarity from the habits of hands touching real objects. Aidong World's rule—“make the gesture familiar and the result surprising”—stands in the same line. This gives one more criterion when choosing the single novelty: put novelty not beneath the user's hand but beyond it. Borrow the input and place the surprise in the result it produces.

This decision leads directly to measurement. Whether the first screen works as a door of familiarity appears in how quickly people reach their first action. If the time from opening the first screen to the first input is long, or many people close the screen after only looking without acting, the screen we believed familiar was actually unfamiliar. Familiarity is judged not in our heads but by people's hands. Examine the failure rate of the first few stages as well. Frequent failure from the beginning signals that difficulty has outrun skill, and more people close the first screen there. Whether novelty was gathered into one place and the first wall was lowered does not end as intuition; it returns in these numbers.

Reference Content

Cases in other media that reveal the concepts of this chapter.

Video Games

Portal: it keeps the familiar first-person-shooter gestures of WASD movement and mouse aiming and gathers novelty into one thing, a portal gun that connects two places. Early test chambers first let players fire one portal, then connect two, teaching one rule at a time through the hands. It is a reference for both “make three familiar and one unfamiliar” and learning by doing.
QWOP / Getting Over It: counterexamples that deliberately destroy familiar controls and pile up novelty. The unfamiliarity is their identity, but it becomes a wall for many newcomers.
Dark Souls: the tutorial's first boss demon is designed as a fight from which an under-equipped player should flee through a door rather than stand and fight. “YOU DIED” and bonfires, the checkpoints, combine into a signal meaning “try again after death.” The same death is read as an invitation by gamers and a verdict by ordinary people.
Angry Birds / Candy Crush: the first stage yields to a touch, and difficulty rises slowly only after people decide to stay. Candy Crush is a recurring checkpoint in this book, following its hearts in Chapter 11 and its spoken praise in Chapter 13.

Device UX / Consumer Electronics

The iPhone's first multitouch: it kept screen and icon layouts familiar and made only one thing new—directly swiping and pinching with fingers—concentrating the surprise there.

The remaining reference content is gathered in the “Chapter 14 Appendix” at the end of this chapter (collected as Appendix D in the printed volume).

Design Note ▶ Try It Yourself

Divide what our game's first screen asks of people into four cells: controls, screen layout, rewards, and world.

Write only one character beside each cell: familiar or new. F or N. Count how many Ns remain. If there are two or more, keep only the one that is truly our unique weapon and ask whether the rest can be changed into forms people know. This checks whether “make one unfamiliar and three familiar” is being kept.

Next, score the first screen using the four principles, but we are not the scorers. Having said that familiarity is judged by people's hands rather than our minds, letting planners score their own screen would return us to “our minds.” Seat one person close to Chapter 7's extreme beginner and have them score intuitiveness, familiarity, consistency, and low barrier to entry from zero to five. If no such person is immediately available and the team scores it internally, treat the score only as a hypothesis and pair it with measurement of time to first input. The lowest-scoring item is the highest first wall; fix it first. Finally, write the difficulty of the first three stages: make failure almost impossible in the first, let the controls settle into the hand in the second, and make the third slightly difficult for the first time. Check that this curve does not run ahead of the skill curve. The detailed mixture and scoring sheets continue into the four-principle scorecard in Appendix C.

One-line summary: Novelty is the reason people stay, and familiarity is the door that lets them in. A first screen should make only one thing unfamiliar and three familiar so people feel novelty as attraction. Fill familiarity with intuitiveness, familiarity, consistency, and a low barrier to entry, and concentrate novelty in one place. Apply gamers' common sense that games are naturally difficult directly to the first screen, and the first wall becomes drop-off. Do not test people; bring them into flow. Next chapter: Suppose they enter through a familiar gesture and perform the first action. The next question is how the world answers that action. If a button is pressed and the world does not respond, is that an experience? We move to feedback: the story of the world responding behind the button.

Chapter 14 Appendix: Reference Content Collection

This collection gathers cases from beyond games that repeat the chapter's claims: four principles make the first screen readable—intuitiveness, familiarity, consistency, and a low barrier to entry; the mixture rule is “make one unfamiliar and three familiar”; and novelty should be placed in the result beyond the hand rather than in the controls beneath it. The cases are grouped by medium, and each ends with an “Observation” describing what a designer should watch. There is one way to read them: count what is familiar, which single thing is new, and whether novelty is concentrated in one place or scattered.

Video Games

Super Mario Bros. 1-1: without a line of text, the 1985 game teaches players within their first few steps to avoid and stomp a Goomba, hit a question block, and distinguish a mushroom from an enemy. Miyamoto is often quoted in substance as saying that the moment players discover for themselves what to do, the game becomes theirs. Observation: the archetype of an explanation-free opening that teaches through flow; the amount is cut so only one new thing appears on each screen.
Half-Life's opening tram: the 1998 game does not begin with a cutscene that takes control away. It places players on a slow monorail, lets them look around, and teaches through their hands that doors respond when approached. The environment itself teaches without guidance text. Observation: beginning through experience instead of explanation; keeping familiar first-person controls and concentrating novelty in the world.
Resident Evil 4: rather than asking players to choose difficulty before starting, the 2005 game is known to read combat performance through a hidden score and adjust enemy aggression, durability, and drops in real time—tighter when a player performs well, looser when they struggle. Observation: adaptive difficulty that lets the game adjust without asking users to declare their skill; removing the wall of a first choice before newcomers.
Animal Crossing: there is no game over or failure screen, and Tom Nook waits without pressing players even if they do not repay their debt. After short tutorial tasks, it releases them to play their own way without a fixed answer. Observation: undefeated onboarding that does not turn failure into a verdict; rhythm and attachment can grow without game over.
Portal: the 2007 game preserves the familiar first-person-shooter gestures of WASD movement and mouse aiming, concentrating novelty into one thing, a portal gun connecting two places. Early test chambers let players fire one portal and then connect two, learning rules one piece at a time through their hands. Observation: a textbook mixture of “make three familiar and one unfamiliar”; novelty is placed beyond the hand, in space, not beneath it, in the controls.
QWOP / Getting Over It: counterexamples that deliberately break familiar controls and pile up only novelty. The unfamiliarity is their identity, but it is a wall to many newcomers. Observation: unfamiliarity itself can be sold as identity, but that path targets the minority who read unfamiliarity as challenge rather than the majority.
Dark Souls: the tutorial's first boss demon is a fight designed to encourage an under-equipped player to escape rather than confront it. “YOU DIED” and the bonfire checkpoint combine into the signal “try again after death.” Observation: the same death screen reads as an invitation to gamers and a verdict to ordinary people; a single failure presentation is translated in opposite directions according to origin.
Angry Birds / Candy Crush: the first stage yields to a finger, and difficulty rises only after people decide to stay. Candy Crush is known to continue refining hard stages during live operation. Observation: the first stage's difficulty is an entrance guide rather than an exam; bind the difficulty curve so it does not outrun the skill curve.

Animated Film

Disney and Pixar's new worlds atop familiar three-act structures: the story's skeleton remains in a familiar form, and novelty is concentrated in the world. Observation: familiarity of structure earns the budget needed to bear an unfamiliar world.

Live-Action Film

Scream: the 1996 film observes nearly all the familiar grammar of slashers—a masked killer, a group of teenagers, an isolated house—while adding only one new layer: characters who know the rules of horror and speak them aloud. Observation: how “keep three and twist only one” works in a genre film; novelty concentrated into one twist.
Star Wars: the 1977 film built an entirely unfamiliar world in space while borrowing the story skeleton from the most familiar hero narratives and Westerns. Lucas is often said to have acknowledged influence from Kurosawa's The Hidden Fortress. Observation: when the whole world is new, familiar structure and character types let audiences enter; the novelty budget is spent in the single cell of world.

Literature

Regression, reincarnation, transmigration, and isekai fiction: these works borrow the entire familiar fantasy framework of medieval swords and magic, adventure and growth, even game-like levels and statistics, then add only one new device: beginning again in another world after death. Observation: lowering the entry threshold by concentrating novelty at one point atop a familiar frame; genre convention is a shared inventory of familiarity.
Finnegans Wake: it simultaneously pushes a style mixing many languages, a circular structure whose final sentence returns to the first, and a narrative following dream logic, making even a plot summary difficult. Observation: when novelty is not concentrated but spread across the entire work, it becomes difficulty rather than attraction.

Board Games

Catan / Ticket to Ride: they place one new core rule atop familiar actions such as rolling dice, using cards, and connecting routes, allowing newcomers to finish the first game. Observation: entry classics share the rule “make actions familiar and only one rule new.”
Beginner-friendly “easy first game” variants: the first game is arranged to make getting stuck nearly impossible, bringing people inside before raising the full difficulty. Observation: difficulty before flow begins and difficulty after it begins are designed separately.

Live-Action TV / Drama

One variation on a familiar format: crime and medical dramas borrow three familiar parts of the frame and make only one setting new, bringing viewers in quickly. Observation: serialized television effectively must pass a “four-principle score” every week; check whether the number of variations remains one.

Music

The I–V–vi–IV four-chord progression: songs as different as U2's “With or Without You,” Bob Marley's “No Woman, No Cry,” and Adele's “Someone Like You” share the same four-chord skeleton, adding one new melody over familiar harmony. Comedy groups' “four-chord” medleys that string together many hits over one progression are often cited. Observation: placing one new tune atop a familiar foundation is a basic technique of popular music; even with the same foundation, a different new cell creates a different song.

Devices / Consumer-Electronics UX

Tesla's consolidation into a large touchscreen: it moved almost every physical button other than climate and gear controls onto one screen, replacing familiarity at the fingertips with novelty all at once. Criticism often notes drivers leaving their lane while reaching for the screen, and European safety-assessment criteria are reportedly moving toward requiring physical controls for essential functions. Observation: what is charged when familiarity is withdrawn all at once; the cost of a screen with two or three overlapping “new” cells can also be calculated in units of safety.
The iPhone's first multitouch: the first iPhone in 2007 kept screen and icon layout familiar and made only one thing new, directly swiping and pinching with fingers. Even that new action borrowed familiarity from the habits of hands touching physical objects. Observation: a double borrowing that makes even the single novelty depend on an existing bodily habit.
The Nintendo Wii Remote: the 2006 Wii chose the shape of a TV remote instead of a gamepad. Developers said in interviews, in substance, that no one would hesitate to pick up a remote everyone already held at home. The familiar object lowered the entry barrier, and novelty was placed in the result beyond the hand—the screen responding to a swing. Observation: hardware can also place novelty beyond the hand, in response, rather than beneath it, in the input device.
Self-service ordering kiosks: they seem intuitive to their makers, but for a first-time user, the layout, terminology, and payment procedure are all new at once. Add the social pressure of a line behind them, and studies report that orders become rushed and smaller. Observation: familiarity is judged by the user's hand, not the designer's mind; the number of “new” cells on the same screen is counted differently by each user.

App UX

Duolingo: rather than forcing sign-up and login first, it lets users begin the first lesson immediately and recommends creating an account only after progress accumulates and becomes worth saving. Observation: a tangible example of lowering the barrier to the first action; the cost of sign-up is deferred until after value.
TikTok's one-finger feed: it combines discovery, selection, and playback into a single upward swipe, reducing controls to one action everyone knows while placing novelty in the feed, where no one knows what comes next. Observation: borrowing the input and placing surprise in the result reduces control learning almost to zero seconds.
Toss's simple money transfer: it reportedly gained ground by reducing transfers that once required certificates and security devices across many steps to a few taps resembling a message sent through a messenger app. The hand performs familiar taps; novelty lies in the result that the procedure disappeared. Observation: which steps fixed as “just how the process works” can be folded into familiar gestures; identify the equivalent of the old certificate in our own field.