I still remember the early days of my career – designing some of the very first native mobile applications, long before “mobile UX” was even a widely understood term. Back then, everything started in Photoshop. Every screen, button, gradient, and icon lived inside enormous .psd files that my laptop could barely handle.
The files were so heavy that saving took forever. Moving a group of layers felt like dragging furniture across a carpet. But that was the way things were done – because Photoshop was powerful, familiar, and the undisputed champion of digital design at the time.
Over the years, I’ve come to see the evolution of design tools as a kind of long-distance race:
Photoshop took an early lead, Sketch sprinted into relevance, InVision tried to redefine the track itself, and Figma emerged as the front runner by reinventing how teams collaborate.
And today, AI tools – especially Figma Make – are changing the race entirely. Designers are no longer just pushing pixels; they’re curating possibilities, guiding strategy, and shaping systems.
This article traces that evolution – and what it means for where we’re heading next.
The Photoshop Era: Heavy Files, Heavy Lifting
In the 2000s and early 2010s, Photoshop was the universal design tool. It wasn’t built for UI or mobile design, but it was the only mature option. If you were designing software, you were doing it in Photoshop – full stop.
It handled:
• Website mockups
• Early mobile app screens
• Icons and UI assets
• Marketing banners
• Interaction flows stitched together manually
And while it worked, it wasn’t ideal:
• Raster-based (not vector-friendly)
• Complex layer management
• Enormous files
• No prototyping
• No developer handoff
• Zero collaboration
Photoshop didn’t evolve for UI – UI designers evolved workarounds for Photoshop.
Sketch: When UI Design Got Its First Real Home (2010)
When Sketch launched in 2010, it didn’t just offer a new tool – it offered a new mindset. For the first time, a mainstream application was designed specifically for digital product design.
Sketch brought:
• Vector-focused UI design
• Multiple artboards on one canvas
• Symbols (the precursor to components)
• A clean, modern UI
• Lightweight exports
• A thriving plugin ecosystem
• “Retina-ready” asset generation
The experience felt like stepping into the future.
Suddenly screens were easier to build, easier to maintain, and easier to update.
For many of us, it was the moment product design became its own discipline.
InVision: Connecting the Workflow (Before Anyone Else Did)
While Sketch solved the problem on the canvas, InVision solved everything around the canvas.
Launched in 2011, InVision understood something the industry hadn’t fully articulated yet:
Design is not just screens – it’s collaboration.
With InVision, we could:
• Turn static screens into clickable prototypes
• Share links instead of screenshots
• Gather feedback directly in the UI
• Run remote design reviews
• Handoff specs to developers (via Inspect)
This was transformative.
Designers felt more connected to stakeholders, and developers could finally understand what designers intended.
InVision’s Ambitious Attempt at Unifying the Entire Workflow
InVision didn’t stop at prototyping:
• Freehand enabled collaborative brainstorming and sketching
• Design System Manager (DSM) centralized components and documentation
• Studio attempted to become a full UI design tool
• Boards helped organize ideas and visual inspiration
InVision saw early that the future of design tools would be end-to-end – from ideation to design to handoff. They didn’t win the race, but they redefined the course.
Figma: Cloud-Native, Collaborative, Transformational (2016)
Then came Figma, and everything changed.
Figma wasn’t just a competitor to Sketch.
It was a completely different idea of what a design tool could be.
Figma’s breakthroughs:
• Real-time multiplayer editing
• Browser-based access
• Cross-platform support
• Shared libraries and components
• Built-in prototyping
• Comments directly on the canvas
• Version control and branching
• FigJam for ideation and workshops
• A thriving plugin ecosystem
In one move, Figma absorbed the strengths of:
• Sketch’s UI design workflow
• InVision’s prototyping and collaboration
• Freehand’s real-time ideation
• DSM’s design system management
• Handoff tools like Zeplin and Inspect
Within a few years, Figma became the design tool – not because it had better features, but because it created a better way for teams to work together.
The Modern Design Workflow: A Fully Connected Loop
Looking at my workflow today compared to my early Photoshop days feels like comparing a typewriter to a tablet.
Modern design is a loop, not a linear process:
Ideation
Workshops, flows, and sketches in FigJam or Freehand-style tools.
2. UI design
Components, constraints, variants, and responsive layouts in Figma.
3. Prototyping
Interactive flows built directly on the canvas.
4. Collaboration
Real-time co-editing, commenting, tagging, and sharing.
5. Design systems
Shared libraries managed at scale.
6. Handoff
Dev Mode giving engineers tokens, code snippets, and assets.
7. Iteration
Fast, cloud-based cycles – no exporting, no syncing, no confusion.
Design work finally feels fluid.
Where We’re Heading Next: AI, Automation & Figma Make
The next era of design is already here.
It’s being shaped by AI, automation, and new ways of partnering between design, product, and engineering.
AI is accelerating early-stage design
Instead of starting from a blank artboard, designers now start with direction.
Modern AI tools can generate:
• Layouts
• UI patterns
• User flows
• Content variants
• Design alternatives
• Component states
• Entire onboarding journeys
• User personas and scenarios
Examples include:
• Galileo for generating UI screens from prompts
• Uizard for turning sketches into interfaces
• Magician or Sorcerer plugins in Figma for AI-powered edits
• Framer AI for generating production-ready websites
These tools don’t replace the designer – they replace the slow start.
2. Figma Make: AI that understands design systems
Figma Make is one of the most significant steps in modern design tooling.
Unlike AI tools that output screenshots or loosely-styled mockups, Make understands:
• Components
• Variants
• Constraints
• Autolayout
• Design tokens
• Hierarchy
• Naming conventions
• Responsive behavior
It creates designs that are structurally correct, not just visually appealing.
Examples of what Figma Make can generate:
• A full onboarding flow from a text prompt
• A dashboard layout using a company’s existing design system
• Multiple variants of a form or modal
• New states for components (loading, error, success)
• Visual explorations for marketing or product
• Instant wireframes for user testing
And every output is editable, responsive, and connected to your libraries.
This is why Figma remains the front runner in the design tools race – it’s not just adding AI, it’s integrating AI deeply into how design systems work.
3. The designer’s role is evolving
As AI handles more of the “first draft,” designers shift toward:
• Framing problems
• Understanding context
• Negotiating product strategy
• Ensuring ethical and accessible design
• Curating and refining AI-generated options
• Designing systems, not screens
• Orchestrating collaboration between disciplines
We’re becoming design strategists, not just producers.
4. Design and engineering are merging
Expect deeper connections between design and code:
• Bi-directional design tokens
• Production-grade components represented 1:1 in design
• AI-assisted prototyping that simulates real data
• Logic-aware interactions
• Automated accessibility auditing
• Continuous syncing with code repositories
In a few years, there may be no “handoff” – only shared ownership.
Closing Thoughts
I began my career exporting huge PNGs from Photoshop. Today I collaborate in real time inside Figma with teammates across continents. And tomorrow, I may start my next design from a single sentence prompt.
The evolution of design tools has been a race – sometimes chaotic, sometimes inspiring, always moving forward:
• Photoshop taught us the fundamentals.
• Sketch made UI design efficient.
• InVision connected the entire workflow.
• Figma unified everything – and now leads the AI frontier with Make.
The tools changed.
The processes changed.
And the role of designers changed with them.
But the heart of design remains the same: Turning ideas into experiences people love.
Our tools just finally caught up with the way we think, collaborate, and create.
Disclaimers:
This is not a product review, I simply share my views based on my personal experience using design tools over the years.
I don’t have any affiliation with any of the software companies named in this article.
AI has been used as assistance for grammar, structure, and proofreading this article.
Go Back
