Splash page and other branding updates

[manojVivek]

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

[naher94]

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:

[jjavierdguezas]

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

[marcoscannabrava]

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?

[jjavierdguezas]

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)

[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.

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/

[SowmyaSeshadri]

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

Homepage

App UI

[jjavierdguezas]

@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:

vs

less dark background:

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

[SowmyaSeshadri]

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

Updated App UI

[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. 😁

[manojVivek]

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. 🙌🏼

[SowmyaSeshadri]

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

[SowmyaSeshadri]

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

[naher94]

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!

[SowmyaSeshadri]

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

#1

#2

#3

#4

[SowmyaSeshadri]

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

Logo

Web

App

Launch Pad

Dock

[manojVivek]

Thanks, @SowmyaSeshadri.

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

[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?

[jjavierdguezas]

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

[SowmyaSeshadri]

@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 -

Launch Pad view -

[jjavierdguezas]

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

[manojVivek]

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?

[SowmyaSeshadri]

@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.

[naher94]

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

[naher94]

Tried one that is stacked up devices as well

[menjilx]

My vote is this :) =>

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