
No-Code: Jak przejść ścieżkę od designera do no-code developera
About
Jeżeli do tej pory tylko projektujesz, lub tworzysz strony w Webflow, a chcesz pójść o krok dalej to ta prezentacja jest dla Ciebie.
W trakcie wystąpienia zaprezentuję na przykładach, w jaki sposób zamienić projekt z Figma w kompletną aplikację Bubble. Pokażę Wam praktyczne strategie i porady przedstawiając możliwości, jakie platformy no-code oferują dla wszystkich, którzy chcą zacząć tworzyć swoje produkty cyfrowe i startupy. Omówimy korzyści jakie daje no-code, ale także pewne ograniczenia i zagrożenia, które musicie wziąć pod uwagę.
Moim celem jest zainspirowanie Was potencjałem no-code oraz pokazanie, jak możecie wykorzystać te narzędzia do pokierowania swojej kariery na nową ścieżkę - od designera do no-code developera.
Watch the full talk
Watch this WaysConf session, then continue with related talks or explore the current programme.
Talk in brief
In this WaysConf 2024 presentation, Tom Wesołowski outlines the transition from a traditional UI/UX designer to a full-stack no-code developer using Bubble. He explains how the traditional model of product development—which required a large team of frontend, backend, and QA engineers—is being disrupted by visual development platforms. Wesołowski highlights that designers possess a unique competitive advantage in the no-code space because their aesthetic and usability skills allow them to build highly polished, user-friendly applications that stand out in an AI-dominated market. Through a comparison of Webflow and Bubble, he demonstrates how Bubble's built-in relational database, workflow editor, and native integrations enable the creation of complex web applications rather than just static websites. He also shares practical workflows, such as using Figma plugins to directly import auto-layout designs into Bubble's CSS flexbox editor, and discusses how to scale these applications to millions of records by pairing Bubble's frontend with external backends like Xano.
Key takeaways
- 01
Designers Have a Competitive Edge
In an era dominated by automated AI generators, a designer's ability to create beautiful and highly usable interfaces is a major differentiator. This aesthetic expertise allows them to build more appealing no-code products than developers without design backgrounds.
Watch from 5:30 - 02
Bubble Offers Full-Stack Capabilities
Unlike platforms like Webflow that focus primarily on frontend websites, Bubble includes a built-in relational database and a workflow editor. This allows creators to build complex web applications with user authentication and native payment integrations without writing code.
Watch from 11:32 - 03
Figma Designs Can Be Directly Imported
Designers can leverage specialized plugins to convert Figma frames built with auto-layout directly into Bubble's CSS flexbox layout. This workflow significantly reduces the manual effort required to rebuild user interfaces from scratch.
Watch from 15:20 - 04
AI Page Generation is Still Basic
While Bubble is actively developing its AI Page Designer, its current output is limited to generating simple wireframes and basic layouts. It is not yet capable of producing production-ready, highly customized designs.
Watch from 16:53 - 05
Scale Bubble with External Backends
For applications requiring massive scalability or handling millions of events, developers can connect Bubble's frontend to an external backend like Xano. This hybrid approach keeps operational costs manageable while maintaining high performance.
Watch from 24:21
Video chapters
- 0:03Introduction to No-Code Development
Tom Wesołowski introduces the concept of transitioning from a designer to a no-code developer and questions the traditional need for large engineering teams.
- 3:34The Success Story of Audio Pen
The speaker shares how a single developer built a highly profitable voice-to-text application using Bubble in just twelve hours.
- 5:30The Designer Advantage in No-Code
Designers possess a unique edge in the no-code ecosystem because their aesthetic skills help products stand out in an AI-driven market.
- 8:23Building and Selling a Weekend Project
The speaker showcases Samer, an AI-powered newsletter summarizer he built over a single weekend and later sold on a marketplace.
- 10:47Technical Differences Between Bubble and Webflow
A detailed comparison of Webflow's website-focused features versus Bubble's full-stack web application capabilities, including databases and workflows.
- 15:20Bridging Figma and Bubble
The speaker explains how Figma plugins can directly translate auto-layout designs into CSS flexbox structures inside Bubble.
- 16:53Evaluating Bubble's AI Page Generator
An analysis of Bubble's current AI capabilities, which are currently best suited for generating basic wireframes rather than polished designs.
- 19:51Addressing Scalability and External Backends
During the Q&A session, the speaker discusses how to scale Bubble applications to millions of records by integrating external backends like Xano.
Read edited transcript highlights
These concise notes were edited from automatic captions and checked against the talk structure. They are not a verbatim transcript.
Disrupting the Traditional Development Team Model
Historically, building a digital product required assembling a large team, including UI designers, frontend and backend developers, QA engineers, and a CTO. Today, no-code platforms like Bubble disrupt this model by allowing a single creator to build and launch fully functional web applications independently, significantly reducing time and resource requirements.
Watch from 2:42The Competitive Advantage of Designers in No-Code
In a market increasingly filled with automated AI generators, a designer's ability to craft beautiful, intuitive user experiences is a major differentiator. While many no-code developers lack a design background, designers who learn to build can create highly polished, professional products that immediately stand out.
Watch from 5:30Comparing the Architecture of Webflow and Bubble
While Webflow is excellent for designing responsive websites using HTML and CSS, it requires external integrations for complex application logic. Bubble, on the other hand, is a complete full-stack platform. It features a built-in relational database, a visual backend workflow editor, and native user authentication, allowing creators to build complex web applications without third-party tools.
Watch from 10:47Streamlining the Workflow from Figma to Bubble
Designers can dramatically speed up their development process by using plugins that connect Figma to Bubble. By ensuring that Figma designs utilize auto-layout, these tools can automatically convert the visual elements into Bubble's CSS flexbox structure, allowing designers to copy and paste entire pages directly into the editor.
Watch from 15:20Optimizing Performance with Hybrid No-Code Architectures
When scaling an application to handle hundreds of thousands of users and millions of database records, developers can optimize both performance and cost by using a hybrid architecture. By pairing Bubble's visual frontend with a powerful external backend like Xano, creators can maintain high performance and keep operational costs manageable.
Watch from 24:21


