GyulyVGC / sniffnet

Comfortably monitor your Internet traffic πŸ•΅οΈβ€β™‚οΈ
https://sniffnet.net
Apache License 2.0
18.64k stars 558 forks source link

New Sniffnet logo! #464

Closed GyulyVGC closed 8 months ago

GyulyVGC commented 9 months ago

Following the principles mentioned in #274, I think that the upcoming release of Sniffnet 1.3 is a perfect moment to slightly simplify and improve the logo of the application.

Having a simpler logo has many advantages.

  • First, the logo is recognizable even at small sizes, like the favicon in browser tabs (16x16 pixels on typical screens), the icon in OS windows, etc.

  • Second, simple logos appear modern, while more detailed logos may feel outdated.

  • Third, simpler icons are easier to memorize and recognize.

Old logo

New logo (A)

see details

Version 0

- The icon has not been simplified excessively (to keep it easily recognisable as a Sniffnet brand) - The hat is now filled except for an horizontal bar, which recalls the data bars present in the overview page of the app - Glasses are now completely filled: the details in the old glasses were in practice indistinguishable at smaller resolutions and were adding too much complexity in general - The nose is slightly smaller and simpler - The background keeps the same colors but evolves to have smoother curves, according to the new traffic chart interpolation (see #461); there is a slight shadow and a brushed line separating the two colors, which now outline an "S" (recalling the initial letter of the app's name)

Version 1

- The background has now an harmonious gradient that makes it lighter, increasing the contrast with the logo - Glasses are now filled with a color gradient to make the overall look less heavy and to resemble a transparency effect - The nose is filled as well to be consistent with the other parts of the logo, and is more prominent to allow Mr. Sniffnet do his job better - The hat sides have been simplified

Version 2

- Hat and nose are now filled with a soft color gradient as well β€” this makes such elements have an effect consistent to that of the glasses, which is meant to represent a feeble light coming from the bottom (probably generated by the computer used by Mr. Sniffnet)

New logo (B)

see details

Version 0

- Colors resides in the object itself, not in the background - Many details have been removed, outlining a much simpler logo - A letter "S" hides in the hat, recalling the name of the application (this shape is ideally generated by a pipe smoke) - Sketch kindly made by Reddit user [u/Wiernock_Onotaiket](https://www.reddit.com/user/Wiernock_Onotaiket/)

Version 1

- Polished up the whole thing

Version 2

- Added feeble gradients - Improved nose

Version 3

- Light background - Shadow effects

Version 4

- Improvements to shadows - Slightly changed background color

Feel free to contribute

It's the first time I realise a logo in a semi-professional way. I had a lot of fun an I'm pretty satisfied with the outcome, but feel free to leave feedbacks.

GyulyVGC commented 8 months ago

So... there we go! Now that the two candidate logos have mostly been completed, I'd like to gather some feedback. The one with more votes will be used as new logo for the application.

Screenshot 2024-03-03 at 21 19 24

ZEROF commented 8 months ago

Hi there. Nice to see that you're still going with this cool project. I like original logo, but I understand that it's okay to change over time. I would say A, my personal taste of course, but probably 2 is what most people would expect to see.

Cheers

ziggysdomain commented 8 months ago

Prefer B. Good luck with update. Very useful piece of software. Thanks.

orhun commented 8 months ago

Hey, I also prefer B in this case. I was also curious how the inverted version of B will look like and I also like this one as well!

Details ![sniffnet-inverted](https://github.com/GyulyVGC/sniffnet/assets/24392180/9f444c48-203e-49ef-8503-861aa2a7a6f6)
abdullahdevrel commented 8 months ago

I prefer B as well.

Why The face, as the primary subject of focus, looks nicer with dual colors. In the other version, the backdrop shows "the duality" aspect that takes away from the primary focus. I also like the nose design on the second one. The second design with two colors is simple and clean. I also like the fact that the hat is tipped forward, which kind of makes the logo more mysterious.
karasowles commented 8 months ago

πŸ‘‹ we chatted internally at GitHub, and we like logo B for its visual clarity & legibility at a variety of sizes

GyulyVGC commented 8 months ago

Thanks so much guys for your opinions.


Logo B obtained 16 votes out of 21 total survey participants.

So, with 76% of the preferences I think we already have a clear winner.


For this reason I decided to produce another variant of logo B.

Let me know which of the two you prefer!

image

TheKissOfDragon commented 8 months ago

I also prefer B, especially B dark

omarandlorraine commented 8 months ago

I'd like to add my vote for the Dark version of logo B.

(just as an aside. the light and dark are similar enough that it would make sense to use both variants. For example, the light one for browsers' favicon.ico and printed materials, the dark one in the Windows start menu, ...)

Mkadir commented 8 months ago

B, more B dark )

LasseRosenow commented 8 months ago

B dark is the best :o

GyulyVGC commented 8 months ago

It's official: the variant B Dark will be the new logo of the application πŸŽ‰

In the latest survey, B Dark (27 votes) completely outclassed B Light (2 votes).

As someone mentioned, the two variant are similar enough to be both used depending on the context, but the dark one will be used as main symbol of the new Sniffnet version (e.g. application icon, README banner, etc).

Dhyfer1 commented 8 months ago

I don't like. Sniff means to smell or sniff. The nose is in charge of that action, of smelling. So what I propose is a nose above the wi-fi icon, like this: πŸ‘ƒ β†’ Sniff πŸ›œ β†’ net

I don't see any relationship to the current logo with what the app does, the current logo looks like an app for private investigation or to request a detective service. Instead, with a logo of a nose above the wifi icon, It is already understandable what Sniffnet can do.

Ladvace commented 1 week ago

since I like experimenting, I made some potential minimal/ less complex logos variants if you are still open to some proposals, the current one reminds me too much about breaking bad

new_logo_proposal

ziggysdomain commented 1 week ago

I like 5. I suggest a reversal of colour - see attached - so that 'white hat' is more obvious. Sniffnet-5-Edited

orhun commented 1 week ago

4 is pretty minimal, I like it.

GyulyVGC commented 1 week ago

At the moment I'm not considering a further rebranding and I'm pretty satisfied with the current logo. Anyway, thanks for your feedback! Still appreciated!