Illustration by Marco Brancato

Medium, User Experience and the New Landscape of Digital Publishing

The platform created by the founder of Twitter, a hybrid tool halfway between a social network and a publisher.

Jacopo Pompilii
Progetto grafico
Published in
8 min readNov 7, 2015

--

This article has been featured on Progetto Grafico, an international graphic design magazine published by Aiap, the italian association for visual communication design. The issue #28, “Publishing”, has been edited by Maria Rosaria Digregorio, , Silvia Sfligiotti, Stefano Vittori.

Stai cercando la versione in lingua italiana? Puoi leggerla qui.

The tools we use to publish content on the Web are many and varied, but they can ultimately be boiled down to two general types: social media, ideally suited for sharing ideas and news within one’s own circle of friends; and blogs, a platform for more comprehensive thoughts situated more in a publishing context. Both ecosystems display a need to expand their limits, altering and broadening their scope, the former toward a greater attention to content, the latter seeking better integration within social networks and their associated distribution systems. One example is Facebook, which has rolled out features to host journalistic content without linking to external sites, and which recently released the app Paper — designed by Mike Matas, the creator behind the award-winning interactive book Our Choice — that allows users to scroll through their newsfeed with an interface similar to an online magazine. Publishers are thus now in a position where they have to rethink their traditional publication systems, developing new forms of storytelling as a result, while users of social media find themselves in possession of increasingly advanced publishing tools.

Beyond 140 Characters

Straddling these two ecosystems is Medium, a platform dedicated to the publication of content, stories, or simply ideas, launched in 2013 by , who previously created Blogger (the well-known blog platform acquired in 2003 by Google) and Twitter.

Medium’s goal is to offer everyone a tool that removes the limitations of a tweet, with a user experience that is more streamlined than a blog. Blogs— the word comes from a contraction of the term “web log” — organise content in a chronological fashion, usually bound by a common topic and published at regular intervals. Williams considers these parameters to be a limitation, because not everybody always wants to talk about the same subjects again and again. With Medium, articles are the basic units of a dense network of content aggregated by tags, social networks, and editorial decisions. Compared to a blog, this structure makes interfacing with a large number of readers much easier.

Content First

Support for the development team was provided by Teehan+Lax, a Canadian studio with expertise in designing user experience (UX) for digital products. Among the many projects they also developed before being swallowed up by the Facebook Design Team was Readability, a service that saves text from different sources for later use in a layout optimised for reading. This content-first approach is immediately evident in Medium.

The interface, largely text-driven, is reduced to the bare minimum and does not appear intrusive on the screen, occupying a secondary role with respect to the content of the article during both reading and writing. Text, composed in ITC Charter with titles in FF Kievit, is displayed in a single column with wide margins on both sides (when viewed on large screens). Text size, justification, line-spacing, and other micro-typographical details are already preset and vary according to the responsive layout design, with values not in fixed pixels but in relative units that guarantee adequate proportions on all viewports. High-resolution images are prominently displayed, often occupying the entire width of the screen and serving as a story cover or breaking up long continuous blocks of text. The result is a distinctive layout that on the one hand frees the author from having to make design choices that he or she does not want or know how to make, and on the other ensures a pleasant and comfortable reading experience.

«We believe authors should have enough control to publish thought provoking pieces without being bogged down in type and color choices. We enable creativity through constraint.»

One of the greatest limitations of this UX-centric philosophy is that all articles end up looking alike. Matthew Butterick, a lawyer and type designer, finds that the homogeneous design of Medium not only does not support innovation, but is actually an astute manoeuver to give all its articles created by users — mostly for free — an aura of authority and heft that the platform struggles to achieve on its own. If the price to pay for good design is having to cede to the platform every decision regarding the publication of content and the way in which it is enjoyed, Butterick continues, then perhaps it might be worth looking for another, more flexible alternative.

Whereas the traditional typewriter offered freedom at the cost of design, the billionaire’s typewriter [Medium, ed.] offers convenience at the cost of freedom.

What You See Is What You Publish

This process of simplification concerns not only the visual aspect of articles, but is also closely connected to the way in which they are composed: Medium’s text editor is the feather in its cap in terms of usability and engineering.

Usually, online WYSIWYG editors (“What You See Is What You Get,” referring to all those writing systems that show formatting and layout in real time without needing to employ a particular code or syntax) require two quite distinct phases: the composition of text, with the interface and various functions depending on the platform in use, and its preview once ready for publication.

An article published via Wordpress and its back-end interface, which allows for the insertion of text. Although Wordpress editor is WYSIWYG, the actual front-end output is different: two distinct buttons for preview and publish actions are provided.

As Karen McGrane argues in an article published in A List Apart — the top online magazine for those who design and develop for the Web — editors of this type present many different problems.

«The preview button is a lie.»

The preview function does not take into consideration the countless variables that influence the layout adopted by the user — their device, screen orientation, and personalised text size are only a few of the plausible examples. Returning to the acronym WYSIWYG, it’s not actually quite so clear what one gets from what one sees. On the technical side, tools of this type also frequently generate impure HTML code, creating visualisation problems on different outputs.

The publish button allows users to choose the article’s license and visibility.

The team at Medium has succeeded in resolving both issues through an editor that erases the division between writing and publication: “What you see is really what you get”. One need only type some text or insert images to see the result right away; selecting a portion of text will bring up the relevant available formatting options, otherwise hidden so as not to distract the user. At the same time the structure of the page is also updated, with a rigorous mapping between what is displayed and what identifies it semantically in HTML. The separation of content and form allows the site to provide the appropriate style for different outputs, printing included.

The CSS for printing allows for different rules to adapt the content to paper format.

To achieve this result it was necessary to sacrifice certain formatting options, limiting users’ choices to the bare bones — no ability to change font, text size, or colour, nor to underline or strikethrough text — which Williams claims allows users to focus better on content.

Medium is not the only tool to go down the content-first path. Byword and iA Writer both, for example, allow users to write in environments free of distractions, with an interface called WYSIWYM: What You See Is What You Mean. To mark structure, however, they use languages — like Markdown, created in 2004 by John Gruber — that require concepts or skills not always within everyone’s grasp.

The graphic shows the increase in Google queries for the term “longform” from 2004 to today. Related queries are ‘longform’ followed by online magazines (e.g.: “longform slate”, “longform buzzfeed”) which regularly publish articles in this in-depth form of storytelling. (Source: Google Trends)

Longform and Social reading

Medium is often described as the platform for long-form journalism, a tool well-suited for more in-depth or investigative stories, particularly on digital devices that can best exploit multimedia content and are not hindered by space limitations. In 2013, it acquired Matter, a magazine focused on topics related to the world of science and technology, thus becoming to all intents and purposes a publisher in its own right. Despite this predilection for midlength articles, Medium was created with a more democratic intent: to be a space where one could express and share ideas with one’s friends — even briefly, since length is certainly no indicator of quality.

From the top: excerpts from longform articles published on Buzzfeed and The New York Times. “The Aftershocks”, journalistic inquiry about l’Aquila earthquake, has been published in 2014 on Medium and made available also on Nook, Kindle and iBooks.

Comments in the margins provide space to start conversations in parallel with the content of the article, and it is also possible for a user to highlight particularly interesting parts of the text, leaving tracks behind for future users. Sharing on Twitter is immediate, bypassing the 140-character limit by taking advantage of so-called screenshorts, images that contain screen- captured text. This functionality includes an important level of metadata, the cornerstone of a system comprised of both authors and readers that allows for continual exchanges between engaged users, transcending the limitations of analogue marginalia, as the designer and writer argues:

«Analogue marginalia doesn’t know other analogue marginalia. Digital marginalia is a collective conversation, cumulative stratum.»

Marginalia help erase the static nature of a digital artifact, enriching it every time with new content. (Graphic by Craig Mod from his essay “Post-Artifact books & Publishing”).

Carrying this perspective further, Medium, from a simple provider of advanced tools for writing and publication, may well find itself possessing increasing editorial weight — incorporating authors, readers, and content within its own platform — at the expense of all those investing in digital publishing who are focusing solely on ebook readers.

--

--

Jacopo Pompilii
Progetto grafico

Helping Italy going cashless and a bunch of other stuff @PagoPA @IOitaliait , Prev @frogdesign 🐸 Advocate of common sense.