Repository: https://github.com/mickael-kerjean/nuage
Details:
Nuage is a a web client for FTP, SFTP, Git etc. It's a nice web app for managing files. As I checked out this project I realized that it lacked a proper logo. I don't actually remember the original logo now. I believe it was just a folder. Anyways I thought I could do better than that and asked the project owner permission to do so. He/she told me to give it a shot and this was the end result. The conversation:
https://github.com/mickael-kerjean/nuage/issues/70
The Concept:
The word "Nuage" means "cloud" in French. Which explains the cloud in my design. I seamlessly combined this cloud with a folder, a symbol used extensively to represent file managers, representing that Nuage is a "Cloud File Manager" which would be an oversimplified explanation of what Nuage is.
Benefits:
- The project now has a unique logo to distinguish it by.
- Improves the overall visual identity of the project.
- Improves the legibility of the project.
- The project now has enough matching graphical assets to use across a wide range of platforms.
Design Process:
As usual I started making the logo in a vector application called Inkscape. I started with the cloud.
Making the cloud
Next up I made the folder. I experimented with various methods of combining a cloud and a folder together:
Different methods of combining a folder and a cloud
Video on making the iconic mark of the logo:
As usual I polished up the logo and combined it with an appropriate font. I chose Nexa Bold as the font, since it went along so well in lowercase with the logo I made. I experimented with the wordmark a little and everything looked elegant when the wordmark is aligned horizontally with the iconic mark. Hence I decided to forgo a vertically aligned wordmark version of the logo.
Choosing Colors:
Choosing the colors was easy since the project owner said I had to use colors from the web app itself. He/she provided me with all the necessary hex codes:
--bg-color: #f2f2f2;
--color: #626469;
--emphasis: #375160;
--primary: #9AD1ED;
--emphasis-primary: #c5e2f1;
--secondary: #466372;
--emphasis-secondary: #466372;
--light: #909090;
--super-light: #f4f4f4;
--dark: #313538;
Subtle Variations:
I experimented with slight variations of the main logo:
Mainly played around with the colors the project owner gave me and I chose design viii as the final one since the PO did not reply what he/she wanted.
Icons:
I made app icons which can be used for iOS, Android and Windows applications. For the iOS version I made a simplified version with just the logo in a white background as iOS has certain restrictions on styling elements of app icons. For the Windows version I removed the shadows as they will be useless/invisible on PCs. For Android there is a version with bg shadow and no shadow.
I also made favicons. These have a thicker stroke to improve legibility at really small sizes:
Mockups:
Proof/s:
The assets that I gave the PO are added to the project: https://github.com/mickael-kerjean/nuage/tree/master/.assets and they are used by the project's web app currently.
Links:
- Repo Link: https://github.com/mickael-kerjean/nuage
- Original Files: https://drive.google.com/open?id=1qt9HvLEDCy8e2EwLkTyWfgfpgTVKYFZX
- Font Link - Nexa: https://www.fontfabric.com/nexa-free-font/
- Github issue: https://github.com/mickael-kerjean/nuage/issues/70
- Applications Used: Inkscape v92.3
- Dtube Video:
This work is licensed under CC0:
To the extent possible under law,
ssnjrthegr8
has waived all copyright and related or neighboring rights to
Logo for Nuage.
Congratulations @arkhamknight! You received a personal award!
You can view your badges on your Steem Board and compare to others on the Steem Ranking
Do not miss the last post from @steemitboard:
Vote for @Steemitboard as a witness to get one more award and increased upvotes!
@arkhamknight, go and place your daily vote for Steem on netcoins! http://contest.gonetcoins.com/
Hi @arkhamknight!
Your post was upvoted by @steem-ua, new Steem dApp, using UserAuthority for algorithmic post curation!
Your post is eligible for our upvote, thanks to our collaboration with @utopian-io!
Feel free to join our @steem-ua Discord server
Congratulations @arkhamknight! You have completed the following achievement on the Steem blockchain and have been rewarded with new badge(s) :
Click here to view your Board of Honor
If you no longer want to receive notifications, reply to this comment with the word
STOPDo not miss the last post from @steemitboard:
Hey, @arkhamknight!
Thanks for contributing on Utopian.
We’re already looking forward to your next contribution!
Get higher incentives and support Utopian.io!
Simply set @utopian.pay as a 5% (or higher) payout beneficiary on your contribution post (via SteemPlus or Steeditor).
Want to chat? Join us on Discord https://discord.gg/h52nFrV.
Vote for Utopian Witness!
Congratulations @arkhamknight! You have completed the following achievement on the Steem blockchain and have been rewarded with new badge(s) :
Click here to view your Board of Honor
If you no longer want to receive notifications, reply to this comment with the word
STOPDo not miss the last post from @steemitboard:
Congratulations @arkhamknight! You received a personal award!
Click here to view your Board