When Gameloft released their new game, Disney Dreamlight Valley, I immediately jumped onto it. This game is a mix of all the genre I love to play at the weekend to relax: farming, crafting, building, a social aspect and of course a massive throw-back to my childhood with characters I loved growing up. 

However, a few hours into the game, I realised there was one feature I was never using: cooking. I thought it was such a shame, I usually love cooking in similar games, but the UX/UI is so complicated and impractical in Disney Dreamlight Valley that I completely put it aside. 

After discussing with a few friends who were also playing the game, I came up with a few concepts that could easily be changed in the game to make the experience much more pleasant when using this feature. Here is what I came up with!

Throughout this project, I've imported the background from the game, as well as icons and ingredients assets but the rest is all recreated manually in Adobe XD. I've used inspiration from other areas of the game to make sure what I created stayed on brand and consistant.
CURRENT SCREENS —
Here's a quick selection of what the current screens look like in the game.
The main cooking screens where ingredients are selected to cook
The main cooking screens where ingredients are selected to cook
The history cooking screen where previous cooked dishes are listed
The history cooking screen where previous cooked dishes are listed
BRAINSTORM —
The main points that came out of my brainstorm (validated by other players of the game) were the following:

• Selecting ingredients is really painful due to the shape of the inventory when cooking and I personally never use the categories to filter because they are too complex to reach.
• No ability to batch cook, having to go through the process of selecting the ingredients, cooking and watching the short cinematic multiple times in a row is long and painful.
• No ability to re-order ingredients based on rarity, quantity or recently used.
• No ability to cook a recipe from the historic again - why is the history even there?
INVENTORY SHAPE —
The problem
Going through a cone shape to select ingredients is really painful to reach specific ingredients and having to all the way left to filter is not natural.
The solution: 
I redesigned the inventory to be grid shaped, making it easier to select specific ingredients, and made the filter options accessible via the triggers of the controllers.
My initial wireframe
My initial wireframe
My final take on the redesign of the cooking inventory
My final take on the redesign of the cooking inventory
BATCH COOKING —
The problem:
The current interface does not give the option to cook more than one of the same dish at the same time, making cooking long and slow, especially when selling food is one of the main source of income at the beginning of the game.
The solution:
When crafting at the work bench, there is a option to batch-craft items. So why not use the same principle for cooking? I decided to re-use the already existing functionality and adapt it for the cooking screens.
Following the same principle as the batch-crafting on the crafting bench, the max amount of dishes that can be cooked is determined in the backend depending on how many ingredients are available in the inventory.
Once ingredients have been selected, the batch-cooking element shows up
Once ingredients have been selected, the batch-cooking element shows up
When selected, the batch-cooking element can be updated
When selected, the batch-cooking element can be updated
RE-ORDERING INGREDIENTS —
The problem:
There are so many ingredients to choose from that sometimes it is really annoying not to be able to re-order ingredients within the inventory. 
The solution:
Adding a button that allows to reorganise ingredients from the inventory. By default (as it currently is in the game), ingredients are ordered by alphabetical order but it can be changed from the click of a button.
I used the look and feel of other filters/reorganising features in the game to keep consistency.
The Reorganise button opens a small modal that allows the sorting of ingredients
The Reorganise button opens a small modal that allows the sorting of ingredients
HISTORY UPDATE —
The problem:
In the current game, the history option is a simple read-only panel, with no ability to cook again from previous dishes cooked.
The solution:
Adding a cook-again option on the history modal, which will work exactly the same way as when selecting a recipe from the recipe book. The ingredients (except unnecessary ones) will be auto-populated and cooking from there enabled if there are enough ingredients in the inventory. 
The new history now has the ability to repeat previous cooked dishes
The new history now has the ability to repeat previous cooked dishes
CONCLUSION —
This was a really interesting small project to work on. It helped me focusing on the player's experience and find solutions based on what was already available somewhere else in the game to keep consistency across. 
Recreating the sections from scratch, understanding the style of the game, re-using existing elements was a great way to dive in and understand how UX/UI works in a game created by a studio like Gameloft. It also helped me realise that by identifying simple solutions, we can greatly improve the player's experience.

You may also like

Back to Top