Owner review 8: making tiebreak entry unmistakable (2026-10-12)

Status: Draft · Date: 2026-10-12 · Inputs: FvkScoreTable, FvkScoreEntry (flat-v2-kit-controls.jsx), FvkTeamLines (flat-v2-kit-content.jsx), the library §10 ScoreEntry, and sources fetched on 2026-10-12. Audience: Korean club members aged 40 to 60.

Owner, review 8. "For the tiebreak, it should be clear that the user is editing a tiebreak score. Can you do some research on the sound UI/UX practice for something like this?"

0. Evidence tags and limits

W = fetched as text 2026-10-12 (anatomy and wording, not pixels). C = our code. X = not reached, said so. Not reached: Apple's HIG text-fields page and Material 3's text-field guidelines returned only titles (X); no peer app's tiebreak screen was screenshot-verified, only help-centre text; ITF/ATP umpire tablets are not publicly documented (X); SwingVision, DUPR, Playtomic, TennisKeeper and SetPoint have no public text on tiebreak entry (X).

1. Before (C)

At 7-6 a 36 × 36 cell appeared right of the losing team's games (flat-v2-kit-controls.jsx FvkScoreTable, the compact FvkInput). Its only visible name was the placeholder "TB", which vanishes when a digit is typed (the filled frame se-tie-filled showed a lone "5" beside the 6 with nothing naming it). The spoken label was the only complete name.

2. How peers show and take a tiebreak (W)

Source	Label	Position	Wording	Focus
UTR, How to record a tiebreak	"set tiebreak boxes" (help text; box labels not in the text)	A pair of boxes appears after a one-game set score (7-6, 5-4)	The system assumes a 7-point tiebreak won by two; blank boxes allowed for non-standard formats	not documented (X)
Match Tennis, submit scores	A TB column	Beside the Set 3 entry, own column	"Enter the TB score in the TB column beside Set 3"	not documented
Playtomic, invalid results	"tie-break" in rules text	The set is recorded 7-6; points not described	Rules only	not documented
DUPR (pickleball)	none	Game scores only	Corrections only via support	not applicable
Printed results (Tennis scoring system, Junk Charts via search)	The parentheses	After the set score: 7-6(5) shows the loser's points; the long form 7-6(7-2) shows both	Spoken scores omit it	not applicable

Cross-check: two independent sources (UTR, Match Tennis) name the entry a column or box group of its own, labelled "TB" or "tiebreak" in prose; the printed convention is parentheses or a smaller superscript number that belongs to a set. No peer relies on a placeholder, in the text we could read.

3. Form principles (W)

• Placeholders are not labels. NN/g: they vanish on typing (memory strain), make a filled field hard to check, and make a filled value look like a default; "place labels outside the field so they stay visible"; essential hints stay outside the field. W3C WAI: placeholder text "is not a replacement for labels", low contrast, not read as a label by screen readers.
• Small inline inputs keep a visible label. GOV.UK date input: Day, Month and Year each carry a visible label (widths 2, 2 and 4 characters), the three sit in a fieldset whose legend asks the question, a hint sits under the legend.
• Group related inputs. W3C WAI grouping: a fieldset with a short legend for related controls, role="group" with aria-labelledby as the styled alternative. Our table is already a role="group" (C: FvkTeamLines).
• Focus says what you are editing. Apple HIG and Material 3 text-field pages are X today; the general rule (persistent label, hint outside the field) matches the pages we could read. Material's pages name labels, focus states and supporting text as the three parts (title only, W).

4. Recommendation (evidence, decided)

One design, three layers, each answering a different moment:

1. A persistent column label, "TB", in the header row over the cell, 13/18·500 secondary, the same style and row as the set labels ("1세트"). It is a column head like Match Tennis's TB column and GOV.UK's Day/Month/Year, so it is not a lone tiny label owning a row, it hangs on nothing, and it survives typing (the placeholder did not). The placeholder is removed.
2. A live line while the cell is focused: "1세트 타이브레이크, 진 쪽 점수" (en: "Set 1 tiebreak, the losing side's points") in the header row's free space left of the set labels, 13/18·600 ink, wrapping with keep-all and non-breaking spaces so "진 쪽 점수" never splits. It spells out what "TB" abbreviates, names the set, and says whose points go in (the likeliest mistake is typing the winner's 7). It leaves when the cell rests. It is a focus name, not a helper line: the sheet still carries no helper lines.
3. The cell's own focus ring (unchanged) plus the spoken label (unchanged).

At 1.5x and up the set label and the TB label merge into one label "1세트 TB" centred over the whole column, because the cells stay 48 and 36 while text doubles and two labels touched (seen at 200% before the fix).

The owner's ruling holds: the cell stays right of the team that lost it, 36 × 36, 4 apart.

Rejected (and why)

• Printed parentheses or superscript on the cell ("7-6(5)" style): adds about 16 to the column and a raised cell breaks "centred on the first line" and the 44 target; three sets with two tiebreaks already leave the names about 100.
• Spelling "타이브레이크" as the column label: about 78 wide at 13px against a 36 cell; it would collide with the set label. The live line spells it out where room exists.
• Switching the set label to "1세트 · 타이브레이크": 130 wide against a 48 column; collides with neighbours in best of three.
• A line in the sheet's sub: appeal and host already use sub for the match name, and it sits two rows above the cell.

For the owner (taste, not evidence)

• "TB" is the persistent label because it fits; Korean club players may prefer "타이" or nothing. Say if you want another word. The live line always carries the full word.

5. Checks

100%, Korean: se-tie, se-tie-filled, se-three read as intended (labels on one row, caption on one line at 390 with one set; with three sets the cell labels sit over their cells and the names keep their room, caption absent unless a tiebreak is focused). 200%, Korean: se-200 shows the caption on two lines and the merged "1세트 TB". English strings are defined (fvkL) and wrap the same way; no English frame was added.

Implementation

• [x] FvkTeamLines: colExtraLabel, headerNote, merged label from 1.5x, header aligned to the bottom (flat-v2-kit-content.jsx).
• [x] FvkScoreTable: passes "TB" labels and the live line from tbActive; placeholder removed (flat-v2-kit-controls.jsx).
• [x] Frames se-tie, se-tie-filled, se-best3, se-three, se-200 (flat-v2-lib-social.jsx) and mb-o-tiebreak (flat-v2-detail.jsx): captions and spec.
• [x] Library §10 ScoreEntry, tiebreak cell paragraph.
• [ ] Later, in app code: the same three layers in the real score sheet.