Jacky Mastermind of Mobile Solitaire Magic – Crafting UI/UX Brilliance in Unity!

My Role

UI/UX Designer, 2D Artist

Tools

Figma, Photoshop, Unity 3D

Year

2022

Overview

Jacky is a mobile solitaire card game where you must take as many cards as possible from the table.


In this project I was responsable with UI/UX, all the game assets and their implementation in Unity Engine.

Wireframes

A wireframe is a low-fidelity, visual representation of the layout of a website or app. It is a quick and easy way to sketch out the basic structure of a page without worrying about the details of the design. Wireframes are often used in the early stages of the design process to help designers and stakeholders collaborate and get feedback on the layout of a page.

First challenge that I had, was to design a very simple UI but in the same time to have all the options available without any learning curve.

 

Below you can see the Main Menu wireframe where you have as a player a play button in the center of the screen and at the bottom two buttons (Tutorial and a Music Toggle).

A more challenging task was to prototype the UI for In Game screen (Buttons and HUD). I put the Control Buttons on the right side of the screen and the same Tutorial and Music Toggle on the bottom on the screen as in the Main Menu screen. In this way I managed to have a consistent design.

This is the result of this task below:

Typography

I incorporated Ablasco fonts into the game, seamlessly aligning with its fantasy-medieval theme for a perfect blend.

Other Designed Game Assets

I meticulously crafted all game assets, from the logo to cards and background, employing digital painting techniques for a polished and professional touch.

Logo:
Cards:
InGame Background:
Background:

This outlines the systematic process of background creation, detailing each step.

Mockups

Game footage

This encompasses recorded footage from the officially launched game, offering a professional glimpse into its gameplay.