1

I am trying to build an app and I'm starting with prototyping it, but I am not a professional UX & UI designers (I'm a software developer), so apologies if my question seems silly.

I am starting in the mobile view.

app homepage

The above is built in Figma. That is the iPhone SE frame in Figma which is 320px by 568px (according to Figma at least).

When the user focus on the search, the iOS keyboard will pull up and take a lot of space.

How am I, as someone who is trying to prototype the app supposed to know how much space (in pixels) the iOS keyboard takes?

Figma as a tool doesn't tell me, and when I search for iPhone SE viewport, none of the sites that come up tell me either.

1
  • Not entirely sure but there are as many mobile phones as keyboard apps. Some with suggested words and other features taking up more space. My guess would be they can't. However you could find an ios components UI kit and add the keyboard yourself to see.
    – Martyn
    Commented Jan 3, 2020 at 11:08

1 Answer 1

2

The size the native keyboard on an iPhone SE in portrait orientation is 216px. Here's a mockup of it in the device:

iPhone SE Keyboard

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.