design
engineering
First Impressions
Design Approach
First impressions matter, and the splash screen is the user's very first interaction with the app, so it's important to set the tone for the entire experience right away.
Brand Identity
When designing ¡Cántamelas!, it was important to tie three things together: familiarity, playfulness, and delight.
Showing branded cards in a table-like manner, while animating them outwards establishes the tone as playful, creates familiarity, and uses delight by naturally moving the cards out of the way to reveal the home screen.
Main Menu
Design Approach
The Main Menu is the central place of the app, and the first place the user lands on. As such, maintaining easy and accessible controls while incorporating liveliness and familiarity is paramount for a great user experience.
Familiarity and Liveliness
The backdrop of the Main Menu acts as an animated carousel by blurring all 54 original deck cards in the original Mexican Lotería game in random order, bringing familiarity and liveliness.
Personality
The use of jagged edges and imperfect shapes throughout the app communicates to the user that the app doesn't take itself too seriously while adding character.
Game Setup
Purpose
To offer players a customizable, fun, and easy-to-understand gaming configuration experience.
Design Approach
To allow players for maximum customization while catering to a varying level of savvy, I relied heavily on creating rich visual indicators that all audiences are familiar with. I kept the same visual language, while allowing users to scroll as needed to see more options, highlighting the important call-to-action in the brand's signature orange.
Design Delivery
This experience was crafted for a diverse audience, typical of families that enjoy Lotería. Because of this, options are kept clear, and are displayed with large, recognizable icons. With easy-to-read text and consistent placement, we accommodate players who may have varying levels of tech-savviness and visual acuity.
Game Load
Purpose
Enhance anticipation and immersion by visually showing the cards being shuffled, setting the stage for the upcoming gameplay, while ensuring everyone understands the current winning conditions from the start.
Design Decision
Lotería cards are seen sliding onto the screen from the bottom, simulating a real-life card dealer distributing cards to players. This animation is not only a visual treat but also functionally represents the game being loaded.
User Experience
Allowing for a few seconds before the games starts allows players to get ready for the game and builds anticipation while they wait. The animation aligns with traditional card game rituals, fostering a connection to the physical counterpart.
Gameplay
Design Approach
The screen layout is optimized for active engagement, displaying dealt cards at the bottom that are read aloud by an upbeat narrator, enhancing the auditory experience.
Game Interaction
Players mark their boards by placing chips on matched cards, mirroring the physical game’s mechanics.
Interactive Features
Players can react using procedurally-generated emojis based on the game progress to express their feelings in real-time, adding a layer of social interaction and fun.
Shop
Purpose
Provide players with a platform to personalize their gaming experience by purchasing custom decks, board chips, and memberships.
Yearly Membership
For $15 players get access to all DLCs including custom decks, board chips, and even the board editor.
DLCs
Players are provided with a live shop with seasonally-rotating downloadable content like decks, board chips, and memberships that can be purchased using the in-game currency, bought through in-app purchases.
App Flow
Main Menu & Lobby
Board Creation & Settings
Gameplay
Shop & Inventory
All screenshots, assets, and content on this page are property of Fernando Cervantes and are not authorized for any usage or distribution.