Sketch Athens

Probably the biggest Sketch update ever, with a new naming scheme for updates, named after European cities.

New in this release is Stacks, a new version of Auto Layout more in line with tools like Figma. Artboards are no longer a thing and are now replaced by Frames and Graphics. Frames will responsively adapt when scaled and Graphics scale proportionally to keep the same look. The command bar also got a big overhaul and now shows components for easier access.

That’s just the big update, there are over 64 other improvements made, so take a look at the release notes for all details.

Check out in-depth posts about Stacks, Frames & Graphics, and the Command Bar.

‍

‍

‍

FlutterFlow 6.0

FlutterFlow celebrated its 4th birthday last week by releasing FlutterFlow 6.0.

Here are some of the new features:

  • Use custom Dart files to incorporate your own classes in your project
  • Custom code expressions to quickly format text and perform conditional checks
  • Pages can be added to libraries for better reusability
  • Figma frame import to easily convert your existing designs; this will work for both pages and components
  • Multi-team support to quickly switch between teams
  • YAML edits, access your project via API, and MCP server

Read more about FlutterFlow 6.0

‍

‍

‍

Figma Dev Mode MCP Server

Figma's MCP server for Dev Mode is now available in beta. It allows you to bring information from Figma directly into your code editor. It can generate code from selected frames, extract design context like variables, components, and layouts. Additionally, the MCP server will inform AI agents about existing components based on Code Connect.

Learn how to use the Figma MCP Server

San Francisco fonts in Figma

Apple’s fonts, SF Pro and SF Compact, are now automatically installed in Figma. This means you no longer need to download them via Apple’s Developer portal to use them in your projects.

Read more Apple Fonts in Figma

‍

‍

Webflow improvements

Webflow has released quite a few updates to make it easier to build websites, clean up your projects, and make your sites faster.

Per page CSS

Previously, JavaScript was added per page to reduce your page load time and improve performance. This feature is now also available for CSS, allowing it to load only the specific CSS needed for each page.

Screenshot of Webflow's website settings with performance toggles where Per page CSS is turned on and highlighted with a blue border around it. It also show a warning: "Custom code or embedded HTML that relies on user-defined CSS classes may not render properly."

‍

Optimize via AI Assistant

With Webflow’s AI assistant, you can now automatically optimize your website. This includes better CTAs, more personalized copy, editable recommendations, and automatically creating variations of existing pages. An additional update for optimizations is that Webflow will automatically remove the elements on a page when you delete a draft to keep your website tidy.

Screenshot of the Webflow design interface with the Optimizations panel opened. The cursor is over a new highlighted item "AI-powered suggestions"

‍

CMS auto-save

Changes you make to CMS items will now be auto-saved while you work. Published items will get a new draft status so your changes won’t be published immediately.

Screenshot of Webflow's CMS interface showing a published item with a label "Changes in draft" next to it and a "Saved" label. The cursor hovers over the saved label and shows a tooltip: "Saved a few seconds ago".

‍

‍

Vibe Designing with Subframe

Dive Club published a new interview with Subframe co-founder Filip Skrzesinksi. They dive into how Subframe works, and how it differs from other AI design tools.

‍

‍

Improve your AI UI Generation

Design+Code posted a new video showcasing how to improve your UI generation skills after creating over 400 designs with AI.