Japan Railways Group: Re-creating Identity & Website

Fadhlan Zakiri
8 min readJun 27, 2020
Japan Railways Group

In 2019, I was doing my internship at the MNC Innovation Center as a UI designer. It is a requirement from the campus as one of the required courses to finish my degree, majoring in Information System. I got a lot of knowledge while working as a UI designer over there. After the internship period is over, I thought that I have to implement something. Well, maybe I can work on my portfolio. Out of that context, I decided to create a new identity for the Japan Railways (JR) Group companies. The decision came after I found out that I could not go to the JR East (one of the companies in the group) Global Internship Program. It was a seven-day internship program for overseas students like me. Obviously, I could not make it because the internship requirement from the campus is that the internship period must be eight weeks minimum. So this creation was basically to cure my disappointment. And now, here I am, writing a story about defining identities and portals for the JR Group.

The Japan Railways (JR) Group: What is that?

The JR Group was established on 1 April 1987, a day after the dissolution of the Japanese National Railways (JNR). Currently, the group consists of nine independent companies: seven railway companies and two research and IT services. The group itself is not a holding company nor having a group headquarter.

The six passenger railway companies are operating on a geographical basis. Three companies operate on Honshu Island and one company each in Kyushu, Hokkaido, as well as Shikoku Islands. On the other hand, the freight company operates nationwide. For example, the notable Tokyo’s Yamanote Line is operated by the JR East, or the Tokaido Shinkansen is jointly operated by JR Central and JR West. So, even though all companies operate independently, some lines jointly operated by more than one company.

Talking about their identity…

If we talk about identity, the JR Group logo has been there since its establishment. The logo itself was created by Nippon Design Center (NDC) in 1987 (I just found out this fact by the time I write this article!). In my honest opinion, the logo represents the group very much. I mean, it’s a lesson to us that there’s no need to create something extravagant for a representative of an entity, organization, or company. Like people said back then, less is more. That phrase happened in this context.

The Identity, Created By The Nippon Design Center (Source: NDC)

Since there are seven railway companies inside the JR Group (eight if we count the JR Group itself even though it’s not a company or holdings), the NDC differentiates all companies by color, without changing the JR logo baseline. For example, the JR East logo is a Salem Green color (HEX: #188847), or the JR Central is orange (HEX: EF6230), and so on. I don’t really know what approach this was. I don’t know what to say either, other than an expression of admiration for this logo. (I like simplicity.)

So, why did you decide to re-create their identity?

My idea wasn’t about to change that JR logo. Like, no. We’re talking about an identity that has been there for more than three decades. That means people already know about the JR logo, and they can easily recognize a JR group company by looking at its logo. If I change the whole logo, that means there’s a need to change the entire identity of a company. I’ll be straightforward: I don’t want it to happen. We can see like the Singapore Airlines bird logo that has been there since their split from Malaysia-Singapore Airlines in the 1970s, or the Japan Airlines Tsurumaru Logo that has been there since 1959 (I know, they changed to the “arc of the sun” in the 2000s, but yeah…). So, for me, it is really something when we maintained a logo that has been used for years.

Some Airlines That Successfully Maintained Their Logo For Years

There’s no problem with the JR “JR” logo. But I sense something that I can change from their identity. When I browsed around some JR companies’ websites (the Global-English website), I took a look at their logo in the website header. From that, I found that the logos are different. I’m not discussing the color because they maintained it as their identity. The problem is in their stylings, like their fonts, their size, etc. All of them are different, and that bothers me. Embark from this bothering, I decide to change their stylings.

How did you change their stylings?

Aside from the JR logo, the NDC differentiates each company by colors. So my only rule of thumb is to maintain the logo and its color. The change will be on the word, font, as well as its location on the whole logo.

For the style, I put the JR logo as well as its company name in short Japanese and put it together with the complete company name in English. For example, the Central Japan Railway Company in Japanese (short version) is JR東海. So I put the JR東海 with Central Japan Railway Company. I use the same font for the words 東海 and Central Japan Railway Company. The font for those words is A-OTF Shin Go. I got the font on the free font browser and tried to mix and match with each logo and identity to maintain the existing look.

The New Identity

The idea behind this new identity is to emphasize its Japanese image and combine it with a global character (English). Other than this style, I made a similar but simplified style for each identity. For example, again, JR東海 is the short Japanese name of JR Central. So I put both 東海 and Central together beside its JR logo. But I made an exception for the JR Group logo. Since the JR Group represents Japan (despite its status as a non-holding entity), I made its logo combination as “Japan Railway” and 日本 (Nihon — Japan). The reason why I wrote Japan Railway instead of Japan is that the Japanese people, in general (based on my assumption), may have already known about JR as a railway company. But overseas people like me may don’t know anything about this. So rather than putting Japan, I put Japan Railway instead to explain what JR is.

The Simplified New Identity

Going to the website issue…

As the identity kinds of stuff are finished, I start to do something more related to my internship: website. Yup, I’m talking about the user interface (UI). I realized this problem while I was browsing around some JR companies’ websites, at the same time when I realized the difference in their logos. So parallel with designing the identity, I did touch on the website too. And in my opinion, the issue of the website is pretty major than identity. As each company of the JR Group is a separate entity, they have their own website. Each portal has its design, and sometimes one really different from the other.

For me, this is a problem. I mean, I did know the fact that the JR Group consists of independent companies. But I see the chance of uniforming all JR group companies’ websites. I think this action is needed for the sake of the user. If one JR company has a similar design with another JR company, the user would not need to learn further. In other words, there will be no hassle for the user when transitioning from a website to another.

One design for all

The JR Group Main Website

The picture above is basically the design for the rest of the websites. So I designed all seven companies’ websites and the JR Group website. In the real-life, there is no website for the JR Group, except for the information about the Japan Rail Pass. Knowing the status of the JR Group, it makes sense if they don’t have a specific portal. But as I found that there are numerous railfan communities in Japan, as well as in my country, I decided to make a website to explain what JR Group is and its history. That website will also explain some general information about the Japan Rail Pass, as well as other JR companies' passes.

Since JR Group companies are a transportation company, it should allow the user to know about their tickets and timetables. Aside from those two aspects, some JR companies also known for their passes. That means three features will be shown first when the user opens the website: Tickets Reservation, Coupons & Passes, and Train Timetable. These basic features will be available in all JR passenger companies. Most of them will be going in the same name, but it may change based on the company’s available services. These THREE features won’t be available on the JR Freight as they’re a rail cargo company.

Examples of Some JR Companies’ Websites

The homepage’s design will be similar to each other as we need to minimize the user’s hassle when moving from one website to another. Some things that will be the same in all homepages are the menu bar, the three features (Tickets Reservation, Coupons & Passes, Train Timetable), and the railway lines information. This information will be the first thing that the user will see after opening the website(s). The other feature depends on the company’s needs, and it can be implemented differently with the other.

Lesson learned…

Ever since my internship period, I found out that it is quite easy to design something. But one thing that we need to know, it is not easy to deliver the message behind a design. As someone whose majoring in Computer Science/Information System, graphic design is not a thing on the campus, except about the UI/UX. That topic is the one that I like the most. From that, I need to think about how to create a design that not only shows the aesthetical point but also makes something efficient and user-friendly, especially about an interface of a website. This thing won’t be easy as I need to practice from time to time and learn more from the other. One of the implementations of my knowledge is in this project, to re-create Japan Railways Group identity and design websites for each company. I acknowledge that there are some slip-ups on the design. But again, I’m trying to implement something that at least can be beneficial for myself. Last but not least, thank you for reading my first post on this platform. Comments and critics are highly welcomed!

P.S: All designs related to the JR Group can be accessed on my Behance and my formal-style document about this matter also available on my LinkedIn

--

--

Fadhlan Zakiri
0 Followers

Travel & Aviation. Design Reimagined. HELLO FZ.