ASN Fable Finance

UX/UI Design

A prototype of an app designed to teach children how to manage their money consciously.

View Persona & Customer Journey Map View the prototype

Used programs:

Adobe XD Adobe Premiere

Foods & Drinks screen, here the food is displayed that you bought for your animal. If you feed your animal it will take away their hunger, make them happier or healthier. — Foods & Drinks screen

Fable Animal Status Screen, here you can see how your animal is doing. The status of it's hunger, health and happiness is displayed here and also how bad or good the climate is for the environment. — Fable Animal Status Screen

Laundry task, this is a minigame where you swipe the dirty clothes of your animal upwards to throw them into the washing machine. — Laundry task

Clothes screen, here are all the garments are displayed that you can let your animal wear. — Clothes screen

Product page, here you can see the product of the store in detail. A product has properties such as good or bad for the environment, high quality or second hand. — Product page

Decorations screen, here you can see all the decoration that you can buy in the store. A black grandpa chair, a modern TV, a low wooden table and a green houseplant with a red stone pot. — Decorations screen

Supermarket screen, on this screen you can buy food and drinks for your animal to prevent hunger, make your animal happier or healthier. — Supermarket screen

Tasks screen, here you can see which tasks are available. Among other things, the washing clothes minigame and watching educational videos about sustainability and environmental pollution. — Tasks screen

Fable animal status screen, the animal has put on a top hat. You can have your animal put on all kinds of clothing. — Fable animal with a top hat on the status screen

Research phase

In the beginning I had read through several articles about how children deal with money, with this info I had created a Persona that represents the target group. I then used the Persona to create a Customer Journey Map where you can see how the Persona is currently handling its money and where its highs and lows are. With these insights I came up with a concept.

Persona research method, the persona is a 7 year old boy who spends his money too fast. — Persona method

Customer journey map research method, with the persona that runs through different phases of the month and spends their money too quickly every time. — Customer Journey Map method

Concept and prototype

The Fabel Finance concept is an app that helps children consciously learn to deal with money by caring for and dressing an animal. The items and clothing that you can buy for your animal have different properties, such as durability, price, quality and how rare it is. The food and drink you give to your animal affects the hunger, health and happiness of your animal. With chips, for example, happiness goes up and hunger goes away, but health goes down. The properties of a product and buying it can therefore affect the animal and the environment, so as a user you have to be aware when you spend your money on something.

Product video

With Adobe Premiere, the Auto Animate feature of Adobe XD and some stock video material I made a product video. I present the purpose of the app and what you can do with it.

Watch the video here:

What would I do better now

During this project I had made the scope of the prototype way too big, so I ended up having to put more in the product video and I was not able to finish the prototype properly.