Tokyo Cheapo Redesign
At a Glance
Complete rebranding and redesign of the [Tokyo] Cheapo website network. The project included visual identity, social media branding, UI/UX design, post implementation review and quality assurance.
In Detail
We assisted Fast Train Ltd. with the rebranding and extensive UI/UX redesign for their network of websites. The largest site being Tokyo Cheapo and younger siblings for Japan, London and Hong Kong.
About Tokyo Cheapo
Japan Cheapo is the brainchild of the founders Greg Lane and Chris Kirkland based in Tokyo. It launched in 2012 and was the first proof of concept for an online city guide for the value oriented traveler.
At the time, people were talking about Tokyo as the most expensive city in the world and we wanted to show that this wasn’t necessarily the case.
– Tokyo Cheapo Co-founder, Chris Kirkland
– Tokyo Cheapo Co-founder, Chris Kirkland
It would be fair to say the two founders met at the right time and place and spotted a niche in the market. By 2020 Tokyo Cheapo had grown into the largest English language site about Tokyo. It has over 560,000 monthly visitors and more than 1,600,000 page views. Further, they established a network of 4 city sites: Japan, London and Hong Kong. Currently in planning is a 5th one: Singapore.
In future they plan to use the same strategy for city guides of other high priced cities.
In future they plan to use the same strategy for city guides of other high priced cities.
Key Facts
Below applies to the combined network traffic (as of Jan, 2020):
⚫ +950,000 unique visitors/month
⚫ +2.2m page views per month
⚫ Year on year growth rate +60%
⚫ +6,000 pages of original content published since launch
⚫ 2.1m video views on their YouTube channel
Not just covering a city from a low-cost angle but also witty writing and practical value is what made Tokyo Cheapo what it is today.
The Design Project
The Tokyo Cheapo website design was quite outdated and the TC team opted for a thorough redesign. These were the tasks involved:
⚫ Consulting, Design and Feature Research
⚫ Information Architecture & Wireframing
⚫ User Experience & Interaction Design (UX)
⚫ Visual Identity & Design Guideline
⚫ Social Media Branding
⚫ User Interface Design (UI)
⚫ Post-Implementation Design Review
⚫ Quality Assurance
Planning, Information Architecture & Wireframing
After initial consulting we started our design research. During this phase we settled on a range of design, content and interaction features. These features we defined as the very best and suitable for modern travel and city websites. This process informed the information architecture and wireframe design for all key templates. And each of those in the flavors of Desktop, Tablet and Mobile screen size. Along the way we designed interaction patterns for the best possible user experience. Often we created these as step-by-step mockups for frictionless handoff to web developers.
The new design templates had to stand the test not only for the [Tokyo] site but also had to accommodate features for the whole network of sites.
The new design templates had to stand the test not only for the [Tokyo] site but also had to accommodate features for the whole network of sites.
Visual Identity Design
With the key template outlined we moved on to the visual identity design development. As their name already indicate the DNA of [Tokyo] Cheapo has a tongue-in-cheek heritage which we aimed to preserve to a degree. Crappily edited laser cat meme on top of photographs was something of a signature in their earlier days.
We presented 4 design concepts, some more down-to-earth and some more playful. Each one entailed the design concept, logo variations, typography and a website pattern.
The TC team settled on a logotype concept based on the iconic Red Top mastheads used by tabloid newspapers. Tabloids usually serve a questionable fast – junk food – news diet. But this ironic twist made it great fit. In a sense [Tokyo] Cheapo is the fast and up-to-date source for the latest and greatest places and events of a city they cover.
UI & UX Design
With the new visual identity already refined to a larger extend, we moved on to the user interface design. We applied the new identity design to the wireframe design and refined details as needed. The UI design process also helped with the completion of the branding guideline in real-world usage.
Due to the large amount of templates we divided them into 3 types:
A: Homepage
B: Landing pages & Listing templates
C: Content Detail Templates
B: Landing pages & Listing templates
C: Content Detail Templates
The completed project entailed 14 fully designed templates in 3 screen sizes. This brought the total number to 42 templates. Apart from that it included various interaction examples and final branding assets.
Quality Assurance
The TC team implemented the new UI design as a staging website. Following that we assisted with a post-implementation design review and quality assurance. Some of the features and enhancements are still under development.
Article UI Design Template
Interaction Design Mockups
Landing Page Templates
Detail Content Templates
Bento Graphics took a comprehensive and holistic approach in creating a new improved identity and design for our global network of web sites. Their collaborative approach meant that we were constantly giving feedback and that we ended up with a design package that exceeded our expectations. Their eye for detail, ability to adapt the design, and deep knowledge of UX also helped immensely in the implementation phase.
– Tokyo Cheapo Co-founder, Greg Lane
– Tokyo Cheapo Co-founder, Greg Lane
