Multimedia/Media Viewer/en



This is the project hub for Media Viewer, a new tool developed by Wikimedia Foundation's multimedia team. For a quick overview of this project, visit 'About Media Viewer'.

Media Viewer aims to improve the viewing experience for readers and casual editors on Wikipedia and Wikimedia sites.

This new multimedia browser displays images in larger size, with useful information about their contents, authors and related metadata. It also offers a number of features to enlarge, share, download or embed media files, as described below.

Media Viewer was tested extensively during development, through usability studies, community consultations and online surveys. Based on this user feedback, the multimedia team developed a set of new improvements, to make Media Viewer easier to use by readers and casual editors, the primary target users for this tool.

Learn more about Media Viewer on this help page. Feedback is welcome in this discussion.

Goals




Purpose
Media Viewer aims to:


 * improve the viewing experience for readers and casual editors
 * make it easier to preview and browse images
 * provide a quick summary, with easy access to details
 * offer more features such as enlarge, download, share and embed

These features are expected to encourage casual users to contribute more to Wikipedia and Wikimedia sister projects over time.

Users
Primary users for Media Viewer are:
 * readers
 * casual editors

Other users include:
 * experienced editors
 * contributors

User Stories
We aim to support all these user groups, with an initial focus on readers in our first release. See user stories below for each user group.

Reader stories
As a reader, I want to:
 * view larger images
 * find basic information
 * browse related images
 * share a link to this file
 * use a simple, uncluttered interface
 * view images on the same page (not another site)
 * get back to the article easily

Casual editor stories
As a casual editor, I want to:
 * find more information
 * see original images
 * use this file in an article
 * download this file
 * view license terms
 * view/edit file page details

Experienced editor stories
As an experienced editor, I want to:
 * check meta-data
 * see license terms
 * download this file
 * copy attributions
 * view all the file details
 * edit file information

Contributor stories
As a contributor, I want to:
 * view my contributions
 * get attributions if I'm the author or source
 * find more details, such as where this file is used
 * add or correct information on the file page

See also this multimedia vision for examples of how Media Viewer could be used by different user groups in coming years.

Problem
User research suggests that the current file page brings up many issues for readers:
 * too much information
 * cluttered visual layout
 * emphasizes text over images
 * goes to a separate page (on other site, e.g. Commons)
 * or goes to a duplicate page (on same site, e.g. Enwiki)
 * longer load times

While this file page design works for advanced users, it is often confusing for casual users.

Minimum Viable Product
Features for the minimum viable product include:
 * Show images in larger, media viewer panel when you click on them
 * Modal panel opens up as overlay (on same page where you clicked)
 * Large image appears without clutter, for a more immersive experience
 * Information about the image can be accessed easily
 * Images can be shown in full-screen mode
 * Images in a collection can be browsed easily

Readers can also get more details on the file page, with a prominent button that provides quick access to all the metadata.

Experienced users can easily bypass or disable Media Viewer, if they prefer to go straight to the file page.

Lightbox View


Media Viewer provides two different views of an image when you click on its thumbnail on an article page: Lightbox and Full-screen View. The 'Lightbox view' for this tool is described below.

Image
The image is shown in large size against a black background, as an overlay that fills up the entire browser page where you clicked on the thumbnail. This makes the image stand out more and removes some of the visual clutter typically found on a text-heavy page.

Tools
In this v0.2 release, these tools are provided:
 * Close button (goes back to article view)
 * Full screen button (expands into full-screen view)
 * [$url Next and Previous arrows] (to browse through related images)

The 'full-screen view' for this tool will show a large image across the entire screen, with minimal information and buttons available on hover. This is the view that lets you focus exclusively on the image, with no other distractions.

The Disable/Enable, Download and Share/Embed buttons open up small panels over the image. The Enlarge and 'More details' functions go to a separate page.

Primary Info
Here are the most important information fields that will be shown prominently near the image, as shown in the first version of this tool (see mockup):
 * File name (Zonotrichia atricapilla)
 * Author (e.g. Alejandro Erickson)
 * Source (e.g. Bird Institute)
 * License Info (e.g. CC-BY-SA-2.0) (or link to license info)
 * Chevron icon for opening the metadata panel to reveal more info (see below)

Secondary Info
Here is the information that is shown below the fold, once you open the metadata panel (by clicking on the chevron or scrolling):
 * Description
 * [$url2 Site name and link] (e.g. 'Learn more on Wikimedia Commons')
 * Uploader name (e.g. Smallbones)
 * Creation Date (e.g. 12 April, 2012)
 * Location (e.g. place name and/or geotag coordinates, if any)
 * [$url6 Categories] (e.g. Birds of British Columbia, Zonotrichia atricapilla … more> )
 * [$url7 File usage] (e.g. 'This file is being used by 5 other pages. ')
 * Permissions (e.g. special credits or restrictions)
 * [$url9 Assessment credit] (e.g. '')
 * More meta-data may be added to this panel over time, as proposed below
 * File format / size (e.g. JPEG, 4928 x 3264 px (more), 3.8 Mb)
 * Tool used for upload (e.g. 'Via Flickr')

These features are available every time you click on a thumbnail to open Media Viewer, as long as the tool is enabled. Media Viewer is now enabled by default on all Wikimedia sites, but can be disabled by any user, as described here. From a file description page, click on "Open in Media Viewer" below the image to view it with this tool.

To learn more, read this help file.

New Improvements
The Wikimedia Foundation's multimedia team is testing and developing a range of new improvements, based on usability research and community feedback.

To that end, we created a new 'minimal design' including these features:
 * a more prominent button linking to the File: page
 * an easier way to enlarge images
 * image captions right below the image
 * clearer icons for Download and Share
 * an easier way to disable the tool for personal use

Here are screenshots showing what these improvements look like, from the updated Media Viewer prototype.

How you can help
If you find a technical issue with Media Viewer, please file a bug here on Phabricator.

You can also post your report on this discussion page, with a screenshot and information on your browser and operating system :).

Before reporting a bug, check first that this issue is not already on this list of known bugs. In case it’s already been fixed, you may also want to test it on this test page on MediaWiki.org -- where new features are released a week before the rest of the wikis.

Our work in progress can be viewed on this beta site, where new features are rolled out all the time (you'll need to create a test account to log-in and use the Beta Features preference, as described in the 'How can I help' section above.)

Note: Media Viewer only supports the most widely used image file formats on Wikimedia sites (e.g.: JPEG, GIF, PNG, TIFF, SVG). In future releases, we plan to add support for more file formats, such as PDF, audio and video files.

Development
Media Viewer was developed by the Wikimedia Foundation's multimedia team from July 2013 to November 2014. It was designed in collaboration with community members, in a series of discussions held over video conferences, IRC, and face-to-face meetings. This tool was then developed and tested as a Beta Feature through April 2014, when it was gradually released worldwide, over a three-month period.

Based on user feedback, a wide range of improvements were developed to make Media Viewer easier to use, such as: an easier way to enlarge images, image captions, and an easier way to disable the tool for personal use.

Feature development has now ended for this project.

Feedback
Media Viewer was tested extensively with millions of readers and casual editors, the primary target users for this tool.

User feedback was collected through a variety of methods:
 * user research
 * usability studies
 * product discussion pages
 * online surveys
 * community consultations

Please check the links above for more information about these different sources of user feedback.

To get user feedback about Media Viewer, the Wikimedia Foundation ran a global survey in multiple languages from April to July 2014. A majority of global respondents found the tool "useful for viewing images and learning about them" (56% "useful", 35% "not useful", 9% "not sure", based on 18,199 global responses). Readers tended to view the tool more favorably (65% found it "useful") than advanced users. These approval ratings increased over time in all languages, suggesting that users found Media Viewer more useful for viewing images over time, as new improvements were developed based on user feedback. Note that this was an optional survey, so approval rates should not be cited as a conclusive metric, as they are subject to self-selection bias (just like RfCs). But they provide useful information to complement the RfC results above.

Four RfCs (Two in English Wikipedia, German Wikipedia, and Wikimedia) were initiated, the response of which overwhelmingly indicated that contributors, both regular and occasional, believe that the "Media Viewer" should be disabled by default for all users, logged-in or not, and either left as an opt-in feature or scrapped altogether. Aside from any technical shortcomings, discontent was also shown with the manner in which the project was conducted and the lack of transparency shown by the team responsible. These RfCs typically involved up to a couple hundred editors at a time, with very low participation from readers, the target users for this product.

Code
The code for Media Viewer is made possible by two separate extensions:
 * Multimedia Viewer Extension - the front-end extension that displays media files and information
 * Commons Meta Data - the back-end API that serves information to the Media Viewer

Next Versions
The next version 0.3 of Media Viewer will focus on zooming on large images and adding more features requested by our community. And version 0.4 will support more file formats (e.g. slides, video, audio). For an overview of what we're considering for these future versions, check our 2016 multimedia vision, as well as our annual plan for multimedia in 2014-15.

Here are some features we are considering for future versions:
 * Zoom on this file
 * Show file collection panel
 * View files in slideshow mode
 * Show PDF slides
 * Play Video files
 * Play Audio files
 * Support Developer Plugins
 * Mobile Version of Media Viewer

A consistent user interface will be provided for time-based and audio-video playback tools above (play/pause, rewind, volume, timeline). In future versions, we plan to provide more feedback tools below the image (e.g. thank, flag), as suggested by best practices from other media sites. We will also start working on mobile versions of the Media Viewer, in collaboration with the mobile team.

The second mockup to the right shows how this information would be presented to the user, to minimize clutter near the image, but still keep important metadata as prominent as possible. Please click on the specific features above to see the latest mockups and specifications.