(2D)-Artist(s) needed for icons regarding networking lobby

[Uni]

Hello all!

I am a student (Uni_ on irc, unitraxx on sourceforge) who got accepted to work an a networking lobby (and some other cool stuff, see the quote beneath) for SuperTuxKart, which will involve quite some additions to the user interface. For that I need fancy icons of course! I'm not even going to try to make those myself (They would suck), so I ask all of you to help me with that task. I'm just going to post a small part of my proposal regarding the interface :

Networking Lobby -- Interfac related part

Next to the multiplayer button on the main menu state screen, a new button for online play will be added. When selecting the latter a user is confronted with a new menu consisting out of the following:

A login screen with a link to the registration form and a recovery option. This will be replaced by a “Profile” button when the user is signed in.
A “Quick play” button, that will automatically select the best game for a user. (More on that later.)
A “Find server” button that will link to the server-selection interface.
A “Create server” button that will allow a user to start his own room. (Only when signed in: this is the easiest way to prevent people of making thousands of servers which would overload the addon server.)

The server-selection interface will include a table containing all open games together with the following attributes:

Name of the room
Current game-mode
Number of currently active players.
Maximum number of players allowed.
Latency
Satisfaction score (Further details will follow.)

It is possible to sort on the attributes, by clicking on them in the header of the table. Filtering options will also be available (e.g. latency < X ms, max. number of players < Y), together with a small search bar to look for a certain server on name. Registered users can also filter to only include games from friends.

To join a game, a user simply has to click on a server in the list and additional details including the description will pop up, together with a “Join” and “Cancel” button.

Creating a server will present the user with a form to fill in the attributes mentioned before together with restriction options like password protection and accessibility. (Open for all – Open for all but anonymous players – Friends only)

The actual lobby lists all players present, together with a chat application and the details of the next game. The players will be able to toggle to a ready state, so that the host can start the game only when a certain threshold of ready players has been reached. This threshold will be based on the satisfaction score of the host.

The host is able to edit the attributes, as well as selecting the next track, number of laps and AI karts. Any change will reset all ready-toggles to false. He also has the ability to kick and ban any user by clicking on the username and selecting the corresponding option.

All players will have the ability to invite friends to the room. The players, excluding the host, will have the option to vote for the room. An up-vote will resemble a good host, who takes in mind the wishes of the users. A down-vote can be given when there is suspicion of a patched version of the software. This rating (previously defined as satisfactionscore), will be associated with the host and is shown in the server-selection list.

This score, in combination with latency, will also be used to determine which server a user joins when going for the Quick Play option. The user will then only have to select a game-mode (though random will be an option). The default order in the server-list will also be based on this principle.

The profile of a player will consist out of different sections, with a navigation bar on the top. The different sections would be:

A default overview
Notifications : for friend requests, challenges and invites.
Friends
Statistics & Achievements
Settings : e.g. change password

Of course when visiting someone else his profile, the notification and settings sections won't be showed. An option to send a friend- and challenge request however will be provided, as well as a “Join game” option if possible.

Anywhere in the application, except during a race, a pop-up will be shown when a new notification comes in together with applicable actions. Users will also get notified this way when an achievement is reached after a race. During a race, newly accomplished achievements will be shown using the existing interface at the bottom of the screen.

Clicking on any username (in the lobby, friends-list...) will give a pop-up with certain details about that user as well as some options :

Send friend-invite. (If not yet a friend.)
Join game. (If that user is in a game, it's joinable and they're not already in the same game.)
View profile. (If a user is in a game-lobby at the moment, a warning shall be shown that the user will leave the lobby.)
Hosts of a game-server, will have the extra option to kick and ban a user in their lobby.

This feature, including visiting profiles in general will be excluded for anonymous users.

Challenge friend with ghost race

When challenging a friend, the user records a ghost race and sends it to the server. The friend will get notified, and has the opportunity to beat the challenge. With this feature there is already some interaction between users without having the actual online racing experience. Scores will be maintained and to make it more competitive we can add an option to allow only one attempt to record and beat a ghost-race per challenge.
Votes for add-ons

Since user accounts will now be available in-game, it's only a small effort to include voting for add-ons.

Achievements

To have extra goals for the user and something to show-case to others, achievements are a fun addition. A decent amount of achievements will be added as part of the project, but the main goal is to add a base layer to easily add new achievements later on. How we will achieve this can be found in the implementation details.

(Sorry for the lay-out, it's a copy from the horrible google-editor.)

Lets see what I'll exactly need :

A button for online play on the main state screen. (Big icon)
Buttons for the profile : overview, friends, achievements, notifications, settings (small icons)
Buttons for the online play screen : Quick play, search server, create server, Sign In, Sign up (big icons) [Especially here I'm not 100% sure of the lay-out]

Keep in mind that the lay-out can (and probably will) change over the summer.
If you think I forgot something, feel free to suggest it!

If you plan on designing one of the icons : post that first. We don't want multiple people working on the same thing

Thanks in advance,
Uni

[RaceAce]

I will try to create the 4 buttons for the online play screen. (profile, quick play, search server, create server.)

[tavariz91]

Hi!
So am I working on the big menu icon
Here is a suggestion: use a main network icon in many places, declined in some different ways by adding something on it; In this case we need collaboration in the community, to keep a standard line.
Here is a try, I wanted to keep something like the network icon in the gui folder, with a bigger size.



Based on it, a networking menu icon try:


I join a xcf file with variants; you can put / remove the wheels, see with tux, etc.


Another suggestion is to add something like a red cross on the wifi bar or remove colors to the earth if the game cannot reach the main server. If the player clicks on it, the game shows a popup like this "I cannot join internet; do you want to play locally?". It could be more user-friendly and you would avoid children to tear for hours while they don't understand what's happening because they want to play on the net and their parents just cutted off the connection

EDIT: as always; based on openclipart.org earth and wifi icons.


Re-Edit: Last suggestion: If the parents want to protect their children from the online game fore some reason, there should maybe be a way to permanently de-activate the networking game or to authorize it only for some hours (with a password). As I don't think it stays in your GSOC drivelines, maybe it could be added as a ticket for requested feature for the community.

Re-Re-Edit: Working on the small icons overview, friends, achievements, notifications, settings
@ uni: Do you want a "new unread notification" variant for the notification button? I have one.

[Uni]

I didn't expect to get such a quick response. Great job!
Disabling networking will be an option, but it's of no high priority. Everything I don't get done during the summer will be converted into tickets.

A "new unread notification" variant would be nice.
Keep in mind that I only start working on the GUI in a few weeks, so I'm not even sure about the details myself.

I just thought it would take some time to find volunteers for the icons.

[rubberduck]

Disabling networking will be an option, but it's of no high priority

we have something like this(because for addons), there is an option for this under settings/userinterface

[tavariz91]

You have the volunteers

Overview


Achievements


Friends


Settings


Message: with or without a new notification:


(I noticed a 1 pixel difference for the letter, will be corrected soon) )

[Uni]

Hmm I'm not sure, the icons need to act as buttons to navigate the profile of a user. I don't think the "overview" icon expresses that. (But what do I know I think I'm gonna wait for the feedback of other people )

[RaceAce]

You have the volunteer

Your buttons are much nicer than mine. I think you should do them all so they all look similar.

[rubberduck]

they are all good, but for some things you don't need all, for example that one with the letters, you don't need a world and the edgy background
so you can use it as unread-symbol like this styles/qsilver/imageset/icon_topic_newest.gif

[tavariz91]

For the icons, they are based on the buttons from the race setup menu, but I don't have the original frame without anything... If someone does, please tell me.
In fact, the actual (on svn) race setup menu buttons are all based on the same frame (normal race mode button) with something on it, so I think it should be the same. Maybe am I wrong...

About the overview, I think there could be a scheme of the networking lobby, but we won't get it before you make it
(Note: maybe we could use your first scheme for it, as easter egg)

Anyway, all of these can be changed later.

I join my whole work in a zip.
as always;

@RaceAce, I'm not so good, the only job I have done that is in the SVN is the book; usually I have ideas but cannot make them . So, let's work together. What do you use to make your icons? I strongly recommend you to use inkscape and find free-to-use cliparts in the openclipart.org menu (into inkscape).
For the earth, I took an earth file, simplified the ways, removed a reflection and highlighted the whole thing. Total: 2 minutes... You will gently learn how to draw something well and it will be more and more easy for you.
Last but not least, you can show the community what you have and wait for reaction. I do it frequently because I know quickly if I am on the good way or not. So please show (me?) us waht you have done, and let's see what we can do with it (at least get ideas!)

@ Rubberduck: In my mind it could look better to get the letter opened if there is something new than just getting a small icon added. Maybe we don't see the same way to use the icon

[Kanhelf]

I think it would look better if you used the globe that is in the addons icon.

[tavariz91]

It was the idea, but it is a raster, so you can't use it for something bigger without loss. I need something ~2 times bigger in each direction , so 1 pixel becomes 4 pixels. Interpolation works for small amounts, but here I think the difference is really too big. The result would look horrific.
That's why I made a new globe.

If someone can give the original svg file, I'll take it.

[Arthur]

Here's the original SVG for the addons icon: http://supertuxkart.svn.sourceforge.net ... sion=12829

Nice work, but I feel like some of the icons are a bit too "busy", i.e. have more elements than they need. The best looking icons are often quite simplistic.

[Uni]

To be honest I like tavariz91's globe more. The mast and the white line however aren't really needed in my opinion.

[Auria]

... and the globe icon can be found in file "menu icons by yekcim" in https://supertuxkart.svn.sourceforge.ne ... ector_art/

[tavariz91]

Thanks! I will look at it ~Thursday; I have a bit too much things IRL to do before...

[Arthur]

No hurry at all, coding won't start for a few weeks and that will take three months roughly so you have plenty of time.

[tavariz91]

Sorry, I work in a fast food as crew trainer, so I was teached to hurry, hurry, hurry and teach others to hurry. I'm afraid it makes me do everything fast , even if it's not necessary.

I will try to slow down, I promise .

[tavariz91]

Long time, no siege...

So, I have replaced the globe, and I don't like the look at all. IMHO the globe is too "simple", the black outline is too big and the white line goes really too far from the planet; it makes it ridiculous, because if we need simplicity, we don't need too much simplicity for the icons

Here's the actual "thing":

EDIT: VS:

What I am thinking about:
Re-make my blue globe without the white line and the wifi icon (I lost it );
Network Button: make a network menu icon like the actual I have with the two wheels on it. I'm not sure about the wifi icon, I'll maybe add it, but I'll remove the bad looking white line in any way.

Overview icon: I am thinking about night-vision goggles, maybe with tux looking into it and big eyes in the front lenses.
Achievements: Since that is a todo's list, I think about a checklist in front of the newglobe.
Friends: as the present one (with the new globe)
Settings: as the present one (with the new globe)
Messages: I'd like to remove the globe and let more space for the letter. I will add a small notification check (for rubberduck ); probably the green check we already have and find (or make) a corresponding unchecked icon (basically a white or red circle).

For constency, I can change the existing icons with the new globe too, or we could say that networking features and addons get different globes to stay clearer. (I fact I love the original globe but for really small icons only... Maybe I can modify it a bit to make it look better in a big size but I'm not really sure it's a good idea.)

Now what I need is your opinion; if 35 people tell me that I'm wrong with my blue and green earth, sure I will re-consider it .

[Uni]

I like this one the most :

Simple and neat.


This one could probably win me over though, for consistency reasons.

[Auria]

These icons look nice when they are so big, but in-game they will be much smaller than that. Maybe just remove the driving wheels and keep only the globe?

[Totoplus62]

These icons look nice when they are so big, but in-game they will be much smaller than that. Maybe just remove the driving wheels and keep only the globe?

+1

[tavariz91]

Hi!

So am I getting slower;
I will add icons and icons and icons during the day

So:
The menu_network; I'm always not sure what looks the best:

Pro: same globe
Contra: too simple


Pro: I like its look
contra: not the same globe; maybe not the good colours set

In game comparison:


I will now work on the small icons and wait for a decision about the final globe used.

[Totoplus62]

I still prefer the first one because of its colors (when you look at the whole menu this is consistent)
That's just my opinion; waiting for other ones

[tavariz91]

sure we need the opinion of every!

EDIT: Due to the forum limit, I kicked out some pictures (noted "OUT"). You can find them in a zip on my next post.
Here's a new overview button proposal; I tried to put Tux behind but it looked bad :
OUT
A re-worked verions is in the next post.
any feedback or improvement suggestion is welcome
New notification:

all notifications are read:


friends:


achievements:
(needs more work)

settings
(too simple?)

As I don't have any news from RaceAce's Ideas,
I permit to submit these ideas (Of course these are JUST IDEAS AND NOT DEFINITIVE ICONS):
profile button
OUT

quick play button
OUT


new server:
OUT

find a server:
OUT

Ok that's it for now

what about a trash for notifications and avatars for friends? (Just ideas )