Why Vertical Interfaces Are Difficult

Each challenge is an open Discussion on GitHub. I merge the strongest answers into the spec.

01
MotionOpen

Should a sheet animate from screen geometry or reading direction?

In a horizontal interface a bottom sheet slides up, matching gravity and the screen edge. In a vertical, RTL interface, dismissing toward the bottom-right fights the reading direction. Which axis wins?

SheetDialogToast
Discuss on GitHub
02
TypographyPartially Resolved

How should mixed CJK and Latin content behave in the same column?

A verse reference like 「창 1:1」 mixes hangul, an ASCII colon, Latin digits, and CJK brackets, each needing a different orientation. Unicode defines orientation per character class, but browsers and operating systems disagree.

VerseText FieldVertically Verse
Discuss on GitHub
04
InteractionOpen

How does text selection work when reading flows top-to-bottom, right-to-left?

Click-drag selection assumes a left-to-right baseline. The OS selection rectangle has to track RTL column order, column breaks, and tate-chu-yoko groups that behave as single units.

MarkerHyperlink TreatmentVertically Verse
Discuss on GitHub
05
IMEOpen

Where does the IME candidate window appear when input is vertical?

Input Method Editors show their candidate window horizontally by default. In a vertical context it must not cover the composition point, but the platform IME API rarely gives enough control to place it correctly.

SearchText FieldCJK Input
Discuss on GitHub
06
AccessibilityOpen

What do the arrow keys mean in a vertical, RTL interface?

In a horizontal interface, arrow keys move left/right within a line and up/down between lines. Vertical flips that: next character is down, next line is left. The keyboard model has to remap them or users lose their place.

TabsSliderPopover Menu
Discuss on GitHub
07
InteractionOpen

How does drag-and-drop reordering work when list items are columns?

List reordering assumes a vertical stack of horizontal rows. Here the list is columns flowing right to left, so the reorder gesture flips: left-right drag changes position, not the usual up-down.

Vertical List CellVertically To-do
Discuss on GitHub
08
AIOpen

How should AI chat interfaces adapt to vertical writing systems?

AI chat UIs are built around horizontal bubbles alternating left and right. For a CJK user reading vertically, that pattern feels foreign. What would a native vertical AI chat look like?

MessageText Field
Discuss on GitHub

Bring them into your project

Use them in your own project. Open source on GitHub, MIT-licensed.

npx verticallyworks init
View on GitHub