Why do nearly all the social media platforms have nearly the same layout for "user's post" and how can I implement similar layout in my design?

Question

So I am making an art sharing app ( image sharing ) and have noticed that nearly all the existing social media platforms have similar layout for user's post.

e.g.

1. Facebook

2. Instagram

3. Twitter

Now as it is quite clear from the above pictures that they follow a similar layout which goes something like this :

1. Profile photo and user name, with follow button if user isn't following that user.
2. The caption, description, tweet etc.
3. Images ( if any ) ( in case of instagram, point 2 and 3 are interchanged ).
4. Then comes the interaction button.

My question is why all of them have Poster's name and profile photo ( optional ) above the content of the post and not below it ? What is wrong with having the poster's name and pic below the main content ? And also, in most of the cases, description is above the image ( if any ) ? Is it because our eyes start reading from top to bottom ?

If so, how can I improve the layout of my app which is just the opposite and quite frankly looks not that good.

Layout of my app :

Red area is for the image ( which is the main content of my app ), I want at least 70% of the users screen to show the image, also I don't want to overlay any buttons or text on the image cause it can hide important details of the picture. What can I do make it look more good and at the same time easy to use ?

Answer 1

I have a tendency to practicality in almost all areas and in this particular case, it's even evident.

If the reading of a post with its content is descending, that is, scrolling up the content on the screen to see the following, if the image appears first and then the details Option B, there should be a very exaggerated dividing element to indicate this content belongs to the top element and not to the one below on the screen. Something to my understanding, quite impractical, no matter how many design adjustments can be made.

While in the "standard" layout Option A, this dividing element is the name, author, title, and/or description of the image that follows, the natural option.

Following Option A, as the content scrolls up, the new descriptive text announces that we will see the next post, while in Option B there will be a time when the description of the upper content is next to the lower content, leading to confusion and forcing the user to scroll up to return to see the detail of the description image.

If the goal is to innovate in design, I would recommend studying all the possibilities beyond exchanging elements from top to bottom, such as in a line from left to right, right to left, or diagonally.

Answer 2

I think you'll find that social media websites are constrained by two design considerations.

The first relates to the influence of the person creating the post rather than the actual content, as social media websites focus on the people sharing the information more than the content itself most of the time. Of course, unless you are using it to discover new content from relatively unknown people, which is a valid reason to prioritize content, however it is much more difficult to do so effectively.

The second point relates to the simplicity of the content in common social media apps, and that to design them for quick browsing and consumption the basic design and layout need to be simple and consistent for scanning.

If you combine these two reasons, it probably accounts for the similarity across most social media platforms, but you may also look a bit beyond the big players to find some inspirations or examples of alternate designs that focus more on content. I also agree with @musefan about the fact that ideas can work well if it is well designed and executed so you don't need to be limited by this, although you should recognize the trade-off from veering away from convention.

Answer 3

Mostly because if you want an intuitive interface, you have to follow the design patterns everyone already familiar with. Currently, for mobile first/best experience, this pattern is the most intuitive. Easy to scan and understand, even a new user without any onboarding is capable to use it.

Your question:

It depends on what you want to achieve. First, you did some best practice research already, only appropriate conclusions have not yet been drawn. So compare these findings with your hypotheses. What do you want to achieve with your app and with this layout? On other social media sites, the content creator is on the top, because the whole social media ecosystem is about the users, the content creator itself. So they must be recognizable. The content is in order by who posted them and not by the content. With your layout (creator at the bottom) the content is the most important (see Pinterest ...or any web shop for example) where the content discovery/discoverability is the key element. You have followed the rules of creating a web shop with products where the content is grouped, categorized.

So going back to what I wrote at the beginning, you want to use a different design pattern (web shop) on a social media platform. It is doable (Pinterest), but then the purpose of this social media app is different from others.

*Patterns simply explained: If you design a family home, it should look like a home, and not a barn because people can confuse it. If you design an office building, people want to use it as office and not as a museum. Or a very extreme example, if your lighter looks like a gun, then a police officer probably will recognize it as a gun and shoot you. So do your best practice research and follow these patterns because they help you to create an intuitive user interface.

Answer 4

I think you know why it feels correct to put the art above the poster's name in your app. Here's my guess - when we're browsing art, we viscerally recognize the art before we connect it to the artist. I can see Yayoi Kusama's work in my Instagram feed and know it's hers. I will Like it or react to it without considering the source.

On other social media platforms, we're more cautious about considering the source before reacting, because our reaction will be seen and judged by others. We don't have that "snap judgement" ability scanning ordinary social feed photos.

I think your overall structure is fine with one small tweak - move the tags all the way to the bottom. Artists crave exposure and often use dozens of tags on each post.