zulip / zulip-flutter

Future Zulip client using Flutter
Apache License 2.0
171 stars 149 forks source link

Nicer "beta" app icon #415

Open gnprice opened 10 months ago

gnprice commented 10 months ago

During the beta period, a broad audience of Zulip enthusiasts — first the community on chat.zulip.org, then others who read the Zulip blog and want to try a better mobile Zulip experience — will be installing this app on their phones where most of them also have the existing production app installed. The app should therefore have an app icon that

With #414, we get an icon that checks the first two boxes (resolving #390) but not so much the third. It's adapted from the one we've long used for debug builds of zulip-mobile, which is a use case that has the same first two needs (clearly Zulip, distinct from main icon) but where it really hasn't mattered if it looks good.

The basic concept of that icon is that it's the Zulip logo (just like the main app's icon) but then with a banner reading "BETA" overlaid on it. I'd be happy either with a better-designed execution of that concept, or with some other concept if we like that better.

gnprice commented 10 months ago

Here's the iOS version of the icon from #414, with the main app in the frame for comparison: image

And here's the icon for Android as it appears on a current version of Android (my Pixel 8 with Android 14): image

What's happening with that white space is that Android (or rather, the stock launcher app for Android — Pixels and others will behave this way, but other vendors will be different, including IIRC Samsung) forces the icons to fit in a circle. When the icon we give it doesn't fit in the circle, it shrinks it and puts that on a white background.

So some things that don't look great with this icon, to my eye, include: that white space; the red is kind of jarring; the red looks a lot like a notification badge on iOS (it's a slightly different color, and in the wrong part of the icon, but close enough to catch your eye when glancing past it); the text is too lightweight; the text is slightly off center; the placement of the banner relative to the Z doesn't feel quite aligned.

Again, I'd be happy with either a design that fixes those and otherwise brings this up to our standards, or a design based on some other concept entirely.

terpimost commented 10 months ago

Deeper colors but not so different icon:

Image

beta icon.zip

criticic commented 9 months ago
image

this is sort of based on apple's developer app logos (Xcode/testflight etc)

chinmay7016 commented 8 months ago

Hey @gnprice sir if you don't mind can i work with this design if you don't mind and assign me this logo1_15_23368

chinmay7016 commented 8 months ago

Hey @gnprice sir pls reply

gnprice commented 8 months ago

Thanks @terpimost and everyone for the designs! Sorry for the belated followup.

I think a chat thread will work better than GitHub for discussion (which means I probably should have started a chat thread in the first place, and filed this issue as just a placeholder pointing to that). Let's continue here: https://chat.zulip.org/#narrow/stream/48-mobile/topic/beta.20app.20icon.20.23F415/near/1732485