interactive layout

On The New Reblog Style

As many of you, I’;m unsatisfied with the new reblog style on Tumblr. In this post I will try to explain why I think this is a fundamental change in the way users interact with Tumblr.

Conversation versus Comments

Before I go into the visual impact of the new layout, I want to discuss the different styles of interaction between users on social media. I broadly classify it in conversation style interactions and comment style interactions.

In conversation style interactions, the users engage in a conversation. In subsequent post of users the topic changes. In this style users more often interact with the latest post than with the top or first post. This in contrast with comment style interactions, where users mostly respond and interact with the main post and there is hardly any conversation occurring between the users.

While hardly any social media falls solely within one category or the other, some forms of interfaces nurture the conversation while others don’t. Examples of conversation style interactions are Reddit and Tumblr. In Reddit the reactions on reactions can make for a very different conversation than what the topic of the original post was. On the Tumblr the reblog layout also nurtured responding to the last addition to the post instead of responding to the original post. Note that both make/made use of the pyramid bar style, with the difference of whether the original post is all left or all right. 

Both Reddit and Tumblr have features to foster quality conversations. In Tumblr good additions are reblogged more, while in Reddit they are upvoted.

Examples of comment style interactions are Facebook and Youtube. Comments respond directly to the original post and have a lot less interactions between each other. Another example is the new Tumblr layout.

The conversation style combined with blogging made Tumblr a unique platform. It fostered creativity and discussion. Comment style interfaces mostly encourage one-way sharing.

Visual Cues

A very strong feature of the pyramid layout is the visual cues it gives to the reader of the post. The new layout has hardly any.

Reblogs no longer visible
In the pyramid it is immediately clear whether you look at a reblog with additional comments or a reblog of the original post only, in the new layout there is no difference between these two.Let’s take a look at the example below, though would be even more clear with a more text-heavy post:

On the left the pyramid style is shown. It is immediately clear that there are different reactions to the post. on the right is the new style, where the reactions are invisible to the user initially. To discover the reblogs one will need to scroll down, if one was already familiar with the post and a number of the reblogs one would have to scroll down completely to see whether there are new additions to the post. Personally I hardly do this, since I use the j/k keys to go through my dashboard, in which case additions in reblogs really won’t be visible anymore.

Location Cues
The pyramid style gives the reader a great cue on where they are in the conversation. The number of bars next to your text basically summarizes how many more comments follow in this post. Below is an example:

This of course works both ways, the new layout gives no clues where you are in the conversations, and thus does not support conversation style interactions.

Referral Cues
The old layout intuitively encourages reactions to the latest comment, due to the closeness and indentation of the text. Since in the new layout any form of indentation is missing (It’s basically a list), it seems more like all comments are equally given in reaction to the original post only.

Length of Posts
The new layout also adds more non-content space to a post, specially in the vertical direction. This means users will spent relatively more time scrolling in comparison to reading. For the user this means that interacting with Tumblr will feel more like a choir, while there is less material to keep the user engaged on the screen.

Iconography of the Bars

I think it is important also to realize how recognizable the pyramid bar was. Tumlblr posts, and specifically the interactions between users where often shard on other platforms. There are reddit and facebook groups dedicated to just that. Often these are screencaps of the iconic reblog style of Tumblr. This made Tumblr a unique and recognizable brand. Bur it also happened because Tumblr was one of the few places that facilitated this style of conversations.

Part of the reason of this update was to make it easier to share what is happening on Tumblr with facebook and twitter. However as a result, one of the main qualities and unique products of Tumblr was sacrificed. One could wonder what there is left to share, which could not be better shared on the other platforms in the first place.

Redeeming Qualities?

There are two points on which the new layout performs better. However their implementation does not foster conversation and is, in my opinion, not in the best interest of Tumblr.

The first thing it does is that the comment is actually connected to the writer of the comment, as is shown below.

This might help to give credit where credit is due and makes it more easy to find the people that make interesting comments. However This could also have been implemented without getting rid of the conversation style interactions. A great example of this is Reddit, which maintains a pyramid like layout, but does keep the author close to their comment.

The second thing is readability of the individual text blocks. The original layout had a tendency to narrow these when there where many reblogs and additional comments. In the new layout all of these have the same width. However, this problem is also worsened by the narrow layout of post on the dash to begin with. There are many other solutions which could have been found for that. One could look again at Reddit, which simply has a wider layout. Another option could be to included a button which could make post wider, and thus more readable. Note also that this is only a problem with post with a very large amount of reblogs.

Conclusions

I think Tumblr is throwing away the baby with the bathwater. The new layout fundamentally changes the way users interact with each other on this platform. It does not encourage users to interact, and by doing this eliminates one of the best and main defining features on Tumblr.

I have enjoyed Tumblr over the years because of the constructive environment and because of the conversation I’ve found here. I hope the layout update is retracted, because I think this important element of this community will note return in full force.

If you agree with me, please share this post and, maybe more importantly, please give feedback to the staff here.

anonymous asked:

Your tumblr has become a Haven for me. When given a project, where do you begin with your brainstorming? Also... in your professional career, what software/hardware have you/do you use? :)

Thanks for the kind words, it is definitely encouraging to know if I could help anyone help in any way.

Brainstorming is a very haphazard and less organized process though I don’t mind it—but sometimes not being rigorous about ideation leads me to reach into my old bag of tricks that I normally use. I think in a professional setting, the demands in turnaround time and my own desire to do something new have required me to be a bit more rigorous. In school, professors have always emphasized sketching and keeping a sketchbook but I know this isn’t really me. It never felt natural, to keep a book open and spend the time to articulate an idea indirectly and whatever I sketched never ended up translating well in the works final form anyways. Also, sketching is more or less restricts concepts to their formal qualities which isn’t what I prefer. Sketching to me mostly is writing. I keep a combination of a text editor—to jot down my thoughts, what I think the work should embody, etc. I also keep a blank illustrator document. My visual sketching is more like drawing boxes for layout composition and quickly setting lines of type with maybe a a drawing with the brush tool.

As far as my software workflow I can speak a little bit about that.

I use iA Writer for writing whether in prose or markdown,  Sublime Text for coding, and iTerm for my command line interface.

My iTerm setup is usually three windows in a tab, the top is for general command strings (cd/open/etc), the second section is automated task management (I use Yeoman for streamlining new projects, Grunt for task management, Bower for package management—though to be clear the last two are bundled with Yeoman), the third is for firing up an HTTP or rails server for the project. Version control for projects are taken care of by Git. I also launch a local Apache/MySQL server using MAMP from time to time.

For design, I use the Adobe trifecta of InDesign, Photoshop and Illustrator. I often first start with illustrator because of it’s typographic abilities + freeform ability before moving to Photoshop or InDesign. I’m currently also learning Sketch but so far I haven’t been convinced to switch over. For websites—this may be heretic—I use InDesign for it’s ability to create multiple pages on the fly, powerful layout and interactive features, and for it’s ease of converting wireframes to UI designs. Books are also done with InDesign.

Video editing is done with Adobe Premiere because of its ability to sync up with Adobe Aftereffects, which I use to prototype site animations and create motion graphics. Occasionally I will break out MAXON Cinema4D for 3d animation/modeling.

For daily backups, I use Backblaze. It’s a really great and inexpensive investment and lets me sleep easy and I never carry a physical drive with me anywhere now for transporting files. For managing a project between two machines, I use Dropbox with a combination of MacDropAnywhere which lets me link any folder in my file system to Dropbox for easy management. Current projects are always linked this way for easy access.

For messaging, file-sharing in group projects I swear by Slack.

For drafting estimates and invoices i use Ballpark. It is linked up with Stripe, an easy payment system so clients can pay with credit card if they like.

Presentations are also handled by InDesign but hoping to fully convert to Reveal.js by the end of summer.

Websites are hosted on a VPS server by Digital Ocean. If it’s not a rails app, it is typically a LEMP stack (linux, nginx, mysql, php)  SFTP is handled by Transmit, which lets me mount my directories as a drive.

For hardware, I go back and forth between a 2013 iMac 27-inch for my office and a 2011 Macbook Pro for my home. A Mobee charger is used to charge my magic mouse and keyboard through wireless inductions so I don’t have to worry about taking the batteries out. My laptop is usually hooked up to a 23 inch Cinema Display monitor. In this case, my work software is on the large monitor while passive activities such as my web browser are on the laptop. I also have a Raspberry Pi that is poorly neglected.

Email is handled by Sparrow for desktop and Mailbox.app for mobile.

Font management is handled by Linotype FontExplorerX.

Hope this helps.