UX/UI Design Renewal for Aeon Bank
Holistic digital design for banking services
Since 2017, Takram has been supporting Aeon Bank in redesigning their digital products, helping them to fulfil their vision of becoming a "friendly and convenient bank". Along with renewing their products, we created a set of design guidelines to keep the design language consistent throughout the bank's different applications.
![Main Visual](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZhj-9DjCgu4jzxsW_project_aeon-bank-design-renewal_mainvisual.jpeg%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C1%252C2200%252C1238%26w%3D2880%26h%3D1620&w=3840&q=75)
Kakei-bu, the original expense tracker app
With "simple and convenient" as its main concept, we designed the bank's original expense tracking app "Kakei-bu" provides an intuitive interface for recording daily spending, while also offering small tips on spending or smart ways to save money.
![Image](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZhj-9zjCgu4jzxsY_project_aeon-bank-design-renewal_01.png%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C1944%252C1308%26w%3D2880%26h%3D1938&w=3840&q=75)
![Image](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZhj--jjCgu4jzxsb_project_aeon-bank-design-renewal_02.png%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C1944%252C1308%26w%3D2880%26h%3D1938&w=3840&q=75)
![Image](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZhj-_DjCgu4jzxsd_project_aeon-bank-design-renewal_03.png%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C1944%252C1308%26w%3D2880%26h%3D1938&w=3840&q=75)
![Image](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZhj-_jjCgu4jzxse_project_aeon-bank-design-renewal_04.png%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C1944%252C1308%26w%3D2880%26h%3D1938&w=3840&q=75)
The official app for Aeon Bank
We redesigned the whole flow and interaction of the official app of the bank, creating a more visually understandable interface and allowing colour customization to provide familiarity.
![Image](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZhj_ADjCgu4jzxsf_project_aeon-bank-design-renewal_05.png%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C1944%252C1308%26w%3D2880%26h%3D1938&w=3840&q=75)
UI for ATMs
We renewed the UI design for ATMs with more legible typography, consistent colour themes and organised layouts.
![Image](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZhj_BTjCgu4jzxsh_project_aeon-bank-design-renewal_07.png%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C1944%252C1308%26w%3D2880%26h%3D1938&w=3840&q=75)
![Image](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZhj_CDjCgu4jzxsi_project_aeon-bank-design-renewal_08.png%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C1944%252C1308%26w%3D2880%26h%3D1938&w=3840&q=75)
![Image](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZhj_CjjCgu4jzxsj_project_aeon-bank-design-renewal_09.png%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C1944%252C1308%26w%3D2880%26h%3D1938&w=3840&q=75)
Creation of original character Tamaru
We created the bank's official character, Tamaru. Tamaru is a piggybank fairy that looks after your records while striving to become a good advisor for you as well. The character is used in Kakei-bu, the original expense tracker app, as the user's partner, providing them with tips and information.
![Image](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZhj_DzjCgu4jzxsm_project_aeon-bank-design-renewal_11.png%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C1944%252C1308%26w%3D2880%26h%3D1938&w=3840&q=75)
![Image](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZhkA1jjCgu4jzxuD_project_aeon-bank-design-renewal_12.png%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C1944%252C1308%26w%3D2880%26h%3D1938&w=3840&q=75)
![Image](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZhkA1zjCgu4jzxuE_project_aeon-bank-design-renewal_13.png%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C1944%252C1308%26w%3D2880%26h%3D1938&w=3840&q=75)
Project Information
Project Team
- Creative Direction: Kinya TagawaShota Matsuda
- Art Direction: Kotaro Yamaguchi
- UI/UX Design: Shohei HasegawaZijun ZhaoTerushige EnatsuSatoru Osawa
- Design Research: Kyoko Takahashi (ex-Takram)
- Design Support: Ritsuka Komada (ex-Takram)
- Character Design: Kotaro YamaguchiKyoko Takahashi (ex-Takram)
- Animation (Theme song for Kakei-bu): Kotaro Yamaguchi
- Music (Theme song for Kakei-bu): Kyoko Takahashi (ex-Takram)Hirofumi Nakamura
![Thumbnail](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZmcNJJm069VX1mpi_person_kinya_tagawa.jpg%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C912%252C912%26w%3D912%26h%3D912&w=1920&q=75)
Kinya Tagawa
Design Engineer, Project Director
![Thumbnail](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZmcQDJm069VX1mrS_person_satoru-osawa.jpg%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C912%252C912%26w%3D912%26h%3D912&w=1920&q=75)
Satoru Osawa
Design Engineer
![Thumbnail](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZmcUpZm069VX1mvf_person_terushige-enatsu.jpg%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C912%252C912%26w%3D912%26h%3D912&w=1920&q=75)
Terushige Enatsu
Designer
![Thumbnail](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZnkpnJbWFboweywv_person_shota-matsuda.jpg%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C912%252C912%26w%3D912%26h%3D912&w=1920&q=75)
Shota Matsuda
Design Engineer, Project Director
![Thumbnail](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZmcDRZm069VX1mgZ_person_shohei-hasegawa.jpg%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C912%252C912%26w%3D912%26h%3D912&w=1920&q=75)
Shohei Hasegawa
Designer
![Thumbnail](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZmcNnJm069VX1mp-_person_kotaro-yamaguchi.jpg%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C912%252C912%26w%3D912%26h%3D912&w=1920&q=75)
Kotaro Yamaguchi
Designer, Project Director
![Thumbnail](/_next/image?url=https%3A%2F%2Fimages.prismic.io%2Ftakram%2FZmcXY5m069VX1mxT_person_zijun-zhao.jpg%3Fauto%3Dformat%252Ccompress%26rect%3D0%252C0%252C912%252C912%26w%3D912%26h%3D912&w=1920&q=75)
Zijun Zhao
Designer, Project Director