Can I improve this layout for a better experience?



  • Here I have tried two different layouts for fitting this information inside of my mobile app.

    enter image description here

    The picture inside of the app is actually a video demonstrating what to do. The first (left) layout places the text directly over the video. Some phones are smaller than others, so it will cover up important information from the video. The second layout (right) looks a bit better, but still looks "off" in my opinion, but maybe not. The entirety of the video should be visible, but depending on the size of the phone, the video may be sized down and hard to see as it maintains it's aspect ratio. The video's bottom anchor is set to 70% of the screen while the text is auto sized to fill the remaining space.

    Is this a viable concept? Or do I need to completely restructure how my walkthrough is made?



  • From your design i prefer the left one, i think it's more readable and tidier.

    Follow up to your current design. I suggest you to avoid unnecessary popup, in my solution the demonstrating video showed in one single screen and provide a button to watch video in fullscreen.

    enter image description here



Suggested Topics

  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2
  • 2