**Language / Langue :** [[fr:ui:phone|FR]] | **EN**

====== Phone mode (ui: phone) ======

In ''phone'' mode, the game is displayed inside a **smartphone frame**: each room becomes a screen (home, messaging, call, gallery...), each choice a touch action. Perfect for epistolary fiction, text-message investigations or "found phone" games.

<code yaml>
title: "The found phone"
ui: phone
</code>

===== One screen per room =====

The ''screen:'' (''ecran:'') key of a room picks the **rendering** of the screen. The game logic stays the same: only the presentation changes.

^ Value ^ Rendering ^
| ''home'' / ''accueil'' | Grid of app icons (the choices). |
| ''folder'' / ''dossier'' | App folder, same logic as home. |
| ''conversation'' / ''messages'' | Messaging: texts as bubbles, choices as quick replies. |
| ''contacts'' | Contact list. |
| ''call'' / ''appel'' | Call screen with styled actions (answer / decline). |
| ''gallery'' / ''galerie'' | Thumbnail grid. |
| ''photo'' | One picture in a large frame. |
| ''notes'', ''mail'', ''web'' | Reading screens. |
| ''lock'' / ''verrouillage'' | Lock screen. |
| ''system'' | Neutral screen (default when the key is absent). |

<code yaml>
rooms:
  - id: phone_home
    screen: home
    text: ~
    choices:
      - button: "[[https://example.com/sms-icon.png]] Messages"
        to: chat_maya
      - button: "📷 Photos"
        to: gallery

  - id: chat_maya
    screen: conversation
    text: |
      **Maya:** Are you there yet?
      **Maya:** Answer me...
    choices:
      - button: "Yes, I made it."
        to: chat_next
</code>

On app screens (home, folder, contacts, gallery), a choice icon comes from a ''%%[[url]]%%'' image in its label, otherwise from its leading emoji.

===== Living conversations =====

On a ''conversation'' screen, texts are rendered as bubbles (received, sent, system) and a ''%%<<pause>>%%'' in the text shows an animated **typing indicator** before the next message - as if the other person were writing.

===== Back and Home =====

The phone navigation bar offers two system buttons:

  * **Back** walks the real history of visited screens, over several levels (home, folder, mail, back, back...).
  * **Home** returns to the room set by ''phone_home:'' (''phone_accueil:'') at scenario level.

<code yaml>
phone_home: home_screen
</code>

Write **re-readable** screen rooms: Back re-displays the room and its automatic events run again. Put effects on choices rather than in entry events.

===== Shape and orientation =====

''phone_shape:'' (''phone_forme:'') sets the global device shape, and ''shape:'' on a room changes it locally - the frame stretches with an animation, like a rollable screen.

<code yaml>
phone_shape: portrait          # portrait (default), landscape, tablet
</code>

^ Shape ^ Rendering ^
| ''portrait'' | Vertical phone (9:16). |
| ''landscape'' / ''paysage'' | The same device rotated (16:9). |
| ''tablet'' / ''tablette'' | Large 4:3 format, enlarged content. |

The persistence suffix picks the behavior between rooms:

  * ''phone_shape: landscape-global'' (default): a room with ''shape:'' changes the form for its visit only, then back to the global shape;
  * ''phone_shape: portrait-start'': the last ''shape:'' encountered **persists** until the next one.

===== Input and notification =====

  * The input bar stays visible by default, integrated in the frame above the navigation bar (''hide_input: true'' for a 100% touch game).
  * On launch, the scenario title appears as a **notification banner**, dismissed by the first navigation.

===== Tips =====

  * Discord and terminal play the scenario with the classic interface: keep explicit exit choices, the frame Back button does not exist there.
  * ''shape:'' on a **choice** (''classic'', ''icon_square'', ''round'', ''wide'') adjusts the reply buttons.
  * The ''test-ui-phone'' demo scenario walks through every screen type.

See also: [[en:ui:presentation|Interface modes]], [[en:yaml:texte|Text and formatting]].

**Join us on [[https://discord.gg/Z63DtVV|Discord Make&Play]]**