The Webflow Conference 2023 brought sweeping changes to the way Webflow designers and developers all around the world work. In this blog post, we'll explore the new brand identity, product updates, ecosystem, and much more and shed light on Webflow's role in the industry. We'll also look at some further announcements and the conference in San Francisco.
Highlights
The Webflow Conference 2023 was packed with incredible sessions, and now, you can catch up on all of them. Whether you're interested in the keynote, fan favorites like the Speed Build Challenge, or thought-provoking discussions, the replay is available on the Webflow Conf site.
One standout event was the Speed Build Challenge, where some of the fastest and most talented Webflow builders went head-to-head, showcasing their skills and creativity. The competition featured remarkable community members, including Carlos Sepulveda, Ankita Gupta, Carlos Ogunsola, Riziki Neilson, Shreyas Kothakonda, and Stefan Velikov, making it a must-watch.
In "Show, don't tell," Marco Cornacchia, Product Designer at Figma, delved into his projects, demonstrating how you can use Webflow and your design skills to create captivating interactions and animations. Marco's key takeaway was to spend a significant portion of your time building and executing your ideas, providing valuable insights into practical design and flexibility.
"The modern marketer" session featured Nathan Pratt, Global Marketing Director at IDEO, Sara Varni, CMO at Attentive, and Michael Harrington, Director of Web Marketing at Bill, who joined Shane Murphy-Reuter to explore their web strategies and how they leverage Webflow to achieve their goals. They discussed specific marketing approaches tailored to their audiences and team structures that optimize success.
Lastly, the Webflow Awards celebrated the most creative and technically impressive projects by customers, community members, and partners. The replay from Webflow Conf allows you to witness these remarkable projects and the talented individuals behind them. If you're curious about the winners, you can find the full rundown here.
Updates
Rebranding
Webflow's recent rebranding effort embodies its core mission: making website creation accessible to everyone, with no code required. This brand makeover not only reflects its mission but also pays homage to its thriving user community.
Their fresh logo visually represents the fundamental building blocks of the web – HTML, CSS, and JavaScript, symbolizing the empowerment Webflow offers to all its users. This revamped brand identity results from months of dedicated work by their in-house design team, along with valuable input from the community.
3D Spline
The integration of Spline into Webflow represents a significant leap forward in web design capabilities. With this partnership, Webflow users can seamlessly incorporate immersive 3D experiences into their websites.
Spline, a web-based 3D design software, allows users to create captivating animations, visual models, and interactive scenes. This integration opens a world of creative possibilities, enabling designers to leverage expressive and interactive 3D elements for a more engaging web presence.
Webflow's decision to integrate with Spline not only adds a dynamic layer to web design but also aligns with the growing demand for interactive and visually compelling online experiences. This collaboration is poised to impact industries across the board, from e-commerce to creative agencies, as it enables businesses to deliver more prosperous, engaging content that captivates their audiences. As the web continues to evolve, integrating 3D experiences into Webflow signifies an exciting step toward the future of web design.
Variables and Designer APIs
Webflow's introduction of variables represents a significant shift in web design efficiency. Variables store key design attributes like colors and fonts, allowing designers to make global design updates in one go. The benefit is clear: it streamlines the design process, maintains brand consistency, and simplifies the editing workflow. This innovation reflects Webflow's commitment to empowering designers with the tools to create polished and coherent web experiences while saving precious time.
Webflow's Designer API update is a significant step forward in offering more control and flexibility to developers. This new suite of Component Designer APIs empowers developers to efficiently add, bind, and manage components on a Webflow site. It enables them to create dynamic, interactive web elements with ease, expanding the possibilities for custom designs and functionalities.
Additionally, introducing a Variables Designer API allows developers to define and manage variables, such as colors and fonts, providing greater control over design consistency and style throughout a website. These APIs are a testament to Webflow's dedication to enhancing the development experience, giving developers the tools to create tailored, engaging, and unique web solutions. As Webflow continues to evolve, these APIs represent a dynamic leap forward in customizing and enhancing the web design process, making it more accessible and versatile for developers.
Webflow world celebrity Timothy Ricks, the creator of T.ricks Webflow development YouTube channel and Lumos framework for Webflow, has already demonstrated the power of variables in his new video. He shows how, with the help of variables, Designer APIs, and a few lines of SCC, a universal spacing system that works automatically for all breakpoints is created.
Image Ratios
Finally, Webflow has introduced native support for the aspect-ratio CSS property within their Style panel. This enhancement empowers designers to take direct control over the aspect ratios of design elements. This not only simplifies the design process but also ensures visual consistency, provides instant visual feedback, and reduces the reliance on custom code.
To explore this new feature, you can head to the Style panel, which can be applied to various design elements, including images, videos, and grid layouts. For more detailed insights and guidance, Webflow University offers a comprehensive lesson on this latest addition. This update marks a significant step toward making design more accessible, efficient, and versatile.
New Webflow Apps
Wized
Wized is a game-changing tool that collaborates seamlessly with Webflow, making advanced web application development a breeze. It eliminates the need for React, Vue, or manual coding, allowing you to create interactive, responsive, and secure applications without the technical intricacies that typically accompany web development.
Now, it is available as a Webflow app and can be partially used right in canvas, so it's simpler to bind your Webflow and Wized functionality within the project you're working on.
Lokalise
The Lokalise App simplifies Webflow site translation, empowering marketing teams to stay fast and flexible. By seamlessly integrating Webflow into a continuous localization workflow, it streamlines processes, boosts autonomy, and enables a focus on impactful global content creation. However, this app requires Webflow Localization access.
Better Shadows
Creating realistic shadows on Webflow requires a lot of manual work. With Better Shadows, you can create satisfying shadows with just a few clicks. Never create shadows from scratch again.
Announcements
The recent news from Webflow Conference 2023 is creating quite a buzz in the web development and design world. Webflow is introducing exciting changes, starting with a fresh brand identity that shows its commitment to helping designers and developers. They've unveiled new features like the Lokalise App, making translation easier, and the Wized App, which makes web development more accessible.
Also, they've added features like variables, which simplify design, and Developer APIs, which give developers more control. Webflow is about making it easier for people to create beautiful websites, and these updates are a big step in that direction.
Localization
Localization is the key to reaching a global audience with your website, and Webflow makes it easier than ever. This end-to-end solution allows you to customize your site for visitors worldwide, from design and translation to top-notch SEO.
Designing and building localized sites is a breeze with Webflow. You can do it all visually in the Webflow Designer without writing a single line of code. As you add locales, you can easily switch between them to see how your site looks for each audience before publishing. Whether it's localizing static pages, CMS items, images, alt text, controlling element visibility, or customizing styles, Webflow has you covered.
Translation is made simple with native and third-party tools. You can start with machine-powered translation for a quick first pass and then go manual for more fine-tuned control. Webflow also offers direct integrations with translation management systems like Lokalise or provides flexible APIs for connecting to the TMS of your choice.
Webflow Localization doesn't just stop at design and translation; it's also a powerhouse for SEO. You can maximize organic traffic in your target locales with fully localized, best-in-class native SEO. Customize your locale slug, maintain domain authority with subdirectories, and take advantage of localized metadata, sitemaps, and site visitor routing.
Whether expanding into new markets or building professional localized sites, Webflow Localization has the right plan for you. It's available as an add-on to your paid Site plan, with monthly and yearly billing options to suit your needs. So, get ready to take your website global quickly and efficiently, thanks to Webflow Localization.
Slots
Slots are like magic placeholders that grant you the power to customize your Webflow components effortlessly. With slots, you can modify the structure of a component by placing any element or component within that slot. This flexibility enables you to tailor components to your needs without diving into code complexities.
Creating and managing modifiable properties within components becomes a breeze with Webflow's enhanced slots. Whether managing a main component or working with component instances on the canvas, you'll find that setting up, deleting, and linking properties and elements is more straightforward than ever. The new side panel simplifies content editing for even the most minor technical teammates by displaying only the component properties they can modify.
Slots mark a significant step in making Webflow components more powerful and user-friendly. They allow you to build and adapt components with unprecedented ease, approaching the capabilities of accurate React components. With slots on the horizon for all customers in the coming months, Webflow is raising the bar for web development and design by putting you in the driver's seat.
Custom properties (Inline CSS)
Custom properties, often called Inline CSS, are the secret sauce that adds a layer of customization to your Webflow styles. These properties allow you to add custom CSS styles and values directly to your elements within the Webflow Designer. This means you can fine-tune and personalize your design elements without the need for external code or extensive developer know-how.
With custom properties, your design gets a boost in flexibility. You can easily add and adjust CSS properties and value pairs within your classes and tags, enabling you to achieve a unique look and feel for your website. These custom properties are embedded within your styles, making it a breeze to customize your design at scale.
The beauty of custom properties is that they put the power of fine-tuned design in your hands, allowing you to create a one-of-a-kind web experience without relying on external code or complex workarounds. Stay tuned for more updates on how Webflow's custom properties will continue to enhance your design capabilities.
DevLink Updates
DevLink just got even more powerful with the ability to export Webflow components to your React environments. This expanded functionality opens up a world of possibilities, enabling you to leverage React-built components for your Webflow sites. With this feature, you can build dynamic, data-connected components like store locators and full-stack applications effortlessly.
The integration continues further. Webflow is continually working on expanding DevLink to offer even more features and capabilities. So, keep an eye out for future updates as Webflow continues to bridge the gap between design and development, making it easier than ever to create remarkable web experiences.
Summary
The Webflow Conference 2023 brought together a dynamic and talented community of web builders and designers. From insightful sessions to thrilling competitions, the event had something for everyone.
One of the highlights was the Speed Build Challenge, where top Webflow builders showcased their skills, making it a must-watch for those inspired by incredible web design.
"Show, don't tell" with Marco Cornacchia revealed the power of Webflow and design skills in creating captivating interactions and animations, emphasizing the importance of spending time building and executing ideas.
"The modern marketer" session featured leaders in the field who shared their web strategies and how they use Webflow to achieve their goals. It provided valuable insights into marketing playbooks and team structures that optimize success.
The Webflow Awards celebrated the most creative and technically impressive projects, highlighting the incredible work of customers, community members, and partners.
Overall, Webflow Conference 2023 was a platform for learning, inspiration, and recognition, and the replay allows you to experience these remarkable sessions and events firsthand.
If you are looking for top-notch Webflow expertise, the Sommo team is here to help! Check out our portfolio of Webflow projects and get in touch for unparalleled professional support.
