I'm in the middle of building some drafts for a future web platform for boardgame players. As I have a design question, I just discovered this web site, so this is the first time I post here.
I will be using Material Design but my question is unrelated. On the following screenshot, I display a list of search results (be tolerant: I'm not a designer, but a programmer, and I still need to design things by myself). My question is about the small part that shows a few meeples (the small gray characters). But before here is a bit of context:
The web site is about buying board games by sharing the costs. Once a boardgame is purchased, let's say by 4 people, it will be shared by them by using a booking system. This falls within the sharing economy.
So, that said, when a player starts the purchase process, he has to indicate how many members he wants in his circle for this game. In the first example, a guy wants exactly 3 partners. In the last one, 3 to 5 players are desired. The dark meeples show the number of members who have already chipped in.
Although I show you a draft, I think this is not an optimal way to present the information. Check, in the last example, I had to shrink the meeples... I don't know the theorical max number of partners yet. If this is, let's say, 8, it won't even fit in the rectangle area.
What I would like is: - Show the desired number of partners - Show the current involved partners - Display the information so that it always takes the same real estate in the given fixed rectangle
Do you have some design ideas? Showing meeples was sure a nice visual in relation with the theme but it's maybe a bit too complicated. Keep in mind it should be easily feasible with html/css (no app yet), and be original ;)
Thank you