DONE Mobile theme improvement suggestion

[Hyper]

I am not entirely sure if the staffs are aware of the mobile theme posts but I have something in concern. I came up with this design idea which can help users on mobile devices easier to read:


Instead of the user sidebar taking around 1/3 of the screen, it would be plesant to use a mini user bar (also expandable for more information) above the post. This can ease the readability on mobile users. Also I have darkened the blue in the spacer between user posts on the right for easier distinguish between user posts.

[Kritter]

You'd probably need to bring this up with the designer of the Emerald Theme this skin is based on.

[Xander]

It looks like the theme uses a Responsive design. That means CSS tweaks could accomplish an improved mobile view.

I'd be willing to take a crack at it, if there is enough demand.

Edit: Spent a few minutes modifying the code inline, here's where I got to:

Attached Files

Thumbnail(s)
   

Me.

[Kritter]

@Xander or @Hypernova, have a word with @VinnyVideo and he might be able to give you temporary Tech Admin status to help improve the CSS for Mobile view. I could probably wrangle it but I reckon you'd be able to do it quicker than me. I've neglected my family enough to make this place pretty :P

[Xander]

@Xander or @Hypernova, have a word with @VinnyVideo and he might be able to give you temporary Tech Admin status to help improve the CSS for Mobile view. I could probably wrangle it but I reckon you'd be able to do it quicker than me. I've neglected my family enough to make this place pretty :P

Thanks for your efforts! The site looks great. (Though, hopefully you aren't responsible for some of the coding practises I was seeing. ;P)

Mobile view seems like a decent place to invest time in 2017, so much viewing is done on mobile these days.

@VinnyVideo thoughts?

Me.

[VinnyVideo]

@Xander If you'd like to help improve the mobile skin, that would be awesome! As a Tech Admin, you should be able to access the templates and themes now. If you need anything, just let me know.

Course clear! You got a card.

[Xander]

@Xander If you'd like to help improve the mobile skin, that would be awesome! As a Tech Admin, you should be able to access the templates and themes now. If you need anything, just let me know.

Awesome! Time to flex mah skillz.

Me.

[Hyper]

Looks like the mobile theme is fixed at this point! Good work Xander!

---

Main Site | YouTube | Bluesky | My OC

---

[Xander]

@Hypernova, @Kritter, @VinnyVideo, Okay, I took my first pass at tidying up the mobile view.

I eliminated unwanted Horizontal scrolling, and implemented a version of what Hypernova suggested. It looks like a big improvement to me. Thanks for letting me do that!

Me.

[Hyper]

Also one more thing: the user CP template is a bit messy. Perhaps a hamburger menu would've resolve the issue?

---

Main Site | YouTube | Bluesky | My OC

---

[Xander]

Also one more thing: the user CP template is a bit messy. Perhaps a hamburger menu would've resolve the issue?

Sadly, that page is built with table elements which means that would be quite an overhaul to fix. Maybe in the future, but for now, the User CP would be best interacted with on a larger screen.

Me.

[PAC-BANZAI]

I don't actually notice the difference between the mobile and desktop theme...

​​​​​​

[Hyper]

Alrighty. Sounds good! Perhaps I can pitch in and code/fix some of the themes as well since I am currently expanding my web design abilities. (I build websites for local businesses recently.)

---

Main Site | YouTube | Bluesky | My OC

---

[Kritter]

Looks good @Xander! I changed the colour that separates posts to make it a bit darker, so each post should stand out a bit more. Might need to take a look at the "thankyou/like" bar that seems to always show on mobile view even if a post has no likes.

[Xander]

Looks good @Xander! I changed the colour that separates posts to make it a bit darker, so each post should stand out a bit more. Might need to take a look at the "thankyou/like" bar that seems to always show on mobile view even if a post has no likes.

Cheers!

Yeah, worth looking into for sure.

I agree that the thread separation could be more visually obvious.

---

@Kritter, there, I made the separate posts very obvious.

Me.

[VinnyVideo]

@Xander Thanks for volunteering to help with this! I appreciate it.

Course clear! You got a card.

[Money]

I have another problem w/ the mobile theme: the topic directory is missing, making it a pain to go back to the forum you were on.

Also the reply page doesnt look great on mobile

Also the member bar/coins look kinda misaligned. Maybe hide them on Mobile? Pic attached.

Generally in terms of mobile skin design I'd suggest looking to The Spriter's Resources' mobile skin: it's super functional and intuitive imo.

Attached Files

Thumbnail(s)
   

[Kritter]

The coin part looks fine until the resolution gets real small. Perhaps it could "disappear" when the resolution gets to that size, like a lot of other elements do.

As for the Topic Directory / Breadcrumbs, I'm wondering if they'd be better served up in the bar next to where it says "Mobile theme improvement suggestion" instead of in the top header bar.

There's room or improvement when it comes to this forum skin / mobile skin but it's a step up from what we previously had, which was no mobile support at all. Baby steps!

[Xander]

The full reply view will likely be difficult to fix, but I should be able to make small tweaks to other mobile issues.

Me.

[HylianDev]

Big shoutout to Xander for making the theme 100x better with one little change. Awesome!