Design Thursday #42
A weekly recap of everything you need to know about tools, events, guidelines and design in general.
FlutterFlow 5.0
FlutterFlow Developers Conference took place this week where they highlighted some work the community has been building and had some talks going in-depth on how others use FlutterFlow. On top of that they also shared FlutterFlow 5.0 which will be available early next week. Here are some of the new features that will be coming soon:
- Widgets as parameters: think of it as component slots, you can now use other widgets to fill out a page. Making it possible to create more flexible layouts without starting from scratch again.
- New action triggers: A lot of new action triggers have been added which allow you to swipe, drag, pan, pinch and hold to trigger an interaction. Making your product more intractable than was possible before.
- Keyboard shortcuts: Use keyboard shortcuts to create actions, making it possible for example to create a command bar with ⌘ / Ctrl + K. This allows you to build better desktop or tablet apps.
- Multiple databases: Link a production, staging or development database for better testing, so you don't have to mess up your production environment.
- Commits: Work better with other people by using commits in branches. Letting them know what you have been working on.
- Import projects: You can now import existing projects so you don't have to start from scratch. This can also be used to import a new UI Kit on an existing project.
- VS Code integration: You can now edit the code of your FlutterFlow project right in VS Code and sync it back, making it adapt to your own tools. This will also make it easier to build custom widgets.
Not show in the introduction video, but FlutterFlow also shared a cool AI demo where you could draw a component and it will automatically create a fully functional Flutter widget that you can use in your project.
Rewatch FlutterFlow Developers Conference 2024
Rive in Webflow
Rive is now natively supported in Webflow allowing you to embed your animations and use it together with Webflow's interactions. You can just upload your Rive file, drag it onto the canvas, select an artboard plus state machine and optionally connect it to a Webflow interaction.
Learn more about Rive in Webflow
New Rive text features
Also new in Rive: new text features. You can set overflow to 'Fit' which will automatically scale your font size to fit within the text box. Change the text wrapping and vertical alignment to align top, middle or bottom. Just a few changes that make it easier to use text in your animations.
Sketch version 101
Sketch is back with a bunch of updates including:
- Smart Animate: Similar to Magic Move in Keynote, you can now smartly animate between arboards in prototypes.
- Swap libraries: have a different library for dark mode or a subbrand? You can now easily swap them to design with another library.
- Use Color Variables in gradients
- A refreshed web app UI
- Export any asset from the web app: You no longer have to make an asset exportable while designing (although your devs will quite like it if you still do), because you can now export assets, choose the size and file format via the web app without any prior setup.
- Better PDF exports: You now have more control when exporting to PDF, you can select which Artboards to export and choose if they should show the title and are rendered as bitmaps. You can also include comments if you wish.
- Spanish support: Sketch is now fully translated and usable en español
Talking Layers
Sketch has a new video show where Rafa (designer at Sketch and previous cohost of the Layout podcast) talks to other designers about their design work. The video aspect is great because you get an inside look at other people's Sketch files and get to learn more on how they work. The first episode features Sebastiaan de With designer of camera apps Halide and Kino.
Figma's EmbedKit 2.0
Figma has updated the way you embed designs, prototypes, slides and FigJam boards. This new version has enhanced security and more options to control embeds. This will also allow you to view embeds even when you don't allow cookies of the website you are visiting. You can also create custom controls that interact directly with the embedded view, for example you can put buttons on your website that navigate a prototype or jump to a specific page.
New Apple resources
With the new iPhone 16 (Pro) releases this week, there are new device bezels provided by Apple. This also includes bezels for the latest Apple Watches. The Sketch iOS, macOS, visionOS and tvOS UI Kits are now also update to support the iPhone 16 Pro screen size, includes some color changes, bug fixes and support to match the latest design system updates. There is also a new template for the Camera Control which is the new button that will be available on the new iPhones.
To learn how to use it, you can visit the new Camera Control page on the Human Interface Guidelines which goes into depth on how to design for it with best practices in mind.
Jitter Chart templates
Jitter added a bunch of new templates to animate data for your social media posts or presentations. It includes animated bar, line, pie and donut charts that you can easily start using in your projects.
A/B Test Design
A brand new platform by the creators of Mobbin where you can find a curated collection of A/B test results from best-in-class apps. For example you can see how Headspace improved their signups with +7% or how Duolingo improved user engagement with +40%.
Upcoming events
October will have a bunch of design and product focused events with talks from our peers and product announcements. All of the events will be available to attend virtually.
Framer Fall Event — October 2
Framer will host a special event on Youtube where they will share community highlights, give an overview of their latest features and unveil new product announcements.
Webflow Conf 2024 — October 15-16
Webflow's yearly conference returns next month with 2 days of talks, product deep dives and a first look at brand new features coming to Webflow.
Disco Conf 2024 — October 17
Maze is hosting it's annual research and discovery focused event, Disco Conf. They will go over the product vision of Maze and have a bunch of research focused talks throughout the day.