Sync Design Changes
Sync design changes help you to avoid switching back to Figma designs repeatedly and creating a new app in DhiWise again to bring all your new design changes. It helps to save a lot of time in a single click and helps you get your modified design right here all the way from the Figma file. No need to switch to the design file for it, we have it covered all; right here.
Following are some scenarios to be kept in mind while Figma sync.
- Before doing a Figma sync or Figma page sync, if you’ve applied any
Stylesfrom DhiWise; then all those styles will be applied even after the sync.
- If you’ve created
Mixinand applied it to the components before Figma sync or Figma page sync on DhiWise, then it will be applied even after the sync.
- If you’ve created a
Componentbefore Figma sync/Figma page sync with DhiWise, then your changes will still prevail even after sync. To overwrite them, detach your component and resync your Figma.
Sync design changes don't work with templates.
How to sync design changes from a Figma file?
Figma Sync can be done in two ways.
- Sync the entire Figma
- Sync a page from Figma
Sync the entire Figma
1: Go to Page Settings
Go to pages, on the top-right click
Page Settings ⚙️, and select
Sync design changes 🔄 .
2: Select screens
Refresh to go ahead with syncing design changes. Select the screens that you want in your application and click
Fetch Screen to fetch them.
This will fetch all the selected screens and sync your design with the latest one.
While selecting the screens, if you deselect a screen that’s existing in the previous set of screens on DhiWise; then it will be removed from the list of available screens on syncing.
Sync a Page
1: Go to Sync design changes
Sync design changes on the top. As you click on it, you will see two options as mentioned below:
Only current screen: Sync design changes for a single screen.
All the screens: Sync design changes for all the application screens.
Only current screen to sync changes for the current screen.
To sync the entire Figma, Click
All the Page and follow the same steps as mentioned above.
2: Refresh Figma design
Click on the
Refresh button for syncing the latest design changes. This will fetch the current screen from your Figma and sync your current design with the latest one.
Got a question? Ask here.