Introduction:  Welcome back! In the first post in this series, we delved into the world of DIY UI design for embedded systems and introduced the concept of using off-the-shelf UI Kits and Element Packs. Today, we're taking the next step in this journey. You've chosen your UI Kit, and now it's time to extract the assets you need to create a cohesive and visually stunning user interface. This blog will focus on two popular types of UI Kits: Photoshop documents (.psd) and Figma files (.fig). We'll cover the essentials of working with these files, ensuring you can efficiently and effectively extract the elements needed for your embedded systems project.  Getting Started with .psd UI Kits:  Opening the Kit:  While Photoshop is a widely used standard of the design industry, it may not be acceptable for a myriad of reasons. There are several free or cheap alternatives, but Photopea.com has become my editor of choice when I need photoshop effects and filters, i.e. the fancy stuff that makes it look professional. When choosing your editor, make sure the opened file looks just like the website preview and that you do not need to flatten or merge any layers upon opening the file.  Left: .psd imported into Photopea.  Right: Watermarked preview from CreativeMarket.com     Exploring Layers and Groups:  The best .psd UI Kits are like well-organized filing cabinets, with each layer and group neatly labeled and structured. Start by familiarizing yourself with the layers and groups in the file. There should be logical hierarchy, making it easy to locate the elements you need. Look for layer groups named "Buttons," "Icons," "Backgrounds," etc. This organization is your map, guiding you through the design assets.     Customizing Elements:  Before extracting, you may want to customize certain elements to match your project’s theme. Change colors, adjust sizes, and tweak designs as necessary. For instance, if you have a button that needs to be a different shade to match your brand’s color scheme, now is the time to make those adjustments. If you are new to these tools there is a large user community out there to help with video tutorials. Still uncomfortable? Check out our Design Services.     Removing Embedded Text:  Most UI Kit files come with text layers that you might not need but are there to provide examples of what it could look like and offer a suggested font that pairs well with the design. To ensure the elements are ready for use in your embedded system, you will either need to remove any embedded text layers or create duplicate copies of each item for all possible labels, including any translations. It might seem like a no-brainer to remove the text, but that is not always the case. This choice might depend on the effects used on the label itself, such as glowing letters. Also note that many embedded systems do not have the full suite of text editing features that you have in graphic design tools, so dynamic text may not look as good as the text shown in the .psd file.     Exporting Elements:  Once you've customized