Give max size to the board

Thanks.

Meanwhile i checked our sente app and well, there, the goban is perfectly sized whatever coordinates or size. (But you can’t change the coordinates on the fly, you need go to the settings page)

Playing around with it a bit in the Chrome inspector, it is clearly adjusting itself to be a multiple of 19px that fits within its container:

image

but the container itself has an 8px margin on the right:

image image

The result is that it might be as much as 26px too small:

image

And anyway px have nothing to do with device pixels so this feature probably isn’t doing anything useful on high resolution screens, which is most screens these days.

7 Likes

I used to never play on OGS by phone, and only rely on my computer to play on OGS, because of this. Not only are there margins on both sides of the board on my phone’s screen, but also, when opening an OGS game on the browser on my phone, the board gets resized several times while the page is loading, before it finally decides on its final size.

Then I found the Android third-party app, and I’ve been using that. The goban is displayed directly at the best size, without resizing several times and without leaving unused margins on the left and right.

You call it a “minor issue that only he notices”. I call it a “I’d rather not play go on my phone at all than use this interface” issue.

I never thought about posting feedback about this before, because I had concluded “the OGS interface is simply not meant to be used on a phone”. I didn’t realise this was an issue of not using phone screen size efficiently; I thought it was an issue of never having been designed for phones at all.

Apparently I’m not the only one to have reached this conclusion, since two people took it upon themselves to write third-party apps for Android and iPhone entirely from scratch.

I don’t see any “bullying” in Groin’s post, which points out an issue with screenshots and appropriately comments:

“On mobile, each mm is precious.(it’s like 3 here!)”.

5 Likes

I won’t be that extreme because it’s not the first thread i opened on UI design for mobile and i met motivation already to improve it between developers.
But few years later (as @Feijoa pointed it vs lichess or you vs 3d party apps) OGS is still sadly lagging behind other go servers interfaces. It seems that aligning boxes to the best place and dimension is a challenge not yet perfectly solved for OGS mobile users. And the game page with its goban the perfect place to start fixing it IMHO.

1 Like

What other Go server has a better mobile web interface than OGS?

1 Like

Hey ! I didn’t say this. I love OGS interface, I’m only pointing the floating goban with approximate size, which is really an exception in the go mobile web interfaces! There are few similar problems which were already pointed in other thread like different size of avatars but let’s put it step by step.

I think we could take inspiration from ShinKGS and GoKibitz, although the latter has even wider margins than OGS!

Oh yes these two have well centered goban but quite not max size. OGS may not be the worst :laughing:

1 Like

The approximate size may be important. As I mentioned above, the reasoning behind this is to avoid variable width of grid squares and ensure lines stay within a pixel.

In contrast, if you look at govariants.com, our boards have exact width, but the lines are noticeably blurrier. Similar with BesoGo which also uses SVG.

Go Variants

ShinKGS seems to have the lines right. I’d be interested to know what the difference is. And… their star points are off.

Screenshot 2024-02-13 at 3.17.05 PM


All this to say:

Centering: EASY, we should fix this.
Approximate size: this is a feature. If we want to change it, someone should demonstrate a better alternative. (doesn’t need to be integrated into OGS website, just needs to demo in some web environment)

That’s in the OP: take that screenshot of the IGS/Pandanet i put there.

You can have have a look on the sente app goban and stones too. Not bad either.

emphasis on web!

Also, the lines look blurry in that screenshot…

1 Like

I m sorry I had a guess that “web” is at the origin of the difficulty, I’m just a user not a technician and hope we could get the same quality on the screen.

Interesting although i never noticed that before. Gonna have a better look on this point.

Sorry, I looked closer, I think the lines are exact. Maybe I was seeing artifacts from just the jpg.

So I think this tells us that a tradeoff is possible, but not how to implement it. I will look closer at this screenshot to see if I can find hints at what they do.

Screenshot_2024-02-14-00-42-55-00

checked and really don’t see any blur so i think that could come from the screenshot itself as i noticed some aliasing in the process of reframing. on that zoom up lines look very clear.
Well again looked even better before posting… Let you get your opinion by opening this app yourself :blush:

1 Like

O thanks! I hope something can be done.

1 Like

Maybe I misinterpreted this?

1 Like

Okay, so I looked closer, and it looks like the math is this:

  • 26px between grid and edge of board (well for some reason, there is a line of black on the right side, but lets ignore that and pretend it was centered)
  • 2 px per line
  • 35 px per square
  • altogether this adds perfectly to 720px screen width

This makes me wonder if Panda varies the edge width (in this case, 26px) depending on the display size. I think that would be a reasonable thing for OGS to do, but it doesn’t make the grid any bigger.

I can check a screenshot on my own phone (hopefully a different resolution) later tonight, and confirm if this is how they are making it work.


O thanks! I hope something can be done.

Yeah, tbh this goban-resizing-based-on-lines has been a pet peeve of mine for a while, but haven’t been sure what the right thing to do is.

1 Like

I think so because from the very beginning I’m talking about that goban, sorry if i didn’t mention it again and precisely.

Looking and comparing again I see this:

the goban is taking the full size.
There is spacing between the stones on the edge and the edge of the board.

OGS has that problem of floating, not aligned too, especially clear on the next screenshots in the thread. Sometimes on the left, sometimes on the right. I left intentionally a piece of the names frames…
And I noticed that it looked linked to the use of the switch of coordinates (in the same game page), without refreshing so maybe this could help?

1 Like

Oh and back to @stone.defender suggestion, if you succeed and still have some spare time, there is still that landscape view which looks even more a nightmare to reconfigure.

my first question would be if it’s possible to reserve a left part for the goban with nothing up and nothing down? like no browser bar(s), no OGS bar etc… ? so that a goban will then fit well (max size) in it? i’m not sure i will ever use this landscape view myself so I mention it because it already exists…

i add a screenshot because things may vary by users (different browsers etc…) but, sorry what a nightmare of screen usage!

2 Likes