Design Guidelines

Index

Click one of contents:

Contributing

We are open for new issues and pull requests. By participating in this project, you agree to abide by our licence.

If you would like to contribute and don't understand something here, reach out on our issue, and we will be happy to offer solutions. Additionally, we welcome any attempts to engage with the project – through acquiring the source code, following documentation steps to get started, and then offering feedback in our communications channels on how this process could be improved.

Steps

Fork and Clone

Fork our repository at GitHub and run:

git clone https://github.com/your_username/suru-plus
cd suru-plus

Branches

After forking our repository, create one branch per bugs or per files or per icons on your personal repository:

git checkout -b new_icons
git push origin new_icons

The branch name should describe the bug or version ("alpha" or "beta" or "new-icons" or "unstable" or "beta-emergency" or "unstable-emergency"). It should start with the bug or version number, and include a very short description of the bug, or a short version of the bug's title.

Developing

I recommend the vector editors:

Attention!

Affinity Deisgner, Figma and Sketch

We have provided three templates of Suru++ big icon, each one for Affinity Designer, Figma and Sketch. EXporting all to SVG is required.

Be careful!

If you do not want to use KDE for test, it is important to observe that not all the features of an icon are supported in the KDE environment. Here are the unsupported features:

💡 You can use the cloned blurry shape as a drop shadow, then just apply 40% of opacity and add 4 pixels of shape position y.

App Blur Drop Shadow Inner shadow
Affinity Designer - - -
Figma 4 blur: 10, x = 0, y = 4, opacity: 40% blur: 10, x = 0, y = 0, opacity: 40%
Inkscape 10% blur: 10%, x = 0px, y = 4px, opacity: 40% -
Sketch - - -

You must follow the rules of colours and grids of Sam Hewitt's Suru Design Guideline:

Colours palette

These normal gradient colours are based on the original colours palette of Sam Hewitt's Suru icons, but gave a new elegant, futuristic and modern colours scheme. Inspired by cyberpunk neon colours:

Medium colours

The red colours are inspired by by the TV series Altered Carbon and the cyan, golden, turquoise and orange by the film Blade Runner. They can be used on anything, anywhere, in any combination that works, but ideal with bright and white background or foreground.

Bright colours

These bright colours are inspired by the lightsabers of the scifi series Star Wars, and by neon lights at night. They can be used on anything, anywhere, in any combination that works. Like their use in the Star Wars family of film and TV shows, they are ideal with a dark background or foreground.

Purely cyberpunk colours

These are purely cyberpunk colours, extracted from the 90s successful Belgian electronic music Technotronic, which marked the new era of the cyberpunk world, with the cyberpunk music genres as dance-pop, electro, euro disco, italo disco and techno, from the films Blade Runner and from the TRON: Legacy, and from the TV series Altered Carbon, Star Trek and Star Wars.

White colours

These futuristic colours are inspired mainly by the TV series Altered Carbon, which features mostly whites in its futuristic laboratories, art deco architecture, and clothes of wealthy meths. Five of them (brown shades) by the film Blade Runner.

Commit messages

Commit messages should generally follow this helpful advice, but please start your commit message with:

For example, run like:

git add .
git commit -m "Added new icons"
git push
# Type your username and your password

It eases skimming history later. For this reason, the first line will tend to be longer than the 50 chars suggested in that article, aim to keep it less than 72 chars.

Submitting the pull request

When you submit a pull request, please use the description field to explain in words the overall intention of your changes. A few sentences should be plenty. It is also OK to reuse the commit message, if you included a lot of discussion there.

At this point you are waiting on us. We like to at least comment on pull requests within among one and three days. We may suggest some changes or improvements or alternatives.

Reviews

We try to avoid landing anything without at least a cursory review. We firstly may analyse your codes, your icons or anything else if they must improve.

Merging

When a pull request has passed review, the reviewer generally merges.

Remember that, once I approve, you need to delete the branch.

Tip

You do not need to remove and fork every time, you can delete only the branches you created.

When I upgrade something in my repository, you need to switch from the deleted branch to the branch master:

cd suru-plus
git fetch origin
git checkout master
git remote add upstream https://github.com/gusbemacbe/suru-plus
git pull upstream master 
git add .
git push

Toolkit

You can find templates and palettes in the folder templates at Suru++ repository.