🏎 We’ve also continued implementing several improvements to performance and latency:
We've released a VS Code extension in beta to help developers quickly integrate Ditto into development to replace hardcoded strings. The extension searches your repository to find strings matching your existing Ditto components and allows users to instantly replace them in the code.
For more information, check out our documentation. We also dive into the VS Code extension and dogfooding at Ditto on our blog!
Thank you to Crowdin for updating their integration with Ditto to now utilize the connections page! This means that you don't need to purchase our developer integrations add-on in order to connect with Crowdin to localize your workspace's text.
For instructions, go here. The below video covers integration and functionality:
We've added a new format, now available via our in-app exports or via the API/CLI: ICU JSON. This format is compatible with ICU (International Components for Unicode) Message Format.
To view an example or read how the format handles specifics (pluralization, variable interpolation, quote escaping, etc.), head here.
Own Up, a mortgage fintech company with over 10,000 customers, uses Ditto to manage text across writers, designers, and developers — saving them 6500+ hours per year.
We do a deep dive into Own Up in our latest case study.
You can now create content templates in Ditto! These allow you to provide pre-defined starter text that teammates can reuse to write content faster, while maintaining consistency.
To get started, head to your Component Library to create a template component. To learn more, check out our full help guide.
🏎 Over the last few months, we’ve been committed to improving performance in Ditto — especially for large projects and slower connections. This includes:
Ditto will now generate automated setup suggestions for frames in your projects! If your team has set up blocks, attached to components, or hidden text on a frame that Ditto detects is similar to the frame that you're working from, it'll surface the option to apply those blocks, hiding, and components.
If you click on the suggestions, it'll take you to preview mode, where you can select or deselect aspects of the setup to apply. You can always ignore the suggestions. For more information, check out this help guide.
We've introduced two new variable types to Ditto to help variables handle more structured dynamic content: lists and maps!
A list variable, also referred to by developers as arrays or enums, is helpful for storing a collection of elements. A map variable is helpful for storing key-value pairs.
These new variable types will also be included in our developer-exports, and we've also added support for them in our React SDK. To learn more about the new variable types, check out our latest blog post.
As a product that helps other teams build their products, it’s always been a top priority to ensure that your data is stored safely and securely. Today, we’re proud to make this commitment to security official and announce that Ditto has successfully achieved SOC 2 certification!
As Ditto continues expanding support for mission-critical workflows for companies of all sizes, we remain dedicated to maintaining the highest standards of security and compliance, so you can focus on what matters most: building your product.
When working in the web app, you can now toggle to Design View for any frame! There, you'll be able to see the Figma image preview front and center and use it to select text and navigate your project. We hope this new view makes it a lot easier to get context when working out of the web app.
To get started, head to one of your projects in the web app. For more details, read our full guide here.
We've added support for a nested JSON format for fetching your component library. This is available in our exports or via the API.
We've published v3 of the CLI, which focuses around a number breaking changes intended to better align default CLI behavior with Ditto best practices. You can read the release notes here!
You can now manage tags used across your workplace directly in your account settings. This includes being able to view the count of each tag used, as well as the ability to rename or delete tags.
In Ditto, you can now configure how developer IDs get generated in projects in addition to in the component library.
This includes the ability to:
You can also now regenerate IDs according to these new rules for individual projects, or the entire workspace. For more information, check out our new developer ID help guide. To configure your developer IDs, head to the developer integrations page of your Account Settings.
We’re excited to introduce Ditto’s Slack integration, which allows teams to connect projects and your component library directly to channels in your Slack workspace to receive notifications regarding Ditto activity.
Once connected, it’ll notify the channel of activity, including:
To learn more, check out our Slack integration help guide.
When creating or attaching components, you'll now be able to quickly select a specific component category. We hope this makes it easier to find the components you're looking for, and keep component names consistent!
In the edit panel, we now add an indicator if the text you're editing is in a nested Figma main component or Figma component instance. Previously, we only indicated if top-level Figma frames were main components/instances.
"Copy setup from another group" now surfaces component suggestions! Use it to easily bring Ditto components from one frame to another. Learn more
