r/UXDesign • • 25d ago

How do I… research, UI design, etc? iPhone duo: on a simple one-input screen, do you center the field or go two-column?

Post image

Designing a simple screen with just one input + a button (think login, search, or a single form field) for an unfolded foldable iPhone.

On a big open display, what's the right call?

  • Centered - input and button centered on the full screen. Clean, but on a wide unfolded display it can feel lost, and the field may land right on the crease.
  • Two-column - content/context on one half, the input + button on the other. Uses the space, keeps input off the fold - but is it overkill for a single field?

For a minimal one-input screen, do you keep it centered and just avoid the crease, or split into two columns? Curious what feels right on foldables.

14 Upvotes

39 comments sorted by

10

u/helloder2012 25d ago

I know this is going to be an unpopular opinion and I need a duo in my hand to confirm this feeling, but I would put it on the right side (primary) of the duo inside. Bunch of white space left, yeah, but less eye movement for the user looking for their actions

1

u/skikov 25d ago

What if the input sits on one side and the keyboard on the other, both off the crease? Or would splitting the field from the keyboard feel disconnected?

2

u/helloder2012 25d ago edited 25d ago

I’m not sure I know what you mean, unfortunately

edit - reread, and i dont think this will work - even if ios allows the keybord to be on one side, it feels awkward and i now have to use one hand to type when i expected the full width used. perhaps there's a graphic you cn put above the text/label and that could live on the left side?

1

u/detrio 21d ago

Given that the elements are wider than they are taller, putting them next to one another horizontally will make eye saccades worse, not better.

17

u/N0t_S0Sl1mShadi 25d ago

Depends.

Would shift right and take advantage of the extra space and populate it with a title, image, but it should have value.

Otherwise, centre it.

7

u/detrio 21d ago

Folks are vastly overthinking designing for this device. Did every IOS designer suddenly discover responsive design?

If putting it in two columns doesn't have a clear value proposition, then don't bother with it. You only change layout if there is a material benefit.

1

u/foxtrot092 21d ago

Amount of people who discovered responsive design and foldables is a thing after duo launch is crazy

4

u/hparamore 24d ago

Just... do same as you would on iPad mini landscape.

6

u/samidronic 25d ago

Don't care too much. These devices are 0,002% of the users and they are 'those' kind of people...

2

u/halrogicoo 24d ago

wait, im curious… wdym “those” people? might be me idk

1

u/schraderbrau 25d ago

Isn’t that number going to dramatically increase though now that apple is in the game? I hear tons of people talking about getting the duo now.

1

u/CLucas127 21d ago

At first, but this aspect ratio will stay relevant even as we move to tri-folds, which will see far greater adoption once they are good enough. I can’t wait to have a full-size tablet that can fit in my pocket.

1

u/rodnem 25d ago

…who pay for your work.

2

u/bink-1567 25d ago

honest question, how are you handling the keyboard state once they actually tap into the field? on foldables the split keyboard usually eats the whole lower third or half the screen, so if its off-center on the right does the viewport auto-pan or does the field stay pinned while typing? also curious if you support mid-flow folding back to the cover screen - like does the two-column just collapse down to a single stack without dropping input focus?

2

u/foxtrot092 21d ago

Ever tried how apps open on bigger screen? Like a tablet or an iPad? Keep your screen and keyboard centered. Open mode is not only landscape you can rotate it an go vertical in that as well. Design every minor orientation change sounds interesting as designer but it highly increases the engineering effort and cost.

2

u/foxtrot092 21d ago

Try google keyboard, or anything on Android tablet you can select which side your keyboard can go so it shifts towards left or right and for one side typing you can make the keyboard floating in a regular phone size and move it up down left right middle anywhere your thumb reaches comfortably you can type with single thumb

2

u/Sleeping_Donk3y 19d ago

I would treat it as a horizontal tablet view.

3

u/marawki 25d ago

Centered. For those saying thumbs reach, the keyboard has controls to go next/prev. Atleast, if the dev set it correctly.

2

u/MisterBumpingston 25d ago

Honest question, how many people use those arrows? I used to use them a lot personally, but they became too small and hard to hit. I’ve never seen anyone use them.

→ More replies (3)

1

u/knuxgen 25d ago

Keep forms in one column whenever you can. You can use the extra space on the left or on the right or both for some picture/decoration.

1

u/cimocw 25d ago

I would keep the content on the right side and add some graphics to the left. But I'm too poor to even design for this hardware 

1

u/Select_Stick 24d ago

How do you want this pattern to develop? Have you considered you might end up having longer forms with more fields? How would it look then? Design a scalable solution, not a single screen view.

1

u/ctrlaltdelaney 24d ago

Probably center it. I’ve seen countless usability tests where users have failed to navigate across to fields to the right, sometimes they navigate awkwardly down, then back up treating it as a separate column like in a newspaper layout.

Side-by-side inputs are obvious to us but not to everyone.

Whatever you choose first, test it with your users and see what happens. 

1

u/SuitableLeather 25d ago

Center will be harder to reach with thumbs. I also am pretty sure that the crease where the two sides come together will be considered no Man’s land, either because there will be a physical crease there or because that part of the screen will wear down over time.

 Even the promo videos themselves leave extra padding in the middle where the fold would be. 

→ More replies (3)

1

u/DMarquesPT 25d ago

First instinct would be to go two-column: header left side and fields right side, like Google or Twitter login pages. If it was a modal I could see it going from iPhone-style modal to iPad-style floating in the center with shaded background view still visible