Can the in-app toolbar be made shorter?

I get the idea that you want it above the black bar, but this is definitely too large.

Making it a bit smaller would be really nice.

Seems to depend on iPhone model. On a 7 it looks like this:

Exactly - I’d like it to be about that large (or a bit smaller even) above the top of the black bar.

As is, it’s definitely larger.

1 Like

AFAIK that’s not app code, it’s something you can change with CSS. Have you tried?

No, and as I have not personally used CSS before and am currently working 12 hours a day, seven days a week, I can’t really afford to look into it myself.

More than willing to follow instructions though. :slight_smile:

Take a look at:

https://github.com/discourse/discourse/commit/eae22548de4eedad875555e7353b8abfdce2452b

It’s going to be much easier for you to suggest specific amendments you’ve proven to improve matters than just tell us you dislike something.

Personally I think the row is the right height, because otherwise the tap targets would be too close to the bottom of the screen when holding the device one-handed. I don’t have large hands, either.

3 Likes

I’m curious how you end up unable to reach the bottom at any point? The device’s entire navigation scheme revolves around the bottom bar, so you’d expect someone to be unable to reach the top of the phone instead. That’s why the swipe-down reachability feature exists, after all.

I’ll give it a look later, thanks for the link. :slight_smile:

The four icons at the bottom of the app are aligned with the middle of the dock icons on my iPhone X. In that sense @pmusaraj mimicked what the iPhone does natively.

Closer inspection shows that they’re actually a bit higher (although I’m still wanting them lower and will be looking into that later).

Curious, this is a direct overlay - discourse app versus iOS dock from the iPhone X:

In terms of the height of that row, the center falls 6mm above the tap target to return to the homescreen or switch apps.

And this is the iPhone 7 Plus, the icons can be lower here as the phone both has a huge chin, and lacks an in-screen app switching hotspot:

It’s 4mm from the bottom row of the display.

The hit areas on those discourse could do with being taller.

Hit area in grey

Clearly higher up than it seems it should be

Ah you saw my comment before my edit. I think they could be taller?

Looking at Apples human interface guidelines for designing around the screen of the X, they actually carve out this whole region around the home indicator:

On Springboard that overlays the bottom of the icons. I think @pmusaraj as gotten the position pretty close, they could be a few pixels taller maybe, but if people get used to tapping low on the icon they just risk hitting the wrong element entirely.

2 Likes

In the HID there’s a recommended minimum size for buttons.

Provide ample touch targets for interactive elements. Try to maintain a minimum tappable area of 44pt x 44pt for all controls.

https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/adaptivity-and-layout/

Correct, that’s measured in points. The button is 120 pixels tall and 225 pixels wide, at 458 ppi that’s 19x36 points.

The buttons are currently a little small, but 40 points is 14mm/0.56 inches. Can you imagine what Discourse would look like if all the interactive elements were bumped up to that size?

I’m only asking for the navigation controls to be increased.

As you and @orangeandblack5 seem to be asking for stuff which to a certain extent conflicts, I vote it’s decided either by @codinghorror, or a cage fight.

But probably @codinghorror.

4 Likes

To be fair, I am the OP :stuck_out_tongue:

2 Likes

True, how very rude of me.

I’m sure there’s a compromise of a smaller chin and bigger teeth (buttons) :grimacing:

1 Like