Case Study: Understanding and Applying Effective Social Media UI

Social media is a modern powerhouse for influence, advertising, and reach. Social media platforms have been a cornerstone of the modern internet environment with some platforms having user bases well into the billions. While each large-scale social media platform applies various techniques to separate themselves from the rest, each of them have the same basic underlying traits. 

The Objective: To understand what makes a social media platforms application effective in terms of user interface and user experience and apply these techniques to a self-created social media platform of my own. 

The Platforms

I am going to primarily follow four prominent platforms: FaceBook, Instagram, Twitter, and LinkedIn. Each of these platforms are immensely popular because they excel at each of their own niche. FaceBook excels with the idea of connecting friends and family, Instagram excels with image sharing, Twitter excels at being more laid back and easy going, and LinkedIn excels at being professional and acting as a job-based ecosystem.

While each platform differs in what each excels at, functionally they are the same. These platforms share the basic principles of social media – the ability to easily connect with others, the ability to freely communicate with other users in the community, and easy to find, curated information. 

The Research

Taking a look at two of the most popular forms of social media (Instagram and Twitter), they both have similar layouts. Directly as you view the profile, you are presented with the user’s profile picture, name, username, statistics, and posts. Consumers like the feeling of familiarity, which is why this formula, while slightly changed for each platform, is the primary social media formula.

I conducted a small research group of 10 social media users that varied in both interest and familiarity with multiple social media platforms. According to those interviewed, the key ingredient to what makes a good platform is how easy it is to find the information they want. For example, an Instagram profile should the images front and center as the first thing anyone sees or a Twitter profile has the most important/best tweet (a pinned tweet) as the first thing someone sees.

Ease of important information, friends, and relevant content are the most important factors of social media and need to be heavily considered when creating an effective interface. 

Sketching The Idea

The idea I wanted to create is a profile page for a social media application that’s focused on record collecting and sharing.

Creating a wireframe/early mockup beforehand is a good way to get an idea of what the UI will look like. It’s something that takes barely any time and can be changed on the fly. 

Because this is an app dedicated to record collectors and enthusiasts, instead of having the posts front and center, I wanted to have the records as the main attraction to a profile with posts being a bit further down.

Wire-Framing

Taking the sketch and virtualizing it into a wireframe brings the idea to life. With everything laid out as it would be seen on a touchscreen, it shows a simple yet effective profile design that can be understood and navigated by anyone. 

Click edit button to change this text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Prototyping

Taking the wireframe and bringing it to life is the idea behind prototyping. The profile has a strong focus on the record-collecting aspect with room for a personal wall below, where other users can interact with each other furthering the social aspect. 

Mockups

Using a phone vector from Rawpixel further enhances the visuals of the design. The layout is familiar, warm, and can be understood by anyone with just a few minutes with the app. 

 

Conclusion

An effective user profile interface is bold, easy to digest, and has a proper hierarchy. The record enthusiast social app that, for now, I’m going to call “RecordBook” should have a focus on records first and foremost. The hierarchy of the user profile deliberately opens to only show the user’s introduction and their records only while scrolling down reveals a further social experience. The objective has been completed.