Designing the Article of the Future

Elsevier's User Centered Design specialists show how they worked with users to transform the format of online articles

<strong>The Article of the Future User Centered Design Team team</strong>   (main photo, left to right): Stefan Kuip (UCD software developer), Rogier Barendregt (UCD front-end designer), Frans Heeman (project manager and UCD lead for Psychology & Cognitive Science), Elena Zudilova-Seinstra (UCD lead for Paleontology and Mathematics/Computer Science). Headshots: Beate Specker   (UCD lead for Electrochemistry) and Martijn Klompenhouwer (UCD lead for Parasitology & Tropical Diseases, Materials Science and Business Management). 

The Article of the Future is an ongoing project that explores better ways of presenting online journal articles and enriching their content. The project team worked with more than 150 people in the scientific community to come up with the prototypes for the current design. Since last year, all articles on ScienceDirect have been in this more dynamic format. Dr. Elena Zudilova-Seinstra, who has worked on this project for nearly three years, writes about how they learned from users and presents the findings that led them to develop this new layout.

The Article of the Future initiative aims to revolutionize the traditional linear format of the academic paper to make it more dynamic and user-friendly. Following changes made earlier this year, which improved in-article navigation and readability, the ScienceDirect online article is now entirely transformed into an interactive HTML format.

Through one-to-one user interviews, group discussions. and observations, usability tests and on-site visits, we gathered in-depth knowledge of user needs and workflows for each field. Our main goal was to offer new content and tools that would help researchers in their specific scientific needs, hence avoiding the "one-size-fits-all" solution. After Cell Press demonstrated initial concepts for life sciences and got feedback from the scientific community, 13 new prototypes were created for seven new subject domains.

More than 150 researchers, authors, publishers and editors participated in the project. They suggested various ideas of how articles in their research field could be improved taking full advantage of today's online capabilities. The most interesting ideas were prototyped by our team. Prototypes varied from simple sketches to complete functioning systems. All ideas and prototypes were discussed and evaluated in online user forums set up for each domain.

Guiding principles for design

[note color="#f1f9fc" position="right" width=400 margin=10 align="alignright"]

3 guiding principles

The Article of the Future prototypes were designed to get maximal user value out of the online article. The three guiding principles for the new article format are:

  • Readability. Make the article the center of the design, with typography that makes it easier to read from the screen.
  • Discoverability. Present content and functionality at the right place on the screen and the right time in the user's workflow.
  • Extensibility. Have a generic layout that can accommodate subject-specific content enrichments without sacrificing readability.[/note]

From the very first stages to the end of the project, reliable and structured user feedback was used to drive the direction for the Article of the Future design. Our findings clearly indicated that there is a definite need for discipline-specific improvements, but also that scientists plainly love their traditional PDF format. In fact, scientists use the PDF to store and organize articles, make annotations while reading, quote by referring to a specific page, and mail articles to colleagues. Finally, the PDF article format prints and reads much easier than the current online versions.

Therefore, our starting point in the Article of the Future design was to introduce the discipline-specific content enrichments that only the online format could provide on top of the advantages of a PDF reading experience. In this way we would ensure that the new article format would be used and appreciated, and users would not flee to the basic PDF format for basic readability reasons.

Hence, in close collaboration with STM Journals and domain experts, we formulated three guiding design principles (see sidebar), which helped us in making the day-to-day design decisions, such as:

  • The article is the basis. The Article of the Future format supports the 'PDF' look and feel for easy online reading.
  • In-place content enrichments. The Article of the Future format integrates new content elements at natural positions in the article.
  • Additional content and context presented in the right sidebar. Supplementary content and features, as well as information from external databases, are offered next to the article text.
  • Clear navigation. The article outline links to sections and figures in the article
  • Clean design. The visual load is minimized to encourage users to explore the article.
  • Customized view. The user interface automatically adjusts to available screen size.

Frans HeemanExtreme care has been taken to make the article layout as easy to read as possible. By providing a clean, simplified and minimalistic look while adding hierarchy to article elements, we made it easier for users to focus on the article and spend more time reading it on-screen. Emphasis has been placed on the interactive content elements within the article, which take advantage of online capabilities. And since the tablets and smart phones  are becoming more popular among scientists, we made sure prototypes could be easily explored by users who prefer mobile devices to the standard computer.

"The Article of the Future project is an excellent example of how design goes much deeper than just a superficial visual layer," said Frans Heeman, Portfolio Manager for User Centered Design. "Design drives how people think about our products, so it has to be based on solid user data. In this project, we really harmonized content enrichments with presentation, layout, typography and functionality."

UCD worked with the S&T Journals group "to create something that will really gratify people and create sustainable business value," said IJsbrand Jan Aalbersberg, Senior VP of Journal and Content Technology and the project owner. "Making the presentation as perfect as this will allow us to move ahead while continuing to build around the core of what we do: publishing great content."

What's special about the new article layout?

All prototypes support the three-pane presentation layout: navigation bar, main content area and right sidebar. Since each pane can be scrolled independently, it is possible to have both the text and an image in view at once, for instance.

The middle content pane displays the original article, giving the reader the ability to interact with the underlying scientific data: for example, via interactive Google Maps, graphs, tables and plates. The left navigation pane displays a table of contents with clickable section headers and thumbnails of images and tables.

The right pane provides access to supplemental information and additional features, which are usually task or content specific. All extra features can be accessed directly from the article or via the dropdown menu. Depending on the specificity of each domain and the article content, different functionality can be offered. For example, electrochemistry articles display structures of chemical compounds, whereas paleontology articles feature 3D fossil models and provide information on spatial distribution of the localities in which they were found.

[caption id="attachment_17100" align="alignnone" width="800"]An Article of the Future prototype An example of an Article of the Future prototype showing the three-pane design[/caption]

Surveying users

With the public release of the Article of the Future prototypes, we gave visitors the option to complete an online survey. Of the 800+ people who responded, 75 percent indicated that they thought the Article of the Future design contributes to obtaining a better understanding of the research in the article.Responses to the question: How do the new presentation format and extra features contribute to obtaining a better understanding of the research described in the article?

* Neutral: There is not much difference.

* Negative: They make things slower/more difficult.

* Positive: They make things faster/easier[/caption]

A pie chart of people's responses is shown in the sidebar.

Here is a sample of the comments people left as part of this survey:

  • Improved hyperlinks between references, equations, etc. … are very helpful. Also having the side bar to see equations or references without loosing your place is very nice.
  • Easy to find way around article. Don't have to scroll through pages and pages. Interactive figures are FANTASTIC!
  • Tablet computing with the Article of the Future is going to replace PDF!
  • It will encourage more in depth investigation in order to understand the place of the new research. This will prolong the reading time.
  • As a reader I get more the feeling that I can really approach the data and check it in order to come to the same conclusion (or not)… As an editor, I'm concerned about the additional work involved in managing the integration of all these neat features…
  • Fantastic! A revolutionary and easy way to be up to the minute! I missed a printing version for those who don't have tablets or computer easy to access at any time.

Usability testing

To compare the new Article of the Future presentation layout and the pre-2012 ScienceDirect online articles, we conducted several user tests.

The first pilot study with five subjects on ScienceDirect tasks showed that people can find relevant information in the article up to 40 percent faster using the Article of the Future prototype. The later 32-subject test on ScienceDirect behavior showed that in the new format, 90 percent of users looked at the HTML full-text of the article first (compared to 40% on pre-2012 ScienceDirect) and that the majority of users were much more satisfied with the Article of the Future user interface than with the previous one.

The Article of the Future format was received very positively in a study with 32 participants. The chart shows the fragment of the user test survey analysis with the normalized means calculated for 32 subjects. The higher values correspond to better scores (also for negative questions).

Recording online behavior

Normally, participants perform trial tasks in their usual office settings. However, if possible, we also run user tests in our Usability Lab in Amsterdam. Using software available in the lab, we can make digital video recordings of users interacting with online content to analyze their behavior in much more detail.

Video recording from behavior-tracking session

Tracking eye movement

To monitor and analyze user behavior optimally, we apply the state-of-the-art evaluation techniques and methods. For instance, we used an eye tracking set-up provided by the Vrije Universiteit (VU) Intertain Labin Amsterdam to identify and analyze patterns of visual attention of people using the Article of the Future prototypes.

The eye tracking data indicated that participants scanned the central area first, then the left pane and then the right sidebar. It is very important that the main focus remain on the middle article pane and users investigate left and right panes mainly when they are looking for additional information.

An eye-tracking program was used to analyze patterns of visual attention.

What's next?

Representations of how the interactive phylogenetic tree viewer (left) and the MATLAB figure viewer (right) appear on ScienceDirect.]

While the redesigned article format is now available on ScienceDirect, our journey continues. Right now, we are focusing on introducing new domain specific functionalities on ScienceDirect. The following two interactive applications have been developed recently and are part of relevant online articles:

  • The interactive phylogenetic tree viewer (for life sciences). Displayed in the middle article pane below the abstract, this application allows the reader to interactively explore phylogenetic trees on ScienceDirect. To support this functionality, authors of relevant articles are invited to submit their tree data in Newick and NexML formats.
  • The MATLAB figure viewer enables the reader to explore figures with data interactively and in the context of the article. These interactive figures are based on MATLAB FIG files uploaded by the author and shown next to the article in the right-hand pane on ScienceDirect.

Related Links

Elsevier Connect Contributor

Elena Zudilova-Seinstra, PhD

Dr. Elena Zudilova-Seinstra is a Content Innovation Manager for Journal and Content Technology at Elsevier STM Journals. She has been working on the Article of the Future project since joining Elsevier in 2010 as a Senior User Experience Specialist for the User Centered Design group. She holds a PhD in Computer Science and a MSc degree in technical engineering from the St. Petersburg State Technical University. Before joining Elsevier, she worked at the University of Amsterdam, SARA Computing and Networking Services and Corning Inc.

Also contributing to this story: Frans Heeman (UCD Portfolio Manager), IJsbrand Jan Aalbersberg (SVP Journal and Content Technology), Martijn Klompenhouwer (UX Usability Researcher), Rogier Barendregt (UCD front-end designer), Stefan Kuip (UCD software developer), Beate Specker (Senior User Experience Specialist) and Spencer de Groot (UCD Portfolio Manager).

comments powered by Disqus

10 Archived Comments

Gerry Grenier February 15, 2013 at 8:45 pm

Elsevier has done a great job with this. Many publishers are attempting the same. It would be a great service to all readers if all STM publishers adopted a design similar to Elseviers. Would this be something that you encourage or do you see your design as a competitive advantage and therefore work to discourage adoption by others? Indeed will any part of your design be patented?

2013-02-21 03:35:40 February 21, 2013 at 8:35 am

Thank you very much for your positive feedback. And yes, we agree that designs like our Article of the Future serve science well (though this design isn't the only one doing so). And yes, we therefore see the Article of the Future design as a benefit for both authors and users when publishing in and reading Elsevier journals. With our universal goal of advancing scientific communication in mind, we have not patented our designs – others are free to adopt and improve on it. And in that spirit of constant improvement, scientists are always invited to contact us and send us suggestions for improvements to

sharon January 22, 2013 at 11:32 am

Well, you obviously put a lot of effort in this work, and it shows.

Elena Zudilova-Seinstra January 17, 2013 at 9:09 am

Thank you very much for your comment and great idea! Unfortunately, we can’t make this article interactive due to the technological limitations of “”. So, I have posted below some additional URLs for those people who would like to explore innovations that we discuss in the article.

Article of the Future Prototype for Parasitology (as depicted in the screenshot in the article):

The overview of all AotF content specific features with direct links to their implementations:

The overview of all AotF context specific features with direct links to their implementations:

Example of the article on ScienceDirect that features the interactive phylogenetic tree viewer: (in the middle pane, below Abstract)

Example of the article on ScienceDirect that features the MATLAB figure viewer: (next to the article, in the right hand side panel)

Elena Zudilova-Seinstra January 18, 2013 at 4:48 pm

Thank you very much for your positive comment! The Article of the Future is one of the many successful Elsevier projects, where the UCD team plays an important role.

Cynthia Dunlevy January 18, 2013 at 4:00 pm

Great work, Elsevier User Centered Design team!

Frans Heeman January 18, 2013 at 7:53 am

Thank you for your positive comment. The Elsevier User-Centered Design group takes user needs as leading in our design decisions, and we always welcome any and all feedback to further improve. There certainly is a lot more we want to do.

Christine Marcombe January 16, 2013 at 4:34 pm

How about making your demonstration samples interactive as well, so that we see what you are really talking about in terms of enriched experience? Thank you.

Christine Marcombe, C.Tr.


Christine Marcombe January 17, 2013 at 4:41 pm

Well, you obviously put a lot of effort in this work, and it shows.

Good luck with the future.

G.T.Beyrami April 12, 2014 at 8:05 am

Dear Manager

How I can publish my articles on science direct?

I,m G.T. Beyrami, so I,m doctoral student on KM.

Best Wishes