First-Principles Mobile Product Design
Design around the device and user context instead of copying inherited patterns.
- Difficulty
- Advanced
- Time to result
- ~months to results
- Steps
- 6
- Confidence
- 88%
Begin with the behavior users perform most often, the physical context in which they perform it, and the capabilities of the device. Then treat established interface patterns as optional rather than automatically correct. Snapchat opened directly into the camera because capturing was the primary action, used gestures to move among modes, adopted vertical video for phone-native immersion, and used Snapcodes to add nearby friends by showing one screen to another. These choices initially felt unfamiliar, but together they formed a consistent grammar that frequent users could operate quickly. The mechanism is not novelty for its own sake. It is contextual fit: align defaults, orientation, navigation, and sharing with how the device is actually held and how the social interaction really occurs, then refine the resulting system through use.
Origin
Extracted from The Shawn Ryan Show
Core principles
- 01Device context should shape the interface.
- 02Inherited conventions are hypotheses, not laws.
- 03A coherent new interaction grammar can outperform familiar patterns.
- 04The product should minimize effort for its dominant behavior.
How to run it
- 1
Identify the dominant behavior
Determine the action users most frequently want to perform and the moment in which they open the product.
Pro tip Observe behavior rather than relying only on stated preferences.
Watch out Do not let secondary features determine the default screen.
- 2
Model the physical context
Account for screen orientation, one-handed use, cameras, proximity between users, attention span, and environmental constraints.
Pro tip Design with the phone in the user's hand, not solely on a desktop canvas.
Watch out Repurposed desktop layouts often waste mobile capabilities.
- 3
Challenge inherited patterns
Examine how incumbents solve each interaction, then ask whether their pattern fits this product's actual context.
Pro tip Keep conventions that reduce genuine cognitive load and discard those preserved only by habit.
Watch out Being different without a contextual reason creates needless confusion.
- 4
Prototype a native grammar
Create consistent gestures, defaults, and transitions around the core behavior.
Pro tip Make common actions reachable with very few taps or swipes.
Watch out Unrelated gestures and hidden states can make the product impossible to learn.
- 5
Test learnability and speed
Observe first-time users and experienced users to verify that the interface becomes efficient after learning.
Pro tip Measure both onboarding failure and expert task speed.
Watch out Expert enthusiasm can conceal severe accessibility or discoverability problems.
- 6
Extend the grammar consistently
Add new features in ways that preserve the product's device-native logic rather than reverting to generic templates.
Pro tip Use the same spatial and gestural metaphors across related features.
Watch out Feature growth can fracture the interaction model into inconsistent modes.
In the wild
Instead of presenting a conventional list with a navigation bar, Snapchat opens in camera mode and uses gestures for movement. The interface reflects the assumption that users arrived to capture or view an immediate moment, not browse a persistent database.
→ The core creation behavior becomes immediate, and experienced users can navigate rapidly.
Snapchat recognized that people adding one another were often standing together. A user could show a code on one phone to another phone rather than complete a conventional invitation or username-search workflow.
→ Friend addition matched the real-world social context and made QR-like codes useful to mainstream consumers.
Snapchat required advertising and content to appear in the orientation in which people naturally hold phones, rather than reusing letterboxed television assets or requiring viewers to rotate their devices.
→ Advertising occupied the full screen and felt native to the surrounding mobile experience.
Common mistakes
Copying the incumbent playbook
A proven pattern from another product may encode assumptions that do not apply to a new device, audience, or behavior.
Confusing novelty with innovation
An unusual interface is valuable only when it improves contextual fit, speed, expression, or engagement.
Ignoring the learning curve
A coherent new grammar can become efficient, but teams must still test whether users can discover and learn it.
Is it for you?
Best for
It is best for product teams creating mobile experiences whose core behavior differs materially from established feed, menu, or desktop workflows.
Not ideal for
It is not ideal when users require strict conformity with familiar accessibility, safety, or enterprise interface standards.
From the transcript
“nope, you open it up and it's in camera mode, and then everything is gestural from there.”
“Once you learn it, you get incredibly fast at that. And it's like its own language and grammar.”
“everything is completely rethought in this absolute mobile first way.”
From the episode
Snapchat