Can anybody tell me how to approach this layout ? Please see the attached image
Do I need to group the images/assets in figma and use it as background image ? that feels the most logical approach to me or do I need to place each image with relative/absolute positioning ?
3 Replies
Depends what you want to do with it , if you want any kind of parallax effect , how important the chart image and the gauge image are if they can go underneath other content at different screen sizes.
Personally I would have the globe by itself as a bg image , the little shooting stars in an image by themselves, a radial gradient underneath the globe then the chart and the gauge as maybe pseudo elements that are positioned with grid.
So black bg on bottom, then radial gradient, then globe then the trails/stars, then the chart and gauge that you can position where you need. I suppose you could just take all of it like this screen shot if it’s okay that the chart and gauge are cut off on the sides as the screen shrinks. Same that as the text wraps it overlaps the globe. Just make sure if you do that it’s very high resolution but optimized for the file size.
i was thinking of taking the globe ,the chart and the gauge and use them as bg image ,is it bad ?
Not necessarily , like I said depends on how you want it to behave . If you’re okay with some of it getting cut off on smaller screens then that could work