Translating Affordances
My choice of digital interface was Twitter mobile app. In particular, I wanted to recreate the infinite scrolling interaction.
Inspiration
I watched a documentary called The Social Dilemma on Netflix recently. It got me thinking more deeply about the design of social media feeds. By applying the design theory perspectives that I learned in class (about affordances), I wanted to deconstruct the most addictive part about social media — the infinite scroll.
For more background, I read a chapter by Taina Bucher and Anne Helmond called The Affordances of Social Media Platforms from the book The SAGE Handbook of Social Media (link to pre-publication print). It was very helpful in informing me about social affordances and communicative affordances, and generally thinking about affordances in a more relational perspective. For example, a “like” button has different social connotations than “favorites” button, and social meaning and perception can put weight into an interaction. This was in fact a major change in Twitter a few years ago that received quite some push back from long-term users.
I narrowed down my exploration to scrolling. Scrolling in a social media feed is a very multi-layered affordance. There is the action itself and its perception, but there is also the user’s relationship to the content. The uncertainty of what the next content will be and the satisfaction of discovery keeps the user scrolling for more.
I wanted to recreate this feeling and explore what would change if the interface was tangible. First, I looked at few screen layouts from the Twitter mobile app. I focused on just the home page and observed all the affordances (buttons, icons, fixed bars). Then I sketched out a few ideas on creating the scrolling system. There was also sense of layering — the fixed bars on the top and bottom were constant, and the Tweet button in the bottom right had a shadow, implying it was raised above the content. I thought of ways to show this in my tangible design.
“Scrolling is a continuation, clicking is a decision.” — Joshua Porter
Creating the Frame
I started with creating a frame out of a plastic container. This would hold together all the other parts, like the wheels and phone screen cutout. I measured each piece and cut out cardboard pieces create the phone screen shape. Then I sandwiched the wheels between the cardboard pieces, with just a bit of leeway so they could spin without sliding around too much. This is what I called the tangible backend (as it had a similar purpose as backend in software development, which was to store and manipulate data).
Once I had the structure and rollers in place, I started creating the feed. I cut out slips of newsprint paper and taped them to create a long roll of paper. I drew rough layouts of content feed mimicking what one would see on Twitter. Then I placed the paper over the rollers and tried to scroll.
The texture of the paper was a problem. It was too smooth and my finger would not stick to the paper enough to be able to pull off a nice scroll motion. So I had to attach some slips of plastic sheet over the newsprint to have a better touch feel. It is interesting how the texture of touch is a very important aspect of scrolling, but I never thought about it till now.
Finally, it was time to make it look like Twitter by adding the fixed bars on top and bottom and drawing the icons. I purposefully kept the scrollable strip more inlaid in the frame so that I could layer the frontend interface overtop. I interpreted shadows in the digital design (such as the Twitter button) as an indication of depth. These fixed bars also helped to contain the scrollable paper/plastic strip below it.
Learnings
I found new ways to see interface design elements like layers, depth, actions and social meanings. It was fun to create the scroll interaction with a long strip of paper going in from one end and the scrolled strip going out the other.
I also think that tangible social media is not as addictive — not because it isn’t satisfying, but because it simply is not portable. If we had to go this one particular device (maybe like a landline telephone) which receives printed information continuously like a fax machine, it would curb our habits considerably by the physical limitation of being able to use that device only at that location. Not to mention all the other material limitations like paper and plastic for infinite amount of media content. That would be unsustainable. But conceptually, it works and does well to deconstruct the designs of social media platforms with a content feed like Twitter.
