Design improvements

[paulocheque]

• White logo
• Navbar link alignment
• Buttons flat
• editor buttons colors

[paulocheque]

Check some of the images:

[paulocheque]

[durden]

@edroman and @prtkgpt Any thoughts on this hack.guides logo above with 'by pluralsight'?

[prtkgpt]

I think we can do "by Pluralsight" like in the hackhands logo, hackhands.com

Any thoughts @edroman

[edroman]

Sure, either way is fine.

On Wed, Jun 8, 2016 10:54 AM, Prateek Gupta notifications@github.com wrote:

I think we can do "by Pluralsight" like in the hackhands logo, hackhands.com

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub , or mute the thread .

Ed Roman 415-583-3815
http://about.me/Edro
Follow me on AngelList: http://angel.co/Edro

[prtkgpt]

@paulocheque let's move forward with "by pluralsight" in bottom of hack.guides() logo.

[paulocheque]

ok!

ps: with a unique image we will lost the link for the Pluralsight site. But I don't think this is a big deal since we can put the link in another place.

[paulocheque]

@prtkgpt Could you send this image with transparent background?

[prtkgpt]

@paulocheque I used canva.com to add BETA and PLURALSIGHT (both in white) and dark ground.

It's the same logo you sent on Slack

[paulocheque]

ok! thanks!

Follow the changes.

[durden]

Was this tested on a real site before merging or did you confirm only the
screenshots? Merging the cms code itself should be done with more care than
the tutorials. I usually test the branch myself locally and on a test site
before merging. I'll publish this to production once I test it locally.

On Thursday, June 9, 2016, Prateek Gupta notifications@github.com wrote:

Merged #87 #87.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
#87 (comment), or mute
the thread
https://github.com/notifications/unsubscribe/AADizw1eqPt1p-YKVr_VAjdbQ2FRaDJPks5qKGTzgaJpZM4Is3Mn
.

[durden]

Is it just me or is the word 'guides' in the logo fuzzy? It's not as crisp as the words 'summit' and 'pledge' in the other logos. Scroll over the hack.guides logo to see the difference. I've pushed this code to the staging site for reference so you can see a live example of the results.

@paulocheque Can you sharpen up that text?

[durden]

Also, I prefer the old button colors for the editor. However, I don't mind the new buttons so we can change them if everyone agrees. What do you guys think @prtkgpt @edroman?

The old buttons:

The new buttons:

[durden]

The logo resolution also looks fuzzy on the article pages. Should we remove the orange from the word 'guides' and use the same grey used in the word 'hack' for the article pages?

[edroman]

Yes, good observation.

On Monday, June 13, 2016, Luke Lee notifications@github.com wrote:

The logo resolution also looks fuzzy on the article pages
http://pskb-stage.herokuapp.com/python/faster-single-column-slicing-with-dataframes.
Should we remove the orange from the word 'guides' and use the same grey
used in the word 'hack' for the article pages?

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#87 (comment),
or mute the thread
https://github.com/notifications/unsubscribe/ABMLzQ90q_w9VSZ6wax-O4EZURFEMz-Hks5qLTPIgaJpZM4Is3Mn
.

Ed Roman
415-583-3815
http://about.me/Edro
Follow me on AngelList: http://angel.co/Edro

[paulocheque]

Maybe it is my monitor/resolution I am not able to see that. Could you take a screenshot for me?

I can revert the colors. I have just done that because the blue color has not been used in another part of the system and it is different of orange kind. And the red button is more attractive than the save button. But I am not a designer, so I know I am not good at it ;)

[durden]

Here's screenshots of the logos. Hopefully the fuzziness shows up for you. The 'white' logo with the orange 'guides' word seems to be worse but that could just be because it's set on a white background:

[durden]

I'm not completely OK with the blue color of the 'options' button so we could change that to another color. I just wanted to use a 'friendly' color that indicates it's OK to click that button. The back button is red because that is a color that signals 'think before you click this'.

[durden]

@paulocheque See @prtkgpt comment's on changing the 'white' logo. The net change is making the text darker and look like the summit and pledge logos on the article pages.

[durden]

To summarize, here's what I think we need to finish up this request:

1. Revert editor button color changes
   • Again, we can pick a different color for the 'Options' button if you have any suggestions.
2. Cleanup logo used on the black background.
   • The word 'guides' is still a bit fuzzy to me. Maybe we can fix it by just making the font a bit thicker while still keeping the word 'hack' a bit thicker than 'guides'.
3. Cleanup logo used on white background
   • Change 'hack' word to be dark black and 'guides' to be a lighter shade of black, similar to the summit and pledge logos on the article pages.

I can reach out to our in-house designer for these logo changes if needed. The only downside there is he is pretty busy and can't turn things around quite as fast as we can, but let me know if that's something we need to do.

[paulocheque]

I made these updates, please check in the dev site if it is better now.

[durden]

Thanks. The new logos look awesome!

We're going to have a confusing merge because Prateek merged this PR before it was done. So, I'm going to revert that merge for now. Can you separate the design changes from the "expert" feature and push only the design changes to this branch/PR?

So, we'll end up with a commit history like this:

• Merged partial design changes
• Reverted partial design changes
• Merged final design changes

[durden]

I'm not sure how github will handle pushing changes to a PR that's already been merged. So, to avoid that possible confusion lets do this:

1. Separate out new design changes into clean commits
2. Create a new PR for those changes only
   • Make sure to reference this PR when committing or creating the new PR so we can a link between them for historical context
3. Then, I can merge those changes as a separate PR.

[paulocheque]

ok, I will create a new PR for that!

[paulocheque]

#94