It’s time for a universal interaction language
Over the past months we’ve been hard at work improving Sharesome’s infrastructure, performance and security. As part of this effort, we switched to a Single Page Application, which allowed us to improve page loading times and get closer to a native app feel. We’ve also implemented a much needed caching system, which has dramatically improved loading times for posts, profiles and topics.
When it comes to product development, we generally follow the lean startup methodology of shipping minimum viable products or features fast and starting the learning and improvement process as soon as possible. This has allowed us to completely overhaul the platform over the past year. It is now time to look at the fundamental UI elements that make up Sharesome and make sure they’re on par with the standards we set out for ourselves.
The visual concept of a post
When the post was invented in 2003 we didn’t have the modern mobile web and we wouldn’t have it for another 5 years. The standard pointing device was the mouse, not the index finger.
Let’s consider the concept of a post. When picturing a post, what most people think about is some sort of media content or text and a set of buttons that dictate how you can interact with that post. This is what Facebook and the early social networks taught us and back then it made perfect sense. When the post was invented in 2003 we didn’t have the modern mobile web and we wouldn’t have it for another 5 years. The standard pointing device was the mouse, not the index finger.
Double-tap to like has now become the standard. More gestures are coming as well.
Back then, people did not have the notion of directly interacting with content. It sounds weird, but it’s true when you think about it. How did you play a video? By clicking on the play button. How did you like a post? By clicking on the like button. How did you turn on the lights? By flipping the light switch. You never got to interact with the actual thing.
Now, this is no longer the case with touch devices. You now interact directly with the content. It’s just you and the content — nothing else. How the interaction happens is not important. The location of the content (online or offline) is also not important. The spatial dimension (real or virtual) will soon become irrelevant as well. It’s just us and the things we want to interact with. And eventually it will just be us. But until then, let’s go back to our posts.
We can see the transition away from interaction buttons in the post-desktop social media apps like Instagram, Snapchat and TikTok. Double-tap to like has now become the standard. More gestures are coming as well. If we zoom out, what we are currently advancing towards is a universal vocabulary of interacting with things. We will probably double-tap things to like them in VR, too.
Transitioning away from interaction buttons is a huge step and can only be done fully or not at all. For it to be done fully, the gestures must be better than what they are replacing in every way and not just a bit better — they have to instantly make buttons irrelevant. The way finger scrolling immediately made the scroll wheel irrelevant.
An important caveat is that these changes can only happen when everything else is ready for them. Electric scooters are not fundamentally different now from what they were 20 years ago. Yet Segway failed to drive adoption back then, while the electric scooter market is now exploding. Why? Because of smartphones and the new culture of solving real world problems through technology, inspired by companies like Uber and Airbnb. Now that the world is ready for electric scooters, there’s nothing standing in the way of their growth.
So let’s see if today we have the basis for a universal language of fundamental interactions — starting with the most common interaction of them all.
Like
The like is not going anywhere. Its fundamental gesture is now the double-tap and it will likely stay that way for a long time. This will, therefore, be our first fundamental interaction.
Peek
The Peek is nothing else than a single tap on the content to reveal additional useful information, like tagged people (for photos) or controls (for videos). It’s so intuitive that we do it all the time, like when we tap on a video to check how much of it is left.
Save
This is mostly obvious in hindsight. To test it, scroll up to the nearest image in this article and try to save it within 5 seconds (screenshots not allowed). If you are on desktop, you right clicked and selected “Save image”. But if you are on mobile, you probably long-pressed. We are so used to this that it comes natural, but we don’t realise it because we’re not accustomed to using it in the same context in which we use the Like interaction.
Tip
This is a newer type of interaction, but its popularity is quickly going up, so much so that Facebook has recently implemented it, while other platforms like Reddit and Twitch had it for a while. In general, it seems that people are willing and eager to tip small amounts of money for valuable content.
Conceptually, the tip is a Super-Like. Unlike the Save and Share, the Tip always implies a Like. In other words, just because you saved an item, it doesn’t mean you want to notify the author that you like it. And just because you share something, it doesn’t mean that you like it (for example, you may share an article in order to criticise it).
Because the Tip is the only super-like, we can incorporate it on top of the Like. After double-tapping something to like it, you may keep tapping to send tips. Each tap is a tip. The more you like something, the more you tap it. I’m sorry, Medium, but you cannot give 50 claps by joining your palms for 10 seconds. It’s just not how it works.
That’s it — at least for now. This is all that we really need. If you were expecting multiple-finger swipes and other contrived gestures, I’m sorry to disappoint you.
These interactions are perfect for feeds and grids, which are basically the ways in which we consume content. They allow us to ditch buttons and focus the UI on the content itself. But hey — where’s the comment? Where’s the share?
This is where the last interaction comes in.
The Attention interaction
After a certain amount of time, the probability is high enough that it makes sense to spawn the comment field underneath the post. Finding this threshold is then just a matter of algorithm tweaking. Ladies and gentlemen, this is the Attention interaction.
Like, Tip and Save are “quick” interactions. By quick interactions, I mean interactions that don’t require mental strain and can be done almost instinctively. Technically, these actions can be identified by their very small reaction time (the time that passes from when the user sees the content to when the interaction starts). Then there are “slow” actions that take more time and require more mental strain, like Comment and Share. A very common mistake that many product managers make is to either try to speed up everything, or slow down everything. In this case, we don’t want to make sharing lightning fast. We want it to remain a deliberate, thoughtful action.
If we dive deeper into this, we can use reaction time, or better, time elapsed since the user started looking at the content, as a function of how likely they are to perform a slow interaction like Comment or Share. After a certain amount of time, the probability is high enough that it makes sense to spawn the comment field underneath the post. Finding this threshold is then just a matter of algorithm tweaking. Ladies and gentlemen, this is the Attention interaction.
When looking at the content for a few moments, the user will thus be presented with subtle options to interact with it in deeper ways, like commenting and sharing.
The Attention interaction also allows us to hide the post header, which usually contains info like who posted the content and the date when it was posted — and only display this information once we know that the user is interested in the content. We can also use the Attention interaction to hide interaction counters (like the number of likes, shares, etc) in the initial view. This will allow us to focus the user experience around the content itself, instead of on some vain popularity counters. This also seems to be the direction where platforms like Twitter and Instagram would like (but maybe lack the courage) to be heading towards.
Did I miss something?
In this article I’ve laid out a basis for a universal interaction language. I’m sure that, in time, more actions will be added to the list — but in the meantime, I want to hear your thoughts. What are the most important interactions and gestures to include in our universal interaction language?
