Art Direction, UI Design
Mobile Chef is a Cellufun game where players run a restaurant kitchen to complete food orders and earn mastery stars on their way to become a top chef. The game has 22 different restaurants to master, each with its own cuisenes and dining room interior upgrades to unlock.
I served as Art Director and UI designer for this project. I also worked with UX designer Ryan Flynn, and fellow Cellufun artists Eric Santana and Adam Frizzel to create all the final images.
Mobile Chef was conceived as a restaurant simulation/time management game following the success of Cellufun's previous strategy game Farm World. The game was initially designed to play similar to other restaurant games like Diner Dash and Cake Mania, where players would manage multiple aspects of a restaurant including cooking, serving tables and upkeep (cleaning, restocking supplies, etc.). Other Cellufun players would be able to come into your restaurant as patrons and rate you for your service. I started with some initial concept sketches for these functions.
Early in development, the team decided to simplify the game by doing away with the restaurant management gameplay. Instead the players would focus on cooking and filling orders, keeping the setting mainly in the kitchen. We added the concept of there being numerous restaurants to master with different types of cuisines to prepare in each, like Italian, Chinese, French, barbecue, etc. We would still allow players' friends to visit your restaurant to help complete orders faster for additional points for themselves.
For the UI of the kitchen, I expanded upon the "cooking view (v2)" sketch above, with the idea that the players would tap the ovens to perform a task based on each one's current state. For example, if the oven was idle, tapping it would start cooking a dish from a given order ticket. Each oven (beginning with two, upgradeable to four) could cook one dish at a time, with each type of dish requiring a predetermined amount of real time to cook (alternatively, the player could tap an active oven again to finish the dish instantly by spending Funcoins, Cellufun's virtual currency). If an oven became dirty, the player would have to tap it to clean before it would become usable again (again, spend Funcoins to clean it instantly).
From here I began producing colored art for the kitchen UI. As Art Director I decided on a colorful illustrative style to allow the UI to pop, and to also match the style of Cellufun's in-game avatars. I drew and animated the art for the ovens, kitchen scene, cooking devices and food icons:
To indicate the dish being made and amount of cooking time remaining, I designed a number of different containers to display this information (seen below) before settling on the simple food icon display and the timer on the oven window.
Meanwhile, Ryan worked on the heads-up display displayed above the dining room view to display the progress of the current order, the player's level and the restaurant's mastery. This HUD went through various concepts, starting with an art-heavy chalkboard concept and evolving to a more simplified design at the lead developer's request.
Order Ticket Screen
Mobile Chef required a separate dialog screen where players would choose what dishes to cook on their available ovens. In the early stages of development we originally planned to have the player choose the dishes to cook themselves and would have to master each dish over time to gain better ratings for their restaurant. For this design I conceived a chalkboard-style menu (like the early HUD concepts) showing the player dishes that were available to them and how far along towards mastery each one was.
When the game's design was changed, we nixed the dish mastery aspect and instead had players cook specific dishes from a randomly-generated order, earning experience and restaurant mastery points for each ticket completed. The player could select from an "easy", "medium" or "difficult" order, which would determine the total number of dishes required to complete the ticket, the cost (cc) of each dish, and how much oven power (p) each one would use. With this change, I scrapped the chalkboard menu concept and designed a new screen resembling a traditional restaurant order ticket. The simple design of the ticket allowed the developer to built this screen mostly in code without needing an excessive amount of art assets.
I designed Mobile Chef's kitchen UI to have the player "chef" look out into the restaurant's dining room area through a window above the cooking station. The dining room art would help distinguish each of the 22 different restaurants that the player could master in the game, and each restaurant's dining room can be upgraded in quality as the player earns more points. The dining room would start off with a basic interior design, with few visible patrons, and with each upgrade the room would become more crowded and better decorated.
I worked with Eric and Adam to illustrate and animate the dining room art, with three different versions of each restaurant in all. Some samples below:
In addition to the dining room art, the three of us also created names and logos for each of the restaurants based on their cuisine type and quality. Here are the ones I created:
Final UI Designs
All the different pieces of the UI came together well, giving the player the feeling of being behind a restaurant kitchen station. Minor alterations were made to the oven images late in production to accommodate the heights of the final HUD and dining room scenes, and to add a "power" bar that would drain as you use the oven and replenish when you clean it. Screenshots below:
Given the high volume of art assets needed throughout the production timeline, everyone on the project team worked especially hard to get this game out on schedule. In the end, I was very happy with the results, as I feel it is still one of Cellufun's better-looking games. Players responded well to Mobile Chef's gameplay and art style, and it still brings in a respectable amount of traffic to this day..
For more info on Mobile Chef, visit the game's catalog page on Cellufun.
All images © Checkmate Heavy Industries LLC.