By Mehdi HassanRedesign inspiration usually means a gallery of pretty after-screens. That's the least useful part. What you can actually reuse from a famous SaaS redesign is the reasoning: what problem forced the change, what moved, and how the company got millions of habitual users through it without a revolt. These examples focus on that, using only what each company made public.
What are good examples of SaaS product redesigns?
Six well-documented SaaS redesigns worth studying are Figma UI3, Slack's 2020 desktop redesign, GitHub's global navigation, Gmail's integrated view, Linear's 2024 refresh and Jira's new navigation. Each one changed a product people use for hours a day, and each was announced publicly with its reasoning. Together they cover the main types of change: visual refresh, navigation restructure and workspace consolidation.
Product | Type of change | What moved | Rollout pattern |
|---|---|---|---|
Figma UI3 | Full interface redesign | Toolbar, panels, canvas chrome | Opt-in beta, switch back, revised after feedback |
Slack desktop (2020) | Navigation restructure | Search bar, sidebar sections, compose | Staged release to all workspaces |
GitHub navigation | Global navigation | Top bar, repository menus | Opt-in feature preview |
Gmail integrated view | Workspace consolidation | Mail, Chat and Meet in one rail | Opt-in, then default with a period to revert |
Linear (2024) | Visual refresh and structure tune-up | Sidebar, headers, theming | Shipped with a public write-up of decisions |
Jira navigation | Navigation restructure | Sidebar and top bar across products | Gradual rollout across Atlassian apps |
What can you learn from Figma's UI3 redesign?
Figma's UI3 is the clearest public example of a redesign that changed course after beta feedback. Figma introduced a reworked interface with a new toolbar and floating panels, let users opt in and switch back, and later adjusted the panel behavior after designers pushed back on losing canvas predictability.
The lesson is in the toggle. Because users could switch back, Figma got honest feedback without forcing a breaking change on professionals mid-project. And because the company was willing to revise a visible design decision, the beta built trust instead of resentment. If you're planning a staged launch, our guide to rolling out a redesign turns this pattern into steps and announcement templates.
How did Slack and Jira redesign navigation for growing teams?
Slack and Jira both redesigned navigation because their original structure couldn't hold how big customers now used them. The visual styling was secondary; the point was making many channels, projects and tools findable.
Slack's 2020 desktop redesign moved search into a single bar at the top, added a dedicated compose button and let users group the sidebar into custom sections. Those changes answer one problem: people in large workspaces drowning in channels. Atlassian's new navigation for Jira similarly consolidated sidebars and top bars across its products so people moving between tools see one consistent structure. Both are examples of a structural redesign, the scope we compare against lighter options in redesign vs refresh.
What do GitHub and Gmail show about opt-in redesigns?
GitHub and Gmail show that an opt-in phase lets heavy users adopt a redesign on their own schedule, which lowers resistance at the default-on moment. Both made the new design available to try before it became standard.
GitHub shipped its new global navigation as a feature preview, so developers who wanted it could switch it on while others kept working undisturbed. Gmail introduced its integrated view, which puts Mail, Chat and Meet in one side rail, as an option first, then made it the default while still letting people revert for a time. The shared pattern: tell people early, let enthusiasts go first, and give everyone else a defined runway.
What makes Linear's 2024 redesign different?
Linear's 2024 interface refresh is notable for how openly the team explained its decisions, from sidebar density to how themes are generated. It's a refresh and structural tune-up rather than a teardown, which suits a product whose users already liked it.
The lesson for most SaaS teams is restraint. Linear tightened what existed: headers, navigation density and color consistency. That's a reminder that a redesign doesn't have to move everything to feel new. Small, consistent changes applied across every screen often read as a bigger upgrade than one dramatic new page. For more interfaces worth studying for their details rather than their redesigns, see our collection of SaaS UI design examples.
How to write your own before-and-after breakdown
When you study a redesign, or document your own, capture five things for each change: the problem in one sentence, the before screen, the after screen, what users had to relearn, and how the change was rolled out.
For example, suppose you're breaking down a sidebar change. Problem: users with many projects scroll to find them. Before: one flat list. After: pinned favorites plus grouped sections. Relearning: where favorites live. Rollout: opt-in for two releases, then default. That five-line format is more useful in a planning meeting than a slide of screenshots.
What do these SaaS redesign examples have in common?
The successful redesigns share four habits: a named problem, a staged rollout, a way back during the transition, and visible changes in response to feedback. None of them launched a big surprise on a Monday morning.
- A real problem drove the change. Scale, consistency across products or professional workflows, not "it looks old."
- Users could try it first. Opt-in betas and feature previews appear again and again.
- There was a defined way back. A switch-back toggle with a known end date reduces panic.
- Feedback changed the result. Figma's panel revision is the clearest case, but every good rollout ships fixes between stages.
- The structure came before the styling. Navigation and information architecture were the main decisions, with visuals supporting them.
Before borrowing any of these patterns, check that your product actually needs the change. Our list of signs your app needs a redesign helps, and the SaaS product redesign guide covers how to plan the whole thing without losing users.
How should you use redesign examples in your own project?
Use redesign examples to choose a rollout pattern and to win internal arguments, not to copy layouts. A big company's interface is shaped by its scale and its users; copying the look rarely fits a startup's product.
Pick the example closest to your scope. If you're restructuring navigation, Slack and Jira are your references. If you're refreshing a product people already like, look at Linear. If your users are professionals who can't afford disruption, follow Figma's opt-in and revise approach. If you want an outside view on which pattern fits your product, a free 30-minute call is enough to talk it through.
