My Design Stack

İsmail Efe Top

2024-10-13

If you are familiar with frontend and backend development, you've likely come across tech stacks. You can think of tech stacks as a list of tools people use to create applications. People can share their stack and others can get inspired or learn about new technologies.

While it is common to find different stacks when working in the programming field. You don't see them utilized in other fields, such as design. Since I picked up a lot of design jobs and create a lot of slides, I wanted to create a design stack and share what I use and how I use them.

I am calling this the PCSG stack. Before I start explaining, I want to go over two things.

Photopea

Photopea is a browser-based photo editor. Coming from Adobe Photoshop, I find it easy to work with, as Photopea draws heavily from Photoshop's interface, shortcuts and features.

Since there is a lot of different options when it comes to photo editors, I want to list the things I like about Photopea:

Colorhunt

Colorhunt is a website that hosts curated color palettes. I use this website very often; you can search for specific color palettes, sort by popularity, and add palettes to your collection.

Colorhunt comes in handy when I have to quickly select a contrasting color scheme for a slide or when I need inspiration for a project.

SVG Repo

I think I speak for all designers when I say SVGs are awesome! If you don't know what an SVG is, I recommend this video, as it does a great job of explaining.

SVG Repo is a wonderful way to get SVGs. It houses "500.000+ Open-licensed SVG Vector and Icons" and comes in handy A LOT when doing design work.

Most of them have licenses that enable you to use them however you want. I generally make use of SVGs in slides, posters, social media contents, and websites.

Google Fonts

Google Fonts is one of my favorite sites to use. It houses more than a thousand fonts, and all of them have open licenses. All the fonts hosted have unique personalities, and you can easily find one that suits your needs.

For example, my website mainly uses EB Garamond and Gentium Plus, which I found and got from Google Fonts.

Google Fonts also has wonderful articles that teach you how to select fonts, where to use them, and how to use them. These articles are a must-read for any designer.

If you are a webmaster, you can use Google Fonts on your websites without downloading or hosting anything. This can be achieved by getting embed links for the fonts you want to use and importing them with just one line of CSS.

Bonus

Accessibility is something I deeply care about. A lot of my design work comes in the form of web design. For more people to have the ability to view my website comfortably, I need to be operating within the W3 contrast standards. I use 2 sites for checking whether I am following this standard or not.

First is Colour contrast checker, this site lets me check the AA and the AAA value. If my color combination doesn't pass, I proceed to use the second site.

Second is Contrast Finder, this site helps me find a color that both passes the standard and is similar to my original color using an algorithm.

Closing Words

Thanks a lot for reading about my easy to incorporate but horribly named design stack.

I don't do any video, 3D, or professional vector work. That's why my flow might be lacking in these and some other areas, but I am sure that you can find something valuable to add into your own workflow.

If you have any suggestions or criticism, feel free to reach through my email.

Home Mail Me RSS Source
🔥⁠🐓