# Replicate Labs / Join a call
Case studyResponsive
One flow, 3 screen sizes
Join-meeting screens for a video call with the AI coach, designed for desktop, tablet and mobile.
Read the case studyThe work
The moments we design
The layout rules that keep a product clear at every size, from wide monitors to small phones.
- Breakpoints and layout grids
- Responsive navigation
- Content priority on small screens
- Tables and data on mobile
- Forms and keyboards on mobile
- Images and media that scale
- Touch targets and thumb reach
- Typography that scales
- Modals and sheets across devices
- Responsive components
- Layout specs for developers
- Testing on real devices
The problem
Sounds familiar?
If 2 or more of these ring true, you need layout rules, not just more screens.
Tick the ones that sound like you
Let’s solve these together.Book a call
Selected work
Selected responsive work
Client case studiesScreens on Dribbble and BehanceClient work
# Teacherspace / Web and mobile
ClientWeb and mobile
One lesson page, on web and phone
We designed web and mobile experiences for Teacherspace’s secure teaching video, feedback and educator collaboration tools.
See all clients# Influencer Marketing AI / Locked insights
ScreensResponsive
One modal, every breakpoint
An upgrade modal that keeps its hierarchy on desktop, tablet and mobile.
View on Dribbble# Replicate Labs / Coach profile
ScreensResponsive
Settings that adapt, not shrink
Coach customisation and video profile screens that rearrange for each screen size.
View on DribbbleProof
“When we bring her a new feature idea, she quickly turns it into thoughtful design options with relevant user states, journeys, and clear assumptions.”
- Upwork Job Success
- 100%
- Regular clients
- 10+
- Recognized by
- Dribbble Select
Ways to start
2 ways to start
Set layout rules for a new product, or fix the screens that break today.
-
# New product
Design every breakpoint
Layouts and rules for desktop, tablet and phone, defined before the build.
- Breakpoint and grid system
- Key screens at each breakpoint
- Responsive component rules
- Dev-ready handoff in Figma
-
# Existing product
Fix responsive gaps
Find the screens that break on smaller devices, then redesign them.
- Review across devices and breakpoints
- Prioritized findings
- Redesigned screens
- Dev-ready handoff in Figma
The ones your users actually use. We usually define layouts for desktop, tablet and phone, plus the rules in between.
It depends on the scope. Once we’ve seen the full picture, we’ll share a rough timeline.
We design one product with clear rules for each breakpoint, and separate layouts only where the task really changes.
Yes. We review how it behaves on real devices and fix the screens that break first.
No. We’re a design studio. You get layouts, rules and handoff files your developers build from.
Related capabilities
Explore all capabilities
2 client slots open
Show us the screen that breaks on mobile.
A rough idea is a fine place to start. We’ll get back to you within 24 hours.