Width of mobile version ( Looking for feedback )

Need help
1

Hi Guys,

I have just finished doing the mobile version pages of my site and would appreciate if you guys could test it out and tell me if the width of the pages is too small/too large.

If anyone would like to try it out you can go to www.yallaparking.com

Also if anyone has any info on page widths that are good to use for mobile versions, I’d really appreciate the help.

Is there anything we can do to combat use of the site on both mobile and tablet devices, ( I’m assuming that if you set the width for mobile, it will be too small for tablet and vice versa?)

Many Thanks, Craig

1 Like
2

Have a play here.

http://mobiletest.me/

(Or Chrome Developer tools can do it).

What you probably want to do is create a separate mobile page. If you look at the page settings you can redirect to a different page if on mobile.

3

Excellent job Craig. Love the product! You will do great!

1 Like
4

Hi Nigel,

Again, thanks for the information, will check this out tomorrow and have a play. Will let you know how I get on.

Fingers crossed this mobile responsiveness bubble is working on isn’t too far away!

Cheers

5

what width are you using? im using chrome on an android device and it only stretches just a little over half the width of the screen. almost half of the screen is just white

6

Hey man well done on the site!

I am on iOS iphone 4s - unfortunately the home page does not take up the whole screen
The “list a parking space” page is better in terms of taking up more of the screen.

Also I was able to look at the “list a parking space” page once; I clicked a button, i think “more info,” on a parking space - the popup went beyond the perimeter of my browser screen, and was not fully visible.

I use 380 x 640 (mobile) pixels… seems to pull it off on most of the devices I have tried

Now:
Some observations (coming from an obsessive UI hound; so take with a grain of salt)

  • I would consider allowing users more access to the site; I was prompted to sign up much too soon. I think if a user is able to browse the parking spots you have to offer/ plus your service; then and only then will they be incentived to actually sign up. Having to sign up first - and finding out what the app actually does second is generally pretty unappealing from a users perspective.

Also rather then saying:
“Rent a used space from a neighbour in your building or area. Alternatively, earn money renting yours out to a neighbour in your area!”

I would say:
"Rent a used space from a neighbor in your building or area, or earn money renting yours… etc etc

  • i think it flows better.

And the captions in “renting a space” are underlined while the caption in “listing a space” are not underlined (also one of the S’s is lower case…)

Under Book and Confirm - it says “…one of our team to collect…” – I think you should say “someone from the team” or “one of our team members”

Also looks like the How it works and Get started buttons are not actually necessary - if anything they are slightly confusing because if my page is already scrolled to the bottom and I click “Get Started” nothing happens… because i am already looking at the “Get Started” section…

OK. That’s my thoughts. Do not overthink or take anything personally. If there’s one thing I’m good at, its fussing about minuscule details (i do it with my own app too)

I think you will do very well. If there’s one thing those expats and sheikhs need, its a place to park their baby blue color Rolls Royce haha.

Good job on the site/concept!

PS: I just looked at your desktop version, it looks really good!!

1 Like
7

Actually. You do give a sufficient teaser, before prompting a user to sign up. So, I withdraw that comment - mind you my specific experience did seem to prompt me with a sign up pop up, in a clunky unsuspecting sort of way.

Its a good project though! I cant stress that enough.

This damn OCD; I think I need to turn my devices off for the night… :laughing:

8

I have the same issue as @denverdave11
I’m using Chrome on iphone 6
I bet you have some hidden elements on the right side of your page that’s why the browser thinks there is something to show there and doesn’t stretch the main contents up to the full width
or you might have forgotten to reduce the width of the header/footer or other elements which are sticking out of the main page

9

Hi guys, thank you all very much for the feedback, I really appreciate it, what an awesome community we have here!

@denverdave11 & @levon

I set the width of all the pages to 375 as mixpanel was showing me that this was one of the most popular widths that people were viewing on. I would be happy to change this though if you guys have more qualified insight.

There was a hidden shape that I had forgotten to move within the page width. Hopefully this has solved the issue with the half blank home screen!

@jordanfaucet - dude, thank you for the feedback. Don’t worry it is never personal!

  • I have used 375 width, does a 640 height create the effect of a full screen “stripe” if you will.
  • I have added in ‘or’ instead - one question, would you put in Bold or italic etc to make it stand out so readers are more likely to read on.
  • Thanks for the heads-up, I had forgotten to change the underlining in the hidden group. Silly me!
  • I will have a look at the popups and spend today changing them to fit the mobile pages…Hurrah (hurry up mobile responsiveness!)

Where can i find your app, would love to check it out!

@NigelG - thanks for the site, checked it out, very useful resource.

Thanks again guys!

10

it’s better but there is still a small margin from the right edge. I guess some other hidden shape still needs to be corrected.

11

Okay, thanks for checking it again. I can’t find another hidden shape, possibly my page width is too small?

12

i think the browser should stretch it anyway, so there should be something else hidden there, I guess ))

13

Ah good! Its sometimes difficult to judge a persons tonality through written word; I am the type of person who will play around with the transparency of a buttons border for half an hour haha!
So I could arguably be perceived as a little extreme :joy:

  • 640 height may be more applicable for my app, its true that your page is lengthier. I wouldn’t worry about the height. I checked your mobile site this morning, the width is already much better.
    I would recommend going up to 380pixels (for me that works on iPhone 4s and iphone 6…) - If you do go 380 - make sure you center the main parts. You’ll likely achieve a full screen - and if you center your main elements (that orange background for example + text) - things wont get cut off.

  • I think the “OR” is good how it is - capitalized works pretty good. I don’t think i would use bold in that instance; Italics could be pulled off though i think.
    I don’t like the comma after the OR though - I think its comma overload. :relaxed:

Ya fiddle around with the pop ups - If there is one added piece of advice I can say: Rather then having the mindset of wanting a desktop version to compress responsively to a mobile version (which is not the wrong perspective necessarily) - view your mobile version differently… Its a very different experience - users are in a different mindset when looking at a phone as opposed to sitting comfortably at a computer.
Some mobile sites need much bigger buttons - things removed entire - or sometimes assuming a designer can pull it off - the experience altered noticeably different.

Responsiveness is not always the answer. :slight_smile: (a good tool in some instances though…)

As for my app! I can certainly share with your and the Bubble community once I am more happy with it. As you may be able to infer - I have a certain way of doing things and I just recently (2 days ago) hacked a part my app for the 3rd time in an effort to simplify and master the confines for of the mobile screen haha. I’ll share it with you in the near future.

Cheers,

  • Jordan
2 Likes
14

Thanks for all the help Jordan,

Definitely going to change the dimension to 380 when I have time to do so, over the next couple of days.

Will think about what I want my mobile users to experience as well. As I have just launched I haven’t yet had to the chance to gain a lot of insight into customer perspective or collect feedback. Will be interesting to see if my mobile users want a completely different experience.

Well looking forward to seeing your app, remember though, “if you launch a perfect product, you have launched to late!” :wink:

Cheers, Craig

1 Like
15

That is awesome that you quoted that haha!
I agree with it, but its damn hard to actually act on it sometimes! :sweat_smile:

Thanks Craig.
Your going about things in a good way!

Cheers

1 Like