Understanding Icons in Composer

Understanding composer at a very basic level is important to start understanding how to use it. One of the things that kept me from using composer to make even the simplest of themes was the fact that I didn't understand some of the basic interactions of it. Most people don't have the patience to sit down and read the help and users guide and if you do then you may find them tedious and confusing anyway.

If you place a new icon on the canvas, and then click on the edit tab in the upper left corner. it will take you into a new screen where you can edit the inner workings of the icon.  When I first started trying to figure out composer this screen really baffled me.  When you understand what the 4 separate sets of frames mean it will unlock some understanding of  the really basic functions of composer.  This is the screen you need to be in to add a focus icon to your svg files(the lack of a focus icon has to be the #1 issue I see with svg based themes, since 3rd party apps rarely ever have a normal and focus icon not having a focus icon in your theme can cause issues for the user)

I think the next bit that I share will be on how to insert a focus icon when using composer

*disclaimer-i am writing from my own perspective and still learn new things every day, I am sharing tid bits of information that I have found enlightening or helpful as I have learned and grown as a theme designer*