Profile background image templates for corporations (edit: see limitations in 2nd post)
I figured I should share these templates I made for the OG Art Challenge. These might be useful to people designing their Corporation’s background images.
I have reconstructed all the elements on top of the background images (like profile image, username etc.) on separate layers so that you can see what areas of the image will be blocked by these elements while designing.
The profile bg template has a safe area which will be visible in all screen sizes. So you can place the logo of your corporation or something else important in that area. The profile bg is double sized because the image will be streched bigger than 100% in some screen sizes which would make it look blurry.
.
I just noticed one fatal flaw in these templates. If you have any description in your profile the template completely falls apart because it changes the height of the profile bg area. The longer the description text the bigger the problem:
.
For these templates to work your bg image has to have the width and height in same proportion as the width and height of the bg area in your profile. Needless to say this makes a standardized system practically impossible. But if you still want to know exactly what your profile background will look like then keep the width the same as in the templates and match the height to the height your profile bg area after adding all the description texts and web adresses. And since the profile bg template is double sized you will have to make the height twice the size as well.
The image area seems to grow downwards as you add more text, so if you match the height you only need to add new stuff in the lower part of the image. The area above the transparent grey box will stay the same.
This was supposed to be simple but it ended up extremely complex.
You can’t make the image taller by default so that it would just be revealed when the profile bg area expands. You need to make it EXACTLY in the same proportion as your new profile bg area with the decription text added. If you make the image taller (or shorter) than the actual height of the area it will center it vertically (taller) or crop it badly (shorter).
