Flarum mobile UI suggestions

JohnP

010101 It’s neat to see the post number change as you scroll... if other things are in the nav bar instead and/or if you try to do something like auto hiding, where do you see the number of posts on mobile? At the bottom?

Agreed, that is an issue with changing to any of the above, and I also like seeing the post counter.

Personally I'm really against adding anything at the bottom, I don't want all sorts of different bars in different places. I think I might be in a minority though.

010101

JohnP I guess a conditional statement of some type could be set up. If on the main page and certain other pages show one bar with certain options. If looking at a post stream, hide the logo and instead show the post counter.

Honestly, I think the mobile UI is almost fine as-is. I mean, in part I chose Flarum because of the nice mobile UI. It’s minimal.

I’d be happy with leaving it as-is but somehow changing the selector menu so that a logo was there.

In the end, I don’t care as long as it ends up looking nice and isn’t too confusing.

010101

A minimal approach. Similar to design as-is but with a permanent hamburger menu on the right (would not change to an arrow on some pages). Profile image could still be out of the hamburger menu if that’s really important to people. Or, that could be a search icon. Or, nothing. Just a hamburger menu. On the left, the logo. Center stays as-is which everyone is used to and works best for the post stream when you have the post scrubber counter.

hrvoje_hr

010101 I think that notifications are must, they are such important factor in using Flarum. Either on top bar or in a potentially bottom bar. One tap behind a hamburger menu is tap too much.

And All Discussions tag filter are not so important to be in the sticky top bar all the time.

[deleted] unfortunately it's not possible with CSS. This is Photoshop...

010101

hrvoje_hr All Discussions tag filter are not so important to be in the sticky top bar all the time.

Maybe. But it is a nice and fast way to get to the tags page, another tag, and in a post stream the post counter is there which I like. Or maybe I’m just used to it and I’d get used to something else. 🤷‍♂️

010101

I was just playing around with simply moving the scrubber menu on mobile down to the bottom as the bottom nav bar. I guess it’s kind of like how Discourse does it. Post counter on the bottom. But, by doing that you open up a lot of space up top for a logo, notifications, this and that. And, it would be fixed, so you never need to scroll to top just to see what post you’re on or which page you’re on. Which I assume you might have to do with a layout that moves it just under the top nav bar. To begin playing around with this, you may simply add this CSS to your custom CSS.

@media (max-width: 767px) {
.PostStreamScrubber .Dropdown-toggle {
position: fixed;
right: 0px;
bottom: 0px;
background-color: @header-bg !important;
}

.App-titleControlt, .App-titleControl > .Button {
position: fixed !important;
right: 0px;
bottom: 0px;
background-color: @header-bg !important;
width: 100% !important;
height: 55px;
}
}

It’s actually really nice the more I test it. It’s really close to your thumb. You are able to effortlessly tap and use the scrubber to scroll through a thread. Easier on your thumb than reaching for anywhere at the top to get to that drawer menu or scrubber.

There is of course a double tap needed at times in iOS Safari because of the silly iOS swipe bar. But, I think most iOS users would understand. It’s one of the prices you pay for loving iPhones. 😆

Eldenroot

Also there is an issue on mobile - sometimes the "last reply" is not displayed because of long username... the time/date should be moved.

010101

Eldenroot Oh. Interesting. I never noticed this.

hrvoje_hr

Would it be possible to implement double tap on post to like? Is that possible on modern browsers?

Or in case of Gamigication extension double tap to upvote or tripple tap to downvote.

tolgaaaltas

hrvoje_hr Wow, actually this is a great idea. But it should be optional.

pupsik

It would be nice if post preview was extended, to fill empty space under Avatar and Reply's to the red lines.

tolgaaaltas

pupsik This will make the user feel claustrophobic imo.

« Previous Page