Skip to content
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

New Sniffnet logo! #464

Merged
merged 17 commits into from
Mar 23, 2024
Merged

New Sniffnet logo! #464

merged 17 commits into from
Mar 23, 2024

Conversation

GyulyVGC
Copy link
Owner

@GyulyVGC GyulyVGC commented Feb 29, 2024

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 Use smoother curves to interpolate traffic chart data points #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

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 GyulyVGC added the design Styling and appearance label Feb 29, 2024
@GyulyVGC GyulyVGC added this to the v1.3.0 milestone Feb 29, 2024
@GyulyVGC GyulyVGC mentioned this pull request Feb 29, 2024
@GyulyVGC
Copy link
Owner Author

GyulyVGC commented Mar 3, 2024

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
Copy link

ZEROF commented Mar 3, 2024

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
Copy link

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

@orhun
Copy link
Sponsor Contributor

orhun commented Mar 4, 2024

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

@abdullahdevrel
Copy link

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
Copy link

karasowles commented Mar 5, 2024

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

@GyulyVGC
Copy link
Owner Author

GyulyVGC commented Mar 5, 2024

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

@GyulyVGC GyulyVGC linked an issue Mar 6, 2024 that may be closed by this pull request
@GyulyVGC GyulyVGC added the help wanted Extra attention is needed label Mar 6, 2024
@TheKissOfDragon
Copy link

I also prefer B, especially B dark

@omarandlorraine
Copy link

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
Copy link
Contributor

Mkadir commented Mar 6, 2024

B, more B dark )

ImgBotApp and others added 4 commits March 6, 2024 19:46
*Total -- 449.66kb -> 392.23kb (12.77%)

/resources/logos/raw/icon-inkscape.svg -- 11.02kb -> 7.24kb (34.28%)
/resources/logos/raw/icon-light-inkscape.svg -- 11.15kb -> 7.36kb (33.99%)
/resources/logos/raw/icon-light.png -- 87.15kb -> 61.13kb (29.86%)
/resources/logos/raw/icon.png -- 77.73kb -> 59.07kb (24.01%)
/resources/logos/raw/icon.svg -- 8.81kb -> 7.24kb (17.86%)
/resources/logos/raw/icon-light.svg -- 8.93kb -> 7.36kb (17.61%)
/resources/logos/raw/glyph.svg -- 4.01kb -> 3.67kb (8.45%)
/resources/countries_flags/4x3/gt.svg -- 35.28kb -> 33.71kb (4.46%)
/resources/countries_flags/4x3/zz-multicast.svg -- 0.87kb -> 0.84kb (3.25%)
/resources/countries_flags/4x3/zz-broadcast.svg -- 0.99kb -> 0.96kb (2.86%)
/resources/countries_flags/4x3/usa.svg -- 203.70kb -> 203.65kb (0.03%)

Signed-off-by: ImgBotApp <ImgBotHelp@gmail.com>
@LasseRosenow
Copy link

B dark is the best :o

@GyulyVGC
Copy link
Owner Author

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
Copy link

Dhyfer1 commented Mar 15, 2024

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.

@GyulyVGC GyulyVGC changed the base branch from main to v1.3.0 March 23, 2024 15:30
@GyulyVGC GyulyVGC merged commit a672757 into v1.3.0 Mar 23, 2024
6 checks passed
@GyulyVGC GyulyVGC deleted the new-logo branch March 23, 2024 15:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
design Styling and appearance help wanted Extra attention is needed
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Simpler logo