-
Notifications
You must be signed in to change notification settings - Fork 347
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
miniautomatch for overview page #2352
Conversation
attempt at brining a minimal version of the automatch to the homepage.
Uffizzi Ephemeral Environment
|
Note - the same component can be styled in different ways - CSS is cool like that!
|
Oh I see what you mean, because we have a div for the overview containing everything. I wasn't thinking about it like that :) So I suppose if it was chopped out, which I don't feel confident to actually do :), then it can have a style file in its component folder which can specify where it is, overview/play etc and then style appropriately. |
I think this idea is worth exploring more. The ideas and thoughts below are for discussion not really "this is how we should do it". I've grown to not really like the home + play page system as it currently exists, it's just hard for me to reconcile all of the pertinent information and come up with something elegant that doesn't suck for a large portion of our user base. I think on the home page it would probably be good UX to have buttons start a new computer game and a new game against a player. Furthermore I think those buttons should always be there, even if there are correspondence games going on, unlike what we currently have. My gut says when we click either of those buttons, the user should then either see a modal or be navigated to another page for more settings. For example, when playing a human, I could see a modal that is basically everything in the automatch box sans the "Computer" option For computer I could see the same computer modal popping up (although I would love to have a simplified version of that as well, but that's a whole other topic I think.) That said, as I mentioned I'm not really happy with the home + page setup as is. They're by far the two most used pages (outside of the Game page), and folks go back and forth between them, indicating to me that merging them would be good - but making any sort of unified interface that isn't even more overwhelming seems like a tall order. 🤷 |
So I suppose for the moment the home page as it is, removed a lot of the overlap that it used to have with the profile page. Now really it's main focus is just showing your correspondence games if you have any, and then links to thinks that the new nav bar already provides. So the main overlap is still again with the profile page, which shows your ongoing games, your tournaments, ladders, groups, which are also shown under their respective pages (groups ladders etc). I think I've had the experimental interface changes on since before the new nav bar was a thing, and I don't miss anything that was on the right hand side, tournaments, friends list etc. If we do away with the home/overview page, the main thing is where do we send players, and where do we show ongoing games if any? Some possible ideas: Watch/games page
Basically a number of things like this could make the Watch/Games page attractive as a home page. Play pageI think it might also be a fine idea to have the play page as a home page, assuming that's what people want. I'm not sure what the best way to simplify the page is for newcomers, either beginners or experience players.
Other optionsSince you mentioned something about a modal, one could consider having a mini automatch as a modal or some kind of dropdown like the way friends, notifications etc are on the nav bar. I'm thinking either
I don't know exactly what the best is, I just know that the homepage is a regular complaint from people that don't play correspondence, and I've seen people get confused by the play page a lot. |
Yup, complicated and lots of options sums it up. I don't have the design energy myself to work through a comprehensive refactor of those pages, but I'm open to attempts. |
A total site overhaul has been a dream project of mine for a while, but life has been crazy last couple years. Maybe in the next year I'll be able to approach it. Since you want to do a full overhaul anyway, but that's a long term goal and complicated, would you consider at least merging this PR while the other options are discused? |
I'm ok with working towards a smaller goal |
Do we have a checklist then for what would make this PR mergeable? Maybe a series of tests or things to check generally in the code. Like I mentioned it's mainly some copy and paste and then fixing various dependencies, importing missing things, functions etc. A bigger overhaul like trying to refactor and extract the automatcher into a separate component, I'm not sure I would be able to do. Also there's the worry of breaking a functioning automatch, as opposed to introducing a beta mini automatch while still having the old functioning automatch as a backup. |
For the UI we need to iterate. I'm open to alternatives, but here were my thoughts from up above on the matter:
Basically I think my complaint with the current setup is it's not going to be consistent (ie when there are games going it's now going to be a different flow to find a new game), so it's going to be confusing, However it's also too big to be consistent, and it also doesn't offer everything we need (computer play for one, and for a first time viewer there's no indication that they could hope to find a correspondence game on this server). Hence my thought about a couple of buttons to on this page or something of the sort. I'm open to alternatives, just photoshop up something so we can talk about it kind of thing before a lot of effort is spent. |
My feeling is that the site is fine for correspondence, there's no real rush to create a new game, you can spend time finding the settings you want, or creating a game with those settings. You can seek out opponents on the sites main ladders or ladders within groups. You're not really expecting a game to start and to start playing right away anyway. The complaint I've mainly seen has been on the live games side of things. Anyway I'll have a look at adding in a computer button and adding in the automatch button even when correspondence games are there. Tbh it might even be easier to just do it in code, than to figure out how to photoshop it or download something like inkscape or gimp and so on. In terms of first time players - I think maybe we could modify the dismissable popup message that links them to the learn to play page. We could add in a link to the ladder. There is a link to the play page anyway. I'll think about it and post some updated ideas. |
For instance, the button for playing the computer doesn't really make sense logically as being part of an automatch system, because it's not an automatch at all. Rather instead you're picking an opponent. I get the idea that it's there because it needs to be somewhere but maybe it'd be better to simplify even the challege modal in that case. There's a few too many options to have to think about if it's your first time on the site. |
adds correspondence + computer buttons with a link to the play page. Tried to simplify the computer challenge options on the home page by taking out all the time controls
Here's kind of update, with what I have in mind for what you're saying ^^ buttons for correspondence and computer challenge and a link to the play page. Also I've edited the messages for when you have no correspondence games, suggesting to go to the play page for more game options. Similarly at the bottom of the automatch. The message that pops up when you click the correspondence automatch is also updated suggesting to go to the play page to cancel it. ^^ This is maybe one idea to simplify things for the computer challenge. Obviously people might want more options at some point, but my feeling about this homepage, and mini automatch should be that it's main focus is getting a game with some default settings, quickly, with minimal clicking. If you want to spend hours learning and trawling through all the settings you can on the play page, but if you just want to click a button to get a game vs a human or computer it should be simple if you don't understand or care about the settings. The issues I have, is that I couldn't quite see how to reset the options in the modal. Normally you tweak clock type or game speed or whichever and then some functions are called which check for sensible values and check for cached ones and so on, and there's fallback. I couldn't think of how to force certain fixed settings for the computer play (which again would even be simpler) than just taking whatever you last played against the computer on the play page. The plus side of attempting the code over some photoshop is that at least maybe someone else could work with it if they have ideas to change it :) Someone will know how to make the css prettier. Several people have tried photoshopping and that got buried in the forums :) |
Was toying with gimp with @GreenAsJade and we came up with this as a possible alternative Any feelings one way or another towards that direction? As for the computer challenge, I'm in support of simplifying things in general but I also want the challenge modal to be consistent no matter where you launch it from, so I think the easy case is to provide the normal computer challenge modal, and if we ant to simplify it, redesign it to simplify it for both places (but keep the time options and whatever else was cut out somewhere that can be accessed kind of thing, or however that ends up working). If there's going to be a redesign, that should probably be a separate PR. |
Undo changes to the mini challenge modal, and update the css to reflect the image on github. Also updated the experimental overview page, for those that have it on in settings.
I've updated the overview page and the experimental view page to reflect the alternative @anoek and @GreenAsJade mocked up. I've removed the changes to a mini computer challenge modal. It should look like this now for the old interface and for the new experimental interface It seems to be working okay in terms of getting matched up. The more options link just links to the play page. |
by extracting mini-automatch into component
forgot to hit save on overview.styl when it was extracted to MiniAutomatch.styl
I think it'd be worth testing and posting a screenshot of what it looks like with some invites active. |
Looks good for that layout eh! |
In fact, with the gumph from the right hand side put underneath instead, I think there's an argument for including it in the web view. I think it looks very messy on the right, as in the "not experimental" screenshot. But if it were layed out horizontally perhaps as a separate section under the boards in web view it might be nice... |
In undoing changes, lost the pause on weekends button because of a || null still hanging around.
It was a good mockup design :) I think I currently have the buttons as space-between, but other options will probably align them to the left side of the page or collapse the space a bit. I guess there's some little things like that that can be decided and tweaked. I just fixed an issue where I didn't revert changes in the ChallengeModal properly, it looks like the only changes left there are a couple of blank newlines and a commented out |
I think I like the buttons on the top better than the bottom. For the button spacing, I think it's probably good how it is. Certainly open to exploring left justifying or bounding the width of those so they stay centered and not too spaced out (I think adding the |
I have a few comments in response.
I think this is really interesting, the design principles. I do think that 4 games and 4 buttons is a very special case. It seems coincidence that something might line up for one user and not for 10,000 more so it seems strange to attribute any meaning to it.
I mean for me it actually makes sense. Firstly the active games are correspondence games, people that use the home page for correspondence, I would argue are probably less interested in starting many consecutive live games (there's exceptions), but I mean they probably want to see their ongoing correspondence games, the ones where it's there move as a priority over automatch buttons they're not using. Secondly, the automatch on the home page, really initially is to cater for live only players. This is where it has been heavily requested because if you don't play correspondence the home page is completely blank barring a find a new game button linking to the play page on the experimental view, or in the standard view just a link to profile, tournaments groups etc - it's like a second visual nav bar. Of course though for consistency the automatch probably should be there for both types of players, I would think below the correspondence games instinctively, but to be honest given that I don't know how many correspondence games the average user has, probably it is best to be above the games.
And this brings me onto the next point. It looks fancy to incorporate the automatch into the games list when there's 6 games, but what about when theres 100 games, or 600. There's different kinds of players, some play one or two correspondence games, some will 8 games from a round robin tournament, and some will have 20, 100, 200, 1000 simultaneous correspondence games, and we don't want the ui to be completely broken for them either.
Design principles aside, I suppose it doesn't bother me that invites and open challenges are front and centre. Most of the time, particularly games invites are going to be temporary, and you want them to be as easy to find as possible. Sometimes people struggle to understand the avatar or notification icons in the top right, how they have multiple functions, but having these things like invites and the open challenge link incredible easy to find, and temporary take up space is probably a good design for usability and accessibility in some sense.
I do appreciate the time you put into picking apart the different versions. I don't really have any UI training, and my css skills are a bit minimal, I've tended to try the minimal things that work. It's there anyway
This link should work also to preview it, and things like css style and alignment can be tweaked in browser. If we remove all kinds of alignment, margins, and the space between option for the buttons for instance it looks like It's all aligned but it just makes me a bit uncomfortable or something. Center aligning feels better if we want to remove space in between the buttons say. But again I don't really have a massive preference, it's just going off of feeling. |
No problem I appreciate the discussion and ideas.
Even if it does, I would say it’s very likely to be <0.000001% of players that even use the home page for live games. I’ve seen people use multiple windows when playing simuls, so not even in that small use case do they use the home page for this. I think for live/blitz only players the only time they see the overview page it’s blank unless they accidentally clicked it while in a game. So I don’t think there’s a real dichotomy problem here. The automatch will likely be the only thing there for a decent number of players, so the real question would be, is it in the way for correspondence players for looking at their games. Which goes into the next point, which is that you’re only considering one particular view of the Home Screen which is when the number of active games is small. Typically when players have more than a certain amount of games the games view switches from mini gobans to list view so whatever alternate solution you’re proposing would also need to work in list. I think trying to incorporate into the games list itself is just going to be over complicated and it will need so many special cases, for screen sizes, list view vs goban view that it won’t be unified or worth it. At least as I mentioned if it’s above the correspondence games it won’t be nudged down to scroll oblivion for some players, it will always be in the same spot. If you have 10+ games in goban view or you adjust in settings to show a lot of gobans (it’s in general settings to toggle the number - but the average user may not know this), you’re probably going to be scrolling a lot to see them anyway. There’s probably some edge cases where you can have a huge monitor and show all the thumbnails somehow, but I don’t think the design can assume this view, and not scrolling, and not take into account list view etc.
Sure it probably is good if they’re compact or square or tidy, I don’t exactly know. I do think it’s quite a minimal case to have several existing open challenges. Maybe I’ll have one open for a few minutes once every few weeks for a league game.
Yeah, I’m sure there could be a big rework of the overview, play pages, watch/games pages. One could include subsets of different components on the home page to make it a one for all for everyone. You can see some design suggestions on the forums.
I think I can understand that, in isolation it might be ok, but fitting with everything else it can become chaos.
I was thinking about a toggle between correspondence game view and the automatch, it was kind of my initial thought, but then there’s some cases to think of, like maybe it should default to the automatch since when you sign up as a new user you have no games. If you have no games maybe the default should also be to the automatch, but it’s was a layer of complication on top of just extracting the automatch code so I didn’t try it yet :)
I have thought a little about this one as well. I was thinking a modal component that could be on the nav bar like friends notifications and so on. The plus side is maybe you could start a game from anywhere on the site. It’s one of those things servers with clients can kind of do, if they open a window for a new game, you close it you’re back to the default home view and you can start a new game. In any case though, I think one design priority should be to minimise the number of clicks to start a new game, particularly for live and blitz players. If you’re new to the site or if you have the home page bookmarked, you want a game in one click if possible. So automatch live or blitz, straight away queue for a game with one click. I think it’s something people tend to praise about lichess’s home design, click one button on a time control you want you get a game. Chess dot com maybe you’ve to go to play page first but generally not too many clicks to start a game. I don’t think we want to hide it behind any more pop ups, modals, options and settings than we need to. That’s at least my personal motivation at the moment from reading multiple threads and other conversations in person. |
Yeah the list idea makes more sense for starting a new correspondence game, which is less the point of this thread. If it involves putting those bulky buttons above the games I think this is a step backward. There's already a whole site page devoted to starting games. The only case I see it as an improvement is if there are no games. In the top nav with a modal seems smart. Site-wide, always available, not in the way. Only drawback is the nav bar is often crowded depending on the screen size. If anything is worth it, starting a game should be, though. |
I think the problem we have compared to lichess is that we have at least 3-4 times the amount of time settings types that they have. If lichess’s time settings are confusing to beginners, imagine OGS - it’s not just Fischer to worry about it’s byo-yomi, Canadian and simple, which sounds simple but it’s not self explanatory. It doesn’t say there’s no increment, or what happens if you submit early and so on - it’s just implied by the time per move option. So I don’t think offering a big modal is beginner friendly, if that’s the angle we’re thinking of. I think a couple of buttons, and a clean way to get across what the time settings are would be good (of course we still have the issue that you might be playing any of 3 different time settings in the automatch anyway…). I do agree that the board as the create new button is intuitive and very nice looking. If someone wants to take over this I’m happy enough. The attempt at coding was to see what might work, and how easy it would be to get the automatch from the play page. Possibly it could even be extracted entirely as a component, e along with the create button that brings up the challenge modal, it’s just there’s multiple interactions between it and the lists of games on the play page that probably need to be managed and I’m not so confident on that part. |
For sure, to be clear I wasn't advocating for that grid, I was just correcting myself because when first landing on lichess I no longer saw the grid and thought they had moved to the button and simple modal, as sort of a signal that maybe they found that superior. But then they also have the grid, so 🤷♂️. |
I'm happy to admit that the idealism of the “add to list” style goban was a bit impractical. The model was fine but it missed the intent of this topic. I still completely disagree that we should have a quick match feature above games on the Home page. It steals the action area from the topic of the page: games. I do think it's a great idea to have the auto match panel present when there are no games. @shinuito nailed it though. What we really need is to rethink the Home and Play pages as a full UX rework. Adding an automatch panel to Home is a stopgap, but it waters down one of two views which currently have clear intents (ironically you go home to Play and Play to create). One step in the direction of this refactor is to hoist the new game functionality into a modal launched straight from the menu. It is, after all, an action more commonly used than many pages. So in short: sure, let's try an automatch in the Home page when there are no games, but know that there's also a bigger refactor beginning to gain momentum. |
I actually really love the idea of renaming "home" and "play" as "my games" and "new game", that feels like intuitive way of solving the "new users encountering a blank page" problem. And maybe then the renamed "my games" could also include a link to users entire game history (profile page only has the most recent 5000 games) and some cool stats like what gotstats has (or just a link to gotstats if Chinitsu will keep that place running forever) |
Some cool ideas. Definitely leaves room to iterate on what the ideal games page would be. I would think “My Games” should stay as focused on possible on just playing, and that maybe we could improve the user’s profile area to show deeper stats if we want to. That’s just my hot take though. Haven’t done any digging yet. For now the aim is to put this reorganization in experimental. I just need to draft it up first...! |
This pull request has been marked stale and will be closed soon without further activity. Please update the PR or respond to this comment if you're still interested in working on this. |
This pull request has been marked stale and will be closed soon without further activity. Please update the PR or respond to this comment if you're still interested in working on this. |
This pull request has been automatically closed due to inactivity. Please feel free to re-open it if you still want to work on it. |
I don't think I have the capacity to redesign the entire home + play page so I guess this pr will stay closed, unless we accept that we can make small improvements to the home page, even if in some year(s) time, there may be some plan to redesign both. It was worth a shot anyway. |
I certainly appreciate the effort @shinuito, I know the decision is a disappointment to you, and I'm sorry about that. |
attempt at brining a minimal version of the automatch to the homepage.
It was a request I've seen come up in a good few redesigns of the homepage as in
https://forums.online-go.com/t/how-intuitive-is-ogs-for-new-users/31614/107?u=shinuito
and
https://forums.online-go.com/t/new-landing-page-idea/46491?u=shinuito
Proposed Changes
Current version of the overview page for a user with no games - e.g. a new user
demo-version with a mini automatch
It seems functional in that I've been able to automatch between different accounts on the beta server, but I'd like to mark it as a draft for now, because it's mainly a cut and paste of some of the key sections from the code on the play.tsx page and play.styl file.
I'm sure it'd be better to do some refactoring rather than duplicate code, but then maybe having a mini-automatch as a separate component might even be better (it can be modified, styled independently).
Why a mini automatch?
I've seen it mentioned before that the play page is a bit cluttered and hard to understand, and the custom game options too, it's a lot of setting and options to digest especially if you're new to the site.
So it might be handy to just have a minimal two buttons to click to get a game, no messing with settings or details, just queue up and play.
I've intentionally left out the correspondence and custom game buttons, because you probably will want to actually pick those things yourself intentionally so it's better to just go to the play page and have all the options.
Here it's just for people that don't really care, will play the default settings either because they're ok with them, or they're just new to the site or to Go, and just want a game without thinking too much.