NUX Onboarding
Guiding new players through their first steps with a structured and engaging onboarding experience.
✦ UX Design
✦ Firt Time User Experience
✦ @Azerion
Project Brief
A New Tutorial for the Social Game "Smeet"
Without guidance, Smeet's breadth of features works against retention rather than for it. This project designed a tutorial that gives first-time users a clear, engaging path into the game — while the editor used to build it was still being developed in parallel.
Details
Platform
Mobile, Desktop
Team Size
2
Focus
UX Designer, Game Designer, UX Writer, Character Designer, QA Tester
TLDR
A ground-up redesign of Smeet's post-registration onboarding experience, condensing a feature-rich virtual world into a focused, three-pillar tutorial — built simultaneously with the custom editor powering it.
The Final Design
Understanding the User
Empathize
01
Understanding where new players were getting lost required mapping the full breadth of Smeet's feature set against what a first-time user could realistically absorb in a single session.
3 Pillars
Our current users were drawn to three particular aspects of the game. So naturally, research was based on how new users would expereince those and how they learned how to navigate them.
Socializing
Meeting other avatars, joining conversations, and building relationships through shared spaces and real-time chat.
Group Play
Participating in challenges, mini-games, and events with other players — the heartbeat of the game's community.
Room Customization
Designing and decorating personal rooms as a form of creative expression and social signalling.
01 ✦ EMPATHIZE
What New Players Need
Understanding what new players need to feel confident, engaged, and motivated to return — by examining the game's complexity, audience expectations, and the emotional weight of first impressions.
Orientation Without Overwhelm
A game with vast feature depth needs guardrails. Players who feel lost in their first five minutes don't come back. Guidance must feel supportive, not restrictive.
Fast Path to Fun
The sooner a new player experiences something genuinely enjoyable — a laugh, a room they love, a social connection — the higher the likelihood of long-term retention.
A Familiar Face
A dedicated guide character creates a sense of being welcomed. Having a consistent, relatable personality reduces the cold-start anxiety of entering a new virtual world.
Learn by Doing
Passive instruction is forgotten. Players retain mechanics best when they discover them through action — the tutorial must be a hands-on, contextual experience, not a manual.
"The extensive range of features made a structured introduction essential — the challenge was guiding players through complexity without making the experience feel like homework."
Smeet's core appeal — the sheer range of things you can do — was also its biggest onboarding liability. New players were entering a virtual world with socializing tools, room customization, group challenges, and more, all available at once with no clear starting point.
Through this research, three features emerged as the ones that defined the Smeet experience most essentially — socializing, group play, and room customization.
Framing the Problem
Define
02
The core problem was framed around the tension between Smeet's feature richness and a new player's limited cognitive bandwidth during their first session.
How Might We
...introduce a multi-feature social world to a brand-new player in a way that feels fun while simultaneously building the tool to deliver it?”
02 ✦ DEFINE
Design Principles
After intensive research and interviews, we clustered findings via affinity maps, identified key needs and pain points, to then craft a precise problem statement.
Contextual, Not Instructional
Every tutorial step should arise naturally from the game world — not from a pop-up modal that pauses the experience.
Precise Flow Definition
Since the Editor was built in parallel, every UX step required exact specification from day one. Ambiguity had engineering consequences.
Iterative by Design
Every version of the tutorial was also a test of the Editor. The feedback loop between content and tooling was a feature, not a bug.
Balanced Pacing
Concepts are introduced at a pace that keeps players engaged without feeling rushed — each step earns the next.
Platform Agnostic
The tutorial logic must be independent of platform-specific UI — one system that adapts gracefully across all five surfaces.
Social From Step One
The tutorial should immediately signal that Smeet is about people — the guide character embodies this from the first moment.
Contextual, Not Instructional
Every tutorial step should arise naturally from the game world — not from a pop-up modal that pauses the experience.
Precise Flow Definition
Since the Editor was built in parallel, every UX step required exact specification from day one. Ambiguity had engineering consequences.
Iterative by Design
Every version of the tutorial was also a test of the Editor. The feedback loop between content and tooling was a feature, not a bug.
Balanced Pacing
Concepts are introduced at a pace that keeps players engaged without feeling rushed — each step earns the next.
Platform Agnostic
The tutorial logic must be independent of platform-specific UI — one system that adapts gracefully across all five surfaces.
Social From Step One
The tutorial should immediately signal that Smeet is about people — the guide character embodies this from the first moment.
The define phase made it clear that the tutorial needed to respect the user's natural learning curve rather than front-load information.
An unusual complication during this phase was that the tutorial editor itself was being built at the same time as the tutorial content. This meant problem statements and requirements had to be defined with unusual precision from the start
02 ✦ DEFINE
Core Challenges
01
Feature Prioritisation at Scale
Smeet offers socialising, room building, games, challenges, events, and more. Condensing this into a focused tutorial required deliberate decisions about what to show — and what to defer. The risk was either overwhelming players or underselling the game.
02
Designing Without the Tool
The Tutorial Editor was being built simultaneously with the tutorial content itself. Every design decision needed to be expressed with enough precision that the editor's architecture could accommodate it — essentially writing a spec for a tool that didn't yet exist.
03
Pacing Across Varied Player Types
New players range from social-game veterans who want to skip everything, to first-time players who need every step explained. The tutorial needed to feel appropriate for both without alienating either.
04
Multi-Platform Consistency
Tutorial triggers, UI overlays, and the guide character needed to work coherently across PC, web browser, Android, macOS, and iOS — each with different interaction models and screen constraints.
Exploring Ideas
Ideate
03
Ideation focused on how to introduce core mechanics through doing rather than explaining, and on what kind of guide character would make that feel natural.
The central ideation principle was that instruction text alone wouldn't cut it. Players retain mechanics better when they discover them through interaction, so the challenge was designing scenarios where the learning happened as a byproduct of playing rather than reading.
01 Exploring Solutions
I conducted comprehensive competitor analysis to identify opportunities for differentiation. Through close engagement with users, I rapidly explored various design variations, including themed slot concepts like Christmas, Halloween, and team-based competitions.
03 ✦ Ideate
Concepts for the Tutorial Flow
We explored different tutorial flow concepts to guide players clearly through the experience, focusing on the core features like socializing, challenges, and room customization as the foundation of the flow.
Welcome
Guide character introduction
Navigation
Controls & movement
Socialize
Chat & meet players
Group Play
Join a challenge
Room Edit
Customise your space
Complete
Reward & free play
03 ✦ Ideate
Tutorial Flow Blueprint
With the expansion of the tutorial system, it quickly became apparent that a reusable template had to be created. In addition to improving the existing process, I developed an outline that could explain the correct approach when developing a tutorial, providing novice developers on my team with guidance for their first project without having to rediscover the architecture themselves.
Bringing Ideas to Life
Prototype
04
Every iteration of the tutorial simultaneously served as a prototype for both the player experience and the editor being built to support it.
The prototyping phase had an unusual structure: because the tutorial editor was in development alongside the content, each tutorial build was effectively a test of two things at once.
Insights from playtesting the tutorial flow fed directly back into the editor's feature development, and limitations in the editor shaped what the tutorial could attempt. This created a tightly coupled iterative loop that was constraining at times but ultimately produced a tool and a tutorial that were well-aligned.
01 Dual Feedback Loop
The prototyping phase had an unusual structure: because the tutorial editor was in development alongside the content, each tutorial build was effectively a test of two things at once. Insights from playtesting the tutorial flow fed directly back into the editor's feature development, and limitations in the editor shaped what the tutorial could attempt. This created a tightly coupled iterative loop that was constraining at times but ultimately produced a tool and a tutorial that were well-aligned.
01 Dual Feedback Loop
The prototyping phase had an unusual structure: because the tutorial editor was in development alongside the content, each tutorial build was effectively a test of two things at once. Insights from playtesting the tutorial flow fed directly back into the editor's feature development, and limitations in the editor shaped what the tutorial could attempt. This created a tightly coupled iterative loop that was constraining at times but ultimately produced a tool and a tutorial that were well-aligned.
04 ✦ Prototype
3 Main Tutorials
The first tutorial provided training on socialization, that is, how to interact with other players.
Tutorial two introduced group games, which were meant to familiarize the players with collaborative gaming within Smeet.
The last tutorial was devoted to personalizing one’s room, a step-by-step procedure in creating a space for oneself in the game.
04 ✦ Prototype
Design Principles
After intensive research and interviews, we clustered findings via affinity maps, identified key needs and pain points, to then craft a precise problem statement.
Non-Intrusive Triggers
Tutorial cues were designed to emerge contextually — from zone entries, actions, and timers — rather than interrupting gameplay with modal blocks.
Extensive Debugging
Each tutorial iteration required thorough flow debugging. Edge cases — skips, disconnects, multi-step failures — were tracked and resolved across all platforms.
Precision from Day One
Because the Editor was built simultaneously, every UX decision had to be specified with engineering-level precision — leaving no room for interpretive gaps.
Testing with Users
Test
05
A/B testing was introduced early in the process, providing quick signal on which tutorial structures and character concepts were resonating with new players.
Testing also involved extensive hands-on debugging to ensure tutorial triggers fired naturally and without interrupting the experience.
01 Validation & Pivot
Early qualitative and quantitative testing revealed a critical insight: themed slot machines significantly improved retention metrics. This data-driven finding prompted a strategic pivot in our design approach, despite the added system complexity. User engagement data showed dramatic improvements even with the lower-fidelity prototype, as users were eager to invest, with engagement increasing up to 100%.
05 ✦ Test
Shaped in Practice
While the tutorial was being built, every implementation was also used as a practical input for refining the system behind it. This allowed issues in pacing, structure, and usability to surface early and be addressed directly within the development process.
05 ✦ Test
Finding What Works
The tutorial was shaped through rapid iterations driven by real player sessions and early A/B tests. Different versions of flows, characters, and interaction patterns were tested quickly to identify what worked best in guiding players through the core mechanics.
05 ✦ Test
A New Character
Special attention was given to how players emotionally responded to the tutorial character and guided interactions. Observations focused on engagement, motivation, and moments of confusion to understand how the experience felt rather than how it functioned.
What We Achieved
Impact & Learnings
06
Development of a custom tool and content at the same time is risky yet potentially very fruitful, as a result can be made perfectly adjusted to the particular problem, while costs of dependency are significant. The tutorial helped reduce drop-outs in the beginning of the game due to easier path to proficiency, and the custom editing tool designed along with it became the foundation for any further tutorials.
✦ Impact & Learnings
Final Notes
Key Takeaways
The Value of Tailored Tools
Developing a custom editor tailored specifically to the needs of tutorials underscored the value of investing in tools that simplify workflows and improve efficiency. By creating a solid framework, we not only addressed the immediate requirements but also laid the groundwork for scalability and seamless future updates.
The Cost of Tailored Tools
✦ Impact & Learnings
Final Notes
The Impact
Increased Retention
I helped new players quickly grasp the game’s mechanics, reducing frustration and minimizing drop-offs. Additionally, I highlighted the game’s key features, ensuring players could recognize and engage with its most exciting aspects, significantly boosting the potential for long-term retention and enjoyment.
Editor within an Editor
Editor within an Editor We started the project from scratch, designing everything from the ground up. We developed a custom editor within the existing framework to meet the tutorial system’s unique needs, building a robust infrastructure to streamline tutorial creation and support future development.
✦ Contact Me
Have a project in mind?
Looking for collaboration? Send an email to contact@vhoffmann.design for inquiries and projects or fill out the form.