Tokyo Art Beat

Tokyo Art Beat

UI/UX Design

An unsolicited redesign of Tokyo Art Beat, a bilingual web service that provides a comprehensive guide to Tokyo’s art and design scene.

Introduction

Tokyo Art Beat (TAB) is an existing bilingual web & mobile service that provides a comprehensive listing of art and design events currently held or scheduled in Tokyo and neighboring cities in the Kanto region.

As a designer with an avid love for museums and exhibitions, TAB has always been my go to app to find interesting design events happening around my neighborhood. However, while the original iOS App design offered the basic functions, I always felt like it didn’t exactly reflect the immersive experience I have in museums, both from a visual and usability stand point.

However, I can see how an unsolicited redesign of an existing service may seem like a hasty idea, considering there are often a lot of factors, decisions and compromises made that the user has no idea about. Therefore, I will preface by saying that my redesign will be nowhere near perfect. Rather than that, I would like for you to consider this redesign, more as an experiment to see how integrating a visual perspective could influence the overall usability of the app.

Research

For this project, I mainly focused on obtaining qualitative rather than quantitative feedback, as there weren’t many users of the app around me (This was fair considering the app is targeted for mainly Japanese customers). I was however, able to gain qualitative feedback from about a dozen current and potential (users who are in the potential demographic but have never been exposed to the app yet) users. The biggest takeaways I got from my research were:

Visual people like visual experiences. As obvious as this may sound, many felt that TAB was completely missing the mark on this point. As visual people, they wanted to learn about the event through visuals, and through a visually stimulating experience.

People don’t like too much information. Many of the users found the amount of information in the description page extremely overwhelming. Many first time users of the app have referred their experience with TAB as cognitive overload.

Learning about the event venue is equally as important as learning about the event itself. The majority of people who go to museums don’t go solely for visuals, but are also seeking for an experience. People want to know what the event venue looks like, so that they have an idea of what their experience at the venue would be.

Process

Based on feedback, I started sketching out some ideas on the direction we can take with the product.

The main target audience and use cases can be described as follows:

• To find out events happening in the area at that moment
• To find specific events based on their interest
• To find events to go in the weekend
• To know what events are popular in the area
• Finding event information (such as place, time, etc.) of events

The two aspects I considered important and mainly wanted to reimagine for this exercise, were the feed view and detail view. The feed view will be the entry point to the detail view, where users will be able to obtain information about the specific event they choose from the feed.

Above are some low-fidelity sketches/iterations of the feed view. The problem with the current feed was that the experience wasn’t dynamic at all. Though it serves the purpose of delivering necessary information to the users, the experience is monotone and really doesn’t stimulate users to learn more about the events other than for practical purposes (such as checking details about a specific event users already had in mind). Seeing that the majority of users actually use the app to find events they don’t know, making them intrigued to the event at first sight is extremely important.

The event list feature was a pretty challenging problem since it was one of the most important features of the product. I wanted this to be intuitive and I wanted users to feel comfortable using this but didn’t want it to be a simple list composed of small thumbnails and descriptions, like the current feed. I explored some different ideas and asked for feedback from different users.

Feed view

One apparent change that would be immediately noticeable is the result of the rework I made on the typeface application. I mainly used two typefaces, Playfair Display and Gotham. Playfair Display seemed like a perfect typeface to use for this mobile application as it represented the quirkiness and playfulness that relates to the subject of art and design, while maintaining elegance. However, I was well aware about how serif typefaces affect legibility—therefore we have made various precautions, such as, using bigger type sizes and applying darker colors to areas that require reading.

I followed the original color palette, however reduced the application of hot pink that was used as an accent color for the original mobile application, as I found the pink to be overwhelming to the eye. Another noticeable change made from the original app design is the width of the thumbnail, which I enlarged to the maximum width available.

Evidently, what motivates a user to learn more about the artwork largely depends on how visually appealing they find the work to be. Therefore I wanted the home screen to not merely be a comprehensive guide to various art and design events, but also serve as a platform to navigate the users more smoothly to featured highlights of specific events.

Detail view

This is the screen the users are directed to once they tap the thumbnail on the home screen. This screen has been optimized to enhance the user experience by offering additional tools to navigate them more smoothly through the internal contents and external links available in or through this application.

The redesigned screen will offer improved accessibility to specific artworks of the artist/organization exhibited in the searched event, such as by enabling the users to display the featured artworks instantly by tapping the thumbnail that has been enlarged for easier fingering.

The contents displayed on the screen will become easier to digest. Instead of cluttering the information like the original app does, the users will be given the option to expand the description of the event to see more details (location of the venue, opening hours, admission fee, etc.), which are all hinted by the gradual change of color.

To provide the users more detailed location info, the screen has been redesigned to show a map rather than just displaying the address, by providing the users the option to click when prompted, if they want to be redirected to an external map page. The users will also be able to gain advanced venue information by opting to become a follower of a venue of their interest (i.e. museum, gallery, etc.) and gain updates on new events and exhibitions scheduled in that venue by clicking the notification button located on the left corner of the top navigation bar.

Explore

I introduced another additional feature that does not exist in the original app. It is called “Explore”, and is intended to provide an opportunity to the users to discover and learn about new artworks that they are still not exposed to or have little or no knowledge about. The specific set of information on such artworks shown to the users will be based on their personal profile and saved bookmarks. The users will be given the option to explore them, based on three criteria: Media, Location, and Genre.

The objective of implementing this new feature is to make this app more useful as an informative tool, and more importantly, to help make art more accessible to users right on the spot and minimize their urge to exit the app to gain related information from outside sources and other search engines.

Bookmark

The bookmark feature has also been reconfigured to offer a heightened visual experience, based on the overall redesign concept applied to meet the redefined user requirements of this app.

Search

Lastly but not least, the redesigned app will offer another new feature that is not available on the original version. It is the interactive “search” function that provides the users on-the-spot access to vast information about the artworks and artists they want to know more about. This feature will help the users immensely in finding the information of particular events and/or venues instantly, especially when they have seen the events of their interest on the app before but have forgotten to bookmark them at that moment.