responsively-app icon indicating copy to clipboard operation
responsively-app copied to clipboard

Splash page and other branding updates

Open manojVivek opened this issue 4 years ago • 25 comments

To discuss the ideas from @naher94 about the branding update and splash page.

manojVivek avatar Jul 28 '20 05:07 manojVivek

Had some ideas around updating the branding to pull in the bright pink-red from the splash page. Related to that I was wondering if the hover color purple that is in the app has its own meaning. Might make sense to converge the pink-red and purple for brand consistency.

Also was thinking to update the logo that fit better with the new icon language and the tone of the application and the splash page: modern, clean fun...

Here is a quick sketch I was playing with: Screen Shot 2020-07-27 at 6 23 47 PM

naher94 avatar Jul 28 '20 13:07 naher94

please keep the original icon and colors (but create a light theme) I really don't like a colorful app

jjavierdguezas avatar Jul 28 '20 13:07 jjavierdguezas

The current logo definitely feels a bit old school with that TimesNewRoman Rs... I also agree with jjavier about not having a colorful app to keep it clean and minimal. If it's just the icon though I really like the suggestion. Perhaps converging to the more neutral duotone of the Splash Page (very-dark-navy-blue & pink-red) to unify the branding of the app?

marcoscannabrava avatar Jul 28 '20 13:07 marcoscannabrava

I am not a designer, and yes the icon feels old school, maybe we need to give it more love, but the "responsive concept" (content adapted to device size) is really well represented with the Rs (and I don't see it in @naher94 propose)

jjavierdguezas avatar Jul 28 '20 13:07 jjavierdguezas

Had some ideas around updating the branding to pull in the bright pink-red from the splash page. Related to that I was wondering if the hover color purple that is in the app has its own meaning.

To be honest the bright pink-red from the website and the purple on the app are just random colors and don't really carry much meaning.

Also was thinking to update the logo that fit better with the new icon language and the tone of the application and the splash page: modern, clean fun...

Is it possible to add a preview image with this logo on the app UI screenshot?

But I agree with others too, would prefer a less flashy logo.

@naher94 If you prefer more instant conversation we can connect on Gitter too: https://gitter.im/responsively-app/

manojVivek avatar Jul 28 '20 16:07 manojVivek

Saw this issue related to branding updates for responsively and wanted to contribute to this! I read through the previous comments regarding the logo and came up with a minimalistic one that could showcase the responsive behavior. Let me know what you think! 😁

Logo

responsively logo

Homepage

responsively homepage

App UI

Desktop - 2

SowmyaSeshadri avatar Sep 23 '20 16:09 SowmyaSeshadri

@SowmyaSeshadri I like the logo a lot 😍 It looks perfect in the darkest background but in the lighter one I don't think so 🤔 darker background: image

vs

less dark background: image

I don't know if is because it has a shadow? 🤔

jjavierdguezas avatar Sep 23 '20 16:09 jjavierdguezas

Thanks for the catch @jjavierdguezas! You're right. It was the shadow that didn't look fine in the lighter background. I got it fixed and it looks much better now. Thanks for the feedback! Let me know if you have any more suggestions!

This is how it looks in light & dark background

logo-updated

Updated App UI

Desktop - 2

SowmyaSeshadri avatar Sep 23 '20 17:09 SowmyaSeshadri

@manojVivek Any suggestions/feedback for the logo that I've attached above? If you are good with it, let me know if I can issue a PR with the high resolution logos. 😁

SowmyaSeshadri avatar Sep 24 '20 13:09 SowmyaSeshadri

Hi @SowmyaSeshadri, I like it too. But looks kind of familiar from a similar tool, don't remember exactly which one it is.

Would love to see a different variations or something if you had tried something.

Thank you so much for your efforts on this, really appreciate it. 🙌🏼

manojVivek avatar Sep 24 '20 15:09 manojVivek

@manojVivek Sure, let me try few other variations and get back to you!

SowmyaSeshadri avatar Sep 24 '20 15:09 SowmyaSeshadri

Hi @manojVivek, I tried a few other variations. Let me know what you think!

Frame 11 (2)

SowmyaSeshadri avatar Sep 26 '20 14:09 SowmyaSeshadri

Im liking the first option (nested rectangles) but curious what it will look like within an app icon.. also feel like we can play with the typeface some more.. happy to see more folks getting involved!

naher94 avatar Sep 28 '20 22:09 naher94

Attaching the other versions that were tried with the letter R. Tried a different typeface as well. Let me know what you think.

#1

Logo-1 #2

Logo-2 #3

Logo-3 #4

Logo-4

SowmyaSeshadri avatar Oct 18 '20 17:10 SowmyaSeshadri

@manojVivek Attaching the different views for the below icon that we discussed yesterday. Let me know what you think.

Logo

Logo-variations Web

web App

app Launch Pad

LaunchPad Dock

Dock

SowmyaSeshadri avatar Oct 19 '20 14:10 SowmyaSeshadri

Thanks, @SowmyaSeshadri.

@jjavierdguezas @naher94 Would love to hear your thoughts on these.

manojVivek avatar Oct 20 '20 11:10 manojVivek

Attaching the different views for the below icon that we discussed yesterday. Let me know what you think.

@SowmyaSeshadri Can you please make the outer black circle a transparent one for the launch pad and the dock view?

manojVivek avatar Oct 20 '20 11:10 manojVivek

Thanks, @SowmyaSeshadri.

@jjavierdguezas @naher94 Would love to hear your thoughts on these.

Although it is a bit sad to leave the original logo ( Rr forever 😅), I really like the last proposal (https://github.com/responsively-org/responsively-app/issues/357#issuecomment-712219316) and I agree to leave the background transparent or white

jjavierdguezas avatar Oct 20 '20 11:10 jjavierdguezas

@manojVivek @jjavierdguezas I have updated the dock/launch pad views with 3 variations. I suggest using #1 but let me know what you think as well. I feel that the transparent one (#3) might not be clearly visible in all cases.

Dock View - Screenshot 2020-10-20 at 6 03 31 PM

Launch Pad view - Screenshot 2020-10-20 at 6 47 25 PM

SowmyaSeshadri avatar Oct 20 '20 13:10 SowmyaSeshadri

hmmm I think I want to go back to the one with the dark background 😅 : https://github.com/responsively-org/responsively-app/issues/357#issuecomment-712219316

jjavierdguezas avatar Oct 20 '20 16:10 jjavierdguezas

I have updated the dock/launch pad views with 3 variations. I suggest using #1 but let me know what you think as well. I feel that the transparent one (#3) might not be clearly visible in all cases.

@SowmyaSeshadri Instead of the same black for all 3 devices, can we try 3 step variations of a color, one for each device?

manojVivek avatar Oct 21 '20 07:10 manojVivek

@manojVivek Sure, I am not sure if it would go well with different backgrounds, but I shall try and get back to you.

@jjavierdguezas Agreed. That would be my pick as well.

SowmyaSeshadri avatar Oct 30 '20 16:10 SowmyaSeshadri

Screen Shot 2020-12-13 at 10 23 27 PM

Playing with some new idea.. thinking about a couple devices metaphor previously mentioned and breaking the icon box, if you will

naher94 avatar Dec 14 '20 03:12 naher94

Screen Shot 2020-12-13 at 10 33 43 PM

Tried one that is stacked up devices as well

naher94 avatar Dec 14 '20 03:12 naher94

My vote is this :) => image

And maybe just use "Responsively" as the name/label of the app.

menjilx avatar Mar 29 '21 08:03 menjilx