Ukiyo-e.org is a database founded in 2012 by John Resig to support the research in the field of Japanese woodblock prints. The database contains over 223,000 prints at the moment. These and the associated metadata - artist, year and title of the print - were taken from databases of museums, universities, li- braries, and auction houses. So the maximum number of Japanese Woodblock Prints, which are scat- tered around the world, are assembled in one virtual place. The aim of the project described in the fol- lowing text was to create an information visualization to provide a new access to the website. The focus lies on presenting the diversity of the collection to visitors who have never seen ukiyo-e before. At the same time the website should provide access to experts who visit the website in search of a specific work. 

PDF Copyright

©Cécile Zahorka

For the full documentation, please review our PDF.

The PDF contains 1) Introduction 2) Inspiration 3) Concept 4) Design and Implementation 5) Evaluation 6) Conclusion 7) References

This incom documentation focusses on the concept (3) and design (4) parts only.

Copyright

©Cécile Zahorka

To give the project a further productive aspect we held a workshop. This workshop intended to help to get to know the subject matter more precisely, because its success depended on the knowledge of the historical, cultural and technical aspects of the Japanese Woodblock Prints. Therefore we invited lovers and experts of Japanese art and culture. They were able to share their knowledge and experiences with us so that we could develop basic ideas for possible interface – this was planned in the form of posters.

First ideas were created in the workshop and were elaborated and exploited in further steps. These main ideas and wishes added up:

A. Visualizing masterpieces - show masterpieces / classics on home page - different classics in turns (arranged by period) - gamification: recognize colors / recognize artists - rate masterpieces (rate with stars / like / push / ..)

B. Create different search engines: simple search (explore) and extended search (expert) a) extended expert search: search by artist / time / date of creation / title / keyword / place of origin / portrayed place / places of the prints today b) exploration: by image / color / category / keyword / map / portrayed place / places of prints today c) „rummage“ the site: without search panel, but by following: - through the home page with masterpieces - by a floating mosaic – show me more similar prints like the one I clicked on - map visualization: is there a print nearby? - game / quiz: do you think this a modern or an old print? d) search by image trends to be for experts, but could be used to search with (emotional) keywords, to overcome the language barrier

C. improving the print comparison D. map / geo visualization: places of origin / portrayed / today E. floating mosaic (home or search page) F. social elements: chat / forum / discuss / rating / quiz / game / tagging

The most important outcome and ideas from the workshop were summarized and first concepts were elaborated for the whole project. Besides the visualization of the data, it was necessary to develop an extended search (expert) for the extension of the whole website. This was initiated as a result of the workshop in trying to optimize the search-modi, which were criticized by the workshop-participants. Therefore the new search modus ought to be drafted to give the user the possibility for an intuitive search by for instance different filters, instead of the all-known “Suchschlitz – Ästhetik” Dörk et al. say:

„Existing interfaces centred around keyword search and filtering have been identified as a threat to such serendipitous information encounters.” (Tan et al. 2011)

So both relevant points could be brought together: 1)Better tools for Ukiyo-e researchers/scholars. 2) More accessible presentation/visualization for interested, casual, visitors.

Beside the optimizing process of the search modus, the whole website was newly designed because we wanted to make sure that there is no switching between explorative and expert search-modus. So a fluent and enjoyable interaction is possible.

The visualization or explorative search modus was geared to the serendipity-model - “the faculty of making happy and unexpected discoveries by accident.”(Konstan et al. 2012) So it is possible to discover the Japanese Woodblock Prints without further target and therefore one can explore interesting, unknown things by chance without losing orientation. Dörk et. al emphasize the importance of orientation within visualizations in “the Information Flaneur”.

“An important aspect of information seeking is having a sense of orientation (i.e., where one is, and where one seeks to go next). The notion of orientation combines a sense of overview (having an idea of the lay of the information landscape, in a map-like fashion) and direction (having an idea of where one has been, how to move forward, and how to return).” (Tan et al. 2011)

The focus of the collection lies on different prints, locating and comparing them. Therefore we decided to build the explorative searchmodus with the existing image-files because we know the focus lies on the prints themselves. This kind of visualization is as well a perfect start for beginners because they don’t need any previous knowledge to discover the collection. Therefore a way was found to bridge language barriers, to implement a functional search that works almost without language, so that various user groups and guest with diverse backgrounds are able to work with the website and browse it intuitively. We also wanted to open the collection for outsiders and to enhance the exchange between different users, for instance for discussions, coworking (metadata or adding descriptions) and social tagging.

Our prototype was created with the “InVision App”, an interactive design prototyping tool. This tool enabled us to convert our static screens in an easy and intuitive way into clickable, interactive prototypes with animations, gestures and transitions. The prototype is divided into the following two sections: - website - explorative gallery

The website offers the information seeker a variety of possibilities to explore the ukiyo-e collection and to search for prints. The hompage starts with randomly selected prints which the user can explore. This option might be more interesting for the layman. Instead of using a drop-down menu we chose a navigation drawer (hamburger menu) with the following sections: - help us with the data! - upload and search - filter

The advantage of a navigation drawer is that you have a clear focus on the content and you can display a large number of navigation targets concurrently as you can see in the section: filter.

Copyright

©Cécile Zahorka

Home view - prints are displayed as floating mosaic in random order - navigation drawer on the right side - big search on top for keywords and main navigation

Copyright

©Cécile Zahorka

Open navigation - direct links to the time periods - direct links to interesting collections, e.g. „most popular“ - links about the website

Copyright

©Cécile Zahorka

Help us with the data Some prints still need keywords to become searchable. “Help us with the data” is an appeal to the users to help tagging prints in order to improve the search capabilities.

Copyright

©Cécile Zahorka

search by upload In the “upload and search” section users can upload a picture of a print to find similar prints across multiple collections.

Copyright

©Cécile Zahorka

Filter section especially experts who are looking for something more specific will enjoy the features of the advanced search. Users can search for a certain time period, an artist, search by colors or tags and the special about it is: they can search for all options simultaneously or sequentially! It enables users to fluidly switch back and forth between the prints and change their exploration focus as needed.

Copyright

©Cécile Zahorka

search by artist: auto complete

Copyright

©Cécile Zahorka

Period view - gives detailed informations about e.g. the Meiji Period - most popular artists - most popular prints

Copyright

©Cécile Zahorka

Artist view - it gives some basic informations about the data, e.g. number of prints - the filter section adapts to its content

Copyright

©Cécile Zahorka

Print view The selected print is displayed in a lightbox. To see all 54 prints of the “Great wave” you can either slide trough the prints or change to the compare view.

Copyright

©Cécile Zahorka

To get a better overview of the color intensities of the 54 prints it is helpful to change to the compare view.

Copyright

©Cécile Zahorka

Full view of the print.

The navigation drawer displays the color code of the print and a map which shows you where to find the selected print. It also offers the user to have a look at similar prints. If the user wishes to get inspired by other prints he can start a tour through the ukiyo-e collection by clicking the red exploration button.

Copyright

©Cécile Zahorka

We wanted to add some user generated content. The user has now the possibility to add some tags to this print, to help improving the data. Furthermore users can leave a comment or start a discussion. Underneath each print you will find the sources of the artwork

The explorative gallery offers users to explore the gallery like a flaneur, wandering streets without a destination, but with the goal to experience city life (vgl. Benjamin, 1973).

This Gallery shows, instead of 223000 prints, just 20 randomly selected images together with a time-based navigation. Hereby this is more suitable for laymen. Some of these shown prints are very much known and some are totally unknown. If the user doesn't like the range of shown pictures, he has the possibility to reshuffle the prints by clicking the shuffle button. Hovering over a print allows the user to see in the time-based navigation the prints era and time period.