nickytonline/connect-four

Create a favicon for the project

Closed this issue ยท 17 comments

Is your feature request related to a problem? Please describe. A clear and
concise description of what the problem is. Ex. I'm always frustrated when [...]

SvelteKit ships with a default favicon.png located at static/favicon.png. It's currently the SvelteKit logo. There are no designs for this, but a favicon related to the game of Connect Four would be great to have. Maybe the coin piece, but we leave it up to you to come up with a fun icon.

Describe the solution you'd like A clear and concise description of what you
want to happen.

A fun icon representative of the Connect Four game. Dimensions must be 128px x 128px

Describe alternatives you've considered A clear and concise description of
any alternative solutions or features you've considered.

Additional context Add any other context or screenshots about the feature
request here.

I can take a crack at this

Assigned it to you @LoganArnett!

2 quick options but can work on something more if needed

More dynamic like the game

favicon-connect-four-1

Simple and clean

favicon-connect-four-2

Will create a PR with the file once confirmed

I love this one @LoganArnett!

favicon-connect-four-1

Thoughts @Narigo @sadiejay?

Agreed @nickytonline ๐Ÿ™Œ๐Ÿพ

I like the board style more as well. I'd love to have a board that could actually be played, though ๐Ÿ˜…

Maybe something like this? (If the 4 is still visible in the small scales...)
image

Actually one suggestion for my choice. Since there are only two game piece colours, could you make the yellow ones blue? Or maybe make them all blue and the current red ones could be yellow. Thoughts?

Yea when I did the full 6x7 board it wasnt very visible as an actual favicon. I used the color layout I did for visibility and aesthetic but I can go to a full board if you want. And what are the 2 colors? I tried to have blue represent an empty square and red and yellow being pieces.

@Narigo it is very difficult to see at 128x128 and true favicon display will be even smaller like:
image

I'm okay with whatever you choose ๐Ÿ‘
For the example, I used blue for empty spots as well. Red began and won in the example ;)

@Narigo it is very difficult to see at 128x128 and true favicon display will be even smaller like:

image

Actually, it still looks good in @Narigo's example even at 128 x 128, and I just noticed the red makes a 4. Just wondering how we could make the 4 pop more. I think from the classic game, the board was blue, so wondering if it could be a blue background, white for empty slots and keep the rest as is?

I also want to be mindful of your time, so if this is too much, just let us know.

Maybe with a bit different colors and less space between them, it could pop out more? I don't feel it that much though.

image

Here would be an SVG to change colors etc. I've put it into square format:
connect-4-board

favicon

I tried to update for the favicon with colors that would make the 4 pop a little more by fading the white and yellow slightly, keeping the darker blue, and adding minimal shadow to the red pieces

Love it @LoganArnett! Thanks so much for doing this. I'll just let @sadiejay and @Narigo chime in again. Looking forward to seeing the new icon rolled out. ๐Ÿ˜Ž

I created the PR but can update as needed