How to Use UI Kit’s, Beginners Video Tips

20 Comments

Hello dear readers! We have lately gotten a bunch of e-mails containing questions on how to use our UI Kits and inquiries on the best methods on using them in Adobe Photoshop. Most of these questions are for beginner Photoshop learners. This is why we have decided to make a video containing the most frequently asked questions. This way you will have the possibility to see how you can work in Photoshop by seeing real examples. This video was made by Sergey Shmidt that is here to help you in knowing more on the simple elements, but essential in Photoshop.

This video was made so that it would be related to the Impressionist UI, but the working techniques would be the same with all the PSD files. The video is mostly meant for beginners and we really hope it would help all of you work more efficiently in Photoshop.

How to Use UI Kit (HD + Full Screen)

The video contains Quick Tips (Adobe Photoshop):

1. How to make a simple web design

Here you can see how Sergey created a simple User Interface with the help of Impressionist UI. It contains the login box, newsletter and Carousel. In the end what he achieved is a clean, simple but elegant design.

2. How to resize components

The second video will showcase how to resize elements without quality loss. As an example we have a simple menu that will be extended in order to add one more section to it.

3. How to change the color of components

The color of the components you have can be easily changed and adapted to the existing design or to a totally new design. You can personalize the elements the way you would like to.

4. How to use styles of UI Kit

Do you like the style of a certain button, or maybe the shape of any other elements in the pack? You can save it and use it as any other element you would want to create if you don’t see it in the Impressionist UI pack. This way you can create a design with the same style with other elements from the pack without using other styles in the user interface and try to upload the final visual design.

5. How to use vector icons (with UI Kit)

This video will show how to use a simple icon in order to personalize a button, this way it transforms in what you would want the icon to represent. You will also learn how to make the design so that the icon looks the same as all the other elements around it.

6. How to export (save) images for web

The last part of the video shows how to quickly and easily save newly created elements or the ones you have in Photoshop already transforming them from PSD to any other available format (PNG, JPEG, GIF etc…)

Andrian Valeanu

Designmodo Founder. 🛠 From 🇲🇩, based in 🇪🇸, I speak 🇷🇴 🇷🇺 🇪🇸 🇬🇧, my activity 🖥 🤘 ⚽ 📸 🌇.

Posts by Andrian Valeanu

Super-Intuitive Drag & Drop Template Generator

Create beautiful responsive emails and newsletters easily.

Learn more Try Free
Cookie Icon
We use cookies to ensure that we give you the best experience on our website.
  • I disagree
  • I agree