Square-centric SM Content Creation
This is an optimization of social media content creation process with Figma. The method is based on the use of components and the renaming combination CMND+R.
When to Use
1. you need to save time;
2. you need to post the same content on different social networks;
2. you need to adapt the visual for multiple publishing sites (social networks);
2. you need to adapt the visual for multiple publishing sites (social networks);
3. you don’t want to go to other content creation services.
Basic logic
1. Prepare all frames and name them according to proportion 2. Copy all frames 3. Create component from 1080x1080 4. paste instance into all frames and center it 5. rename all the frames with “cmnd+R” to “Name/$&” 6. export
Recommendations
In the case of the instastory, I advise you to create free space under the instance for content that is inserted inside the instastory editor. Sometimes I make a square under instance with background blur and insert another instance under it;
2. Backgrounds
a. Inside the main component сreate constraints for the content "center - center" and for the background "scale - scale". Stretch the instance to the width and length of the frame where you insert it.
b. Without touching the constraints, uncheck "clip content" inside the main component and increase the background to 1920x1920 (or to the width and height of the largest frames), without changing the size of the main component and center the background
Recommendations
1. Export directly to the cloud. If you share the folder, you can change the files inside it and URL will not change.
2. If you re-export it to the post_name folder, figma will create one more folder and you will get:
"post_name" folder in it: old 1:1, old 16:9 etc + "post_name" folder in it: new 1:1, new 16:9 etc. So re-export it to the folder where placed old "post_name" folder
"post_name" folder in it: old 1:1, old 16:9 etc + "post_name" folder in it: new 1:1, new 16:9 etc. So re-export it to the folder where placed old "post_name" folder
Please like this article. Next, I will tell you why this method is very good. There will be a lot of text.
Firstly, Most social networks have a preview that limits the photo to a square. For example, inside the Instagram profile, there is a grid that crops the post if it is not square. Using this method, you can create a 4:5 post to take up more space in the feed without clipping the content within the grid. It works in the same way with Medium - inside the media feed, the photo preview is limited to a square, and if the preview has an extension of 16: 9, then this method will avoid cropping the content in the feed preview.
Secondly, If you need to make a post according to templates, then you can do it as follows: a frame of different sizes that you copy and then paste into an instance can have additional visual graphics that do not change from picture to picture. This allows you to avoid unnecessary work inside the created main component because this is templating.
Moreover, the cmnd+R combination allows you to create folders and share them. This is extremely convenient for file management: unsuccessful versions do not multiply (if you are afraid of losing them, then I advise you to study how the history of changes in Figma works), additionally, you need to enter the file name only once and a folder with all sizes will appear. It's comfortable.
If you need to make different types of graphics, then this method allows you to stay inside one application - Figma. Fewer subscriptions, fewer downloads, and fewer headaches to figure out a new service.
And of course, this is really fast!
Check other social medias of this instagrams, where this method is used:
@stpshow
@iqprotocol
@stpshow
@iqprotocol
@tipagroup
Cons
This method is the victory of speed over aesthetics. It ignores the space on the side of the content block and this negatively affects the overall composition. Moreover, this method limits the ability to work with an image as a background.
Cons
This method is the victory of speed over aesthetics. It ignores the space on the side of the content block and this negatively affects the overall composition. Moreover, this method limits the ability to work with an image as a background.
---
thx for your attention and like!
---
If you liked my work and want to cooperate, then write to
---
Yours faithfully,
Georgi
