Main Menu

Mobile site users! Your input wanted! And actually USED! In real code!

Started by Solari, January 25, 2013, 03:45:55 PM

Previous topic - Next topic

Solari

Alright, it's time to fix the mobile site.

While the code base is being ported, we're going to do this with CSS. There's quite a bit I can change with CSS, and I'd like to start with the messages page. There is one glaring omission on the current mobile site that I will rectify first: the lack of colored message types. This is an easy fix, but I also got to thinking: wouldn't it be nice if we could also improve the way that personal messages are depicted? You're all familiar with the single border on the left side to indicate a personal letter. Well, we might as well extend this to all the other message types. But what else? I can change the color of the heading for each message type (so that a personal request might have a slightly brighter color of green than the message body, for example). We can change the way the border looks. Etc., etc. Rather than impose one particular design vision on everyone else, I'm interested to hear what ideas people have, or have been kicking around.

Solari


Indirik

Two things:

At the bottom of each page, there should be a link that takes us back to the top of the page, so we can get to the tabs.

All lists of links/options (like the Command page) neep more separation above and below the options.

As for visual styles, I'm not too particular. Just make it consistent and obvious. And try to keep away from a riot of colors.
If at first you don't succeed, don't take up skydiving.

Azerax

Post the mobile url just so people don't have to search for it.

Cheers,
Scott

Solari

m.battlemaster.org, but these changes are only live on the dev server right now. No sense in accidentally  ruining everyone's fun.

Gustav Kuriga


Eldargard

Be sure to get the "Save For Later" button to work on mobile. If works 50% of the time on Chrome on Android and 0% of the time on Firefox on Android. When I check in on my cell I usually want mark the messages I plan on responding to so I can easily find them when I sign in on the laptop. It really sucks that this is not reliably possible...

I really like the messages look. the colors and personal message bar look great. I would prefer to keep with the dark color themes though.

Solari

Like this?

EDIT: Well, except I botched that screenshot and didn't include a direct report. Just picture the brighter blue bar on top of the darker, standard report color.


Indirik

If at first you don't succeed, don't take up skydiving.

Penchant

I like it though the personal letter one should be darker as it similar to the OOC type.
"The true soldier fights not because he hates what is in front of him, but because he loves what is behind him."
― G.K. Chesterton

Solari

Quote from: Penchant on January 25, 2013, 10:44:21 PM
I like it though the personal letter one should be darker as it similar to the OOC type.

I was going to change the OOC to another color entirely, or no color at all. We could also go back to a black background for letters, but in using the site with this new color scheme, I've found that it looks weird to read letters without a bounding box when compared to the other types.

Penchant

Quote from: Solari on January 25, 2013, 11:01:09 PM
I was going to change the OOC to another color entirely, or no color at all. We could also go back to a black background for letters, but in using the site with this new color scheme, I've found that it looks weird to read letters without a bounding box when compared to the other types.
I would prefer OOC being what you currently have for letters and simply using a darker gray for letters.
"The true soldier fights not because he hates what is in front of him, but because he loves what is behind him."
― G.K. Chesterton

Solari

Quote from: Penchant on January 25, 2013, 11:16:33 PM
I would prefer OOC being what you currently have for letters and simply using a darker gray for letters.

Will do.


Gustav Kuriga

I would prefer OOC being the grey it is in the normal web browser, and letters be the color they are in the normal web browser. Otherwise people are going to be getting confused.