Back to Blog
Mobile-First Is Dead, Intent-First Is Here: Designing for What the User Is Trying to Do

Mobile-First Is Dead, Intent-First Is Here: Designing for What the User Is Trying to Do

Mobile-First Is Dead, Intent-First Is Here: Designing for What the User Is Trying to Do

Confession: "Mobile-first" was excellent mobile app design advice in 2011. Luke Wroblewski's book landed at exactly the right moment — smartphones were exploding, responsive web design was new, and starting from a 320px viewport was a sane, teachable constraint. But somewhere between then and now, mobile-first slid from a design strategy into an unexamined default. Dolfy.ai was built for what comes next. We taught a generation of designers and developers to reach for the smallest breakpoint first, add media queries, and call it done — without ever asking whether the user's phone was the right place to start.

The discipline of mobile app design isn't about screens — it's about what a person is trying to accomplish in the moment they pick up any device. That shift has a name: intent-first design, and it changes everything about how you build mobile experiences.


Key Takeaways

  • Mobile-first design is a 2011 principle that starts layouts from the smallest screen (320px) — but the user's device doesn't tell you what they need.
  • Intent-first design starts with the user's goal (transfer money, check a score, finish a checkout) and adapts the interface to that goal across any device.
  • Users switch devices mid-task constantly — a single intent-driven flow that spans their phone, tablet, and laptop is the new normal, not an edge case.
  • Dolfy's 5-step Design OS forces clarity on user intent before any screen is designed, making intent-first a built-in workflow, not an afterthought.

What Was Mobile-First Design, and Why Did It Win?

Mobile-first design is a responsive design strategy where you begin by designing for the smallest screen — typically a smartphone at 320px wide — and then progressively add layout complexity as the viewport (the visible area of a web page on a given device) expands. At predetermined breakpoints (screen widths where the layout shifts, such as 768px for tablets or 1024px for desktops), you layer on wider grids, sidebars, and richer interactions.

It won because it was the right answer to a hard problem. In 2011, desktop-only sites were breaking on iPhones. Starting from the most constrained canvas forced teams to prioritize content, cut the cruft, and think about touch targets. The principle was sound, and it shaped a full decade of sensible design decisions.

But "start small" is not the same as "start right." Mobile-first answers the question "How do we make this fit on a phone?" The better question — the one intent-first asks — is "What is the user actually here to do?"


What Is Intent-First Design, and How Is It Different?

Intent-first design is the discipline of building an interface around user intent — the specific goal a person is trying to achieve in a given moment — rather than around the device viewport they happen to be using.

A mobile-first screen for a banking app might look like this: a hamburger menu hiding navigation, an account-summary card that requires scrolling to see all balances, and a "Transfer" button buried inside a submenu. The screen fits on a phone. It even looks clean. But the user — standing on a train platform, trying to send rent money before the train arrives — has to hunt. Swipe. Tap. Wait. Hunt again. That's a task completion failure: the user has a job to do and the interface is in the way.

An intent-first screen for the same moment wouldn't be a "screen" at all in the traditional sense. It would open directly onto the transfer flow, because the system understands the user's hour-of-day context, recent behavior, and stated goal. One primary action. One supporting piece of context (account balance). No hunt.

The difference is fundamental. Mobile-first says "The phone is the constraint; design around it." Intent-first says "The user's goal is the anchor; adapt the entire experience to it, across every device they touch."


Why Does Intent-First Matter More Now Than Ever?

Because users stopped behaving like linear page-viewers. Google's foundational research on multi-screen behavior found that 90% of people use multiple screens sequentially to complete a single task over time — moving from phone to tablet to laptop and back, often within the same hour. That was in 2012. In 2026, the blending has only deepened.

Consider the modern checkout journey. A user scrolls Instagram on their phone, taps a product ad, skims the landing page, and bookmarks it. Later, at home on a tablet, they compare specs and add the item to a cart. The next morning at work, they pull up the cart on a laptop and complete the purchase. That isn't three separate sessions — it's one continuous user intent, fragmented across devices because the experience was never designed to follow the user.

Forrester Research reports that a well-designed, frictionless user interface can increase conversion by up to 200%, and an even more dramatic up to 400% when optimization focuses on the specific user task rather than general aesthetics. Adobe's consumer research reinforces this: 38% of users will stop engaging entirely if the content or layout feels wrong for their context — not wrong in absolute terms, but wrong for what they're trying to do in that specific moment.

user task continuity across devices with intent-first design

An intent-first approach closes the gap. When the interface is shaped around the user's goal rather than the device's viewport, every interaction becomes more direct. Fewer taps to completion. Less cognitive load. Higher satisfaction — and, critically, higher conversion on the actions that actually matter to the business.


What Does Intent-First Mobile App Design Look Like Before a Single Pixel?

Most design tools open on a blank canvas. You pick an artboard size — iPhone 15, say — and start placing elements. The problem: you've already made a device bet before you've defined what the user needs to do.

Design OS — short for Design Operating System — is a structured methodology that inverts this entirely. Instead of starting with screens, it starts with product clarity. First: define what the user is trying to accomplish. Then: map the data the system needs to support that goal. Only then — as the third and fourth steps — do you design the foundation and the actual screens.

Here's how Dolfy's 5-step Design OS translates intent-first thinking into a practical, repeatable workflow:

  1. Product Definition — Articulate the user's core intent in plain language. Not "build a social app." Rather: "Let outdoor runners find and join group runs near them this week." The intent is the spec.
  2. Data Model — Model the objects the user actually interacts with: runs, runners, locations, schedules. If a field doesn't serve the user's intent, it doesn't belong.
  3. Design Foundation — Establish visual hierarchy, design tokens (named design values like colors, spacing, and typography that stay consistent across every platform), and component patterns that express user goals — not just device constraints.
  4. Screen Design — Finally, design screens as renderings of intent. Each view has one primary action, one supporting context, and zero unnecessary elements.
  5. Export — Generate production-ready React Native and Tailwind components with TypeScript types, ready for Expo Go preview or direct integration.

The shift is practical, not philosophical. When you define intent before pixels, you design fewer screens overall — because you stop building variations for every breakpoint and start building one intent-driven flow that adapts naturally.


How Dolfy Embeds Intent-First Thinking Into Mobile App Design

Dolfy.ai was built from the ground up around this workflow. You don't start by dragging rectangles on an artboard. You start by describing your app idea to Dolfy's specialised AI agents — a Product Manager and a UI Architect — who walk you through each of the five Design OS steps.

The Product Definition phase is the moment intent-first becomes tangible. Instead of guessing at screen layouts, you answer structured questions about your users' goals. The AI PM probes: What's the one thing a user must accomplish in their first 30 seconds? What does "done" look like for this task? The answers become the design brief — and the brief drives every decision that follows.

By the time you reach Screen Design, the heavy lifting is done. Your component library already reflects the data model, the visual hierarchy already expresses the intent hierarchy, and the export step produces real, usable React Native code with TypeScript types and design tokens that stay consistent from mobile to web.

For solo founders, indie hackers, and small mobile teams — the people who don't have a design ops department — this is more than a convenience. It's the difference between shipping an app that just "fits on a phone" and shipping one that actually helps the user get their job done.


FAQ

Isn't mobile-first still important for performance and accessibility?

Yes, but intent-first doesn't discard performance or accessibility — it layers them under a more important question. You still optimize load times, use semantic markup, and design accessible touch targets. You just stop treating the 320px viewport as your design's reason for being. Intent-first asks "What does this user need to do?" first; performance and accessibility answer "How do we deliver that fast and for everyone?"

How do you discover user intent without a full UX research team?

Start with the job the user hired your app to do — a concept from Clayton Christensen's Jobs-to-be-Done framework. Write down, in one sentence, what the user is trying to accomplish. Then list every step they must take to finish that job. Anything on that list that your interface makes harder than it needs to be is a design bug. Dolfy's Product Definition step guides you through this same exercise, so you don't need a $50K research engagement to get started.

Does intent-first mean I ignore different screen sizes?

No. It means you design the flow first, then adapt the layout to each device. The difference: instead of building three separate layouts for phone, tablet, and desktop, you build one intent-driven component system that presents the right amount of context for each screen size. The core action — the intent — stays dominant regardless of the device.

What's the relationship between intent-first design and component-driven development?

They're natural partners. Component-driven development (building UIs from reusable, self-contained components) maps cleanly onto intent-first thinking because each component can represent a single user action or piece of context. A "TransferButton" component isn't just a styled button — it's the user's intent to move money, rendered as a UI element. Dolfy's export step produces exactly these kinds of intent-driven React Native components, complete with TypeScript types.


The Design Discipline That Survives the Next Decade

Mobile-first design served its era well. It gave developers a starting point, a constraint, and a shared vocabulary. But the conversation has moved on. Users don't think in viewports — they think in tasks, goals, and moments. A person reaching for their phone on a crowded bus isn't choosing a "mobile experience." They're choosing a tool to do a job. The design has to match that job, not the glass it's rendered on.

That's the promise of intent-first mobile app design. It replaces the device-centred checklist with a user-centred discipline. It asks the hardest question first — What does the user actually want to do? — and lets every design decision flow from the answer. Tools like Dolfy.ai, with their structured 5-step Design OS and production-ready React Native exports, make that discipline accessible to anyone with an idea and a keyboard.

Build around intent. Let the screens follow. Everything else — the breakpoints, the viewport sizes, the responsive grid — is just implementation.

Ready to design apps around user intent, not screen sizes? Try Dolfy at dolfy.ai — describe your app idea and let the AI guide you from vision to production-ready React Native components.

Built by AEGONTECH LLC.