Screen Version History

Learn how to keep your screens organized using versions

Tuba avatar
Written by Tuba
Updated over a week ago

Every version of frames/artboards you publish to Zeplin will be stored separately with commit messages, organized by colors and timestamps.

With the versions button on the bottom left, you can see the version summary at a glance and access all versions of a screen by clicking on it. The topmost version on the list is the latest version, and this version is always visible in your project dashboard. You can quickly check out an earlier version by simply clicking on it or by using the arrow keys.

💁‍♀️ You can spot changes between screen versions with Version Diff. Check out our article to learn more.

Commit messages

In one sentence, commit messages answer the following question: “What has changed in the version?”.

Developers have been working with commit messages for years. When they push a change to a codebase, they’re required to provide one. We decided to follow a very similar pattern in Zeplin as well.

Commit messages are different from casual comments or descriptions. You’re not required to follow these patterns at all, but here are a few tips and tricks to get the most out of them:

  • Stick to one style: Use the “imperative mood” for simplicity. e.g. change, not changing, remove, not removed.

  • Be precise: Provide specific information so your colleagues can easily figure out what to look out for.

  • Keep it simple: Make it easily understandable for your teammates without additional context. (Less is more, friends.)

Here are a few examples:

💁‍♀️ If you need to explain something in detail, you can prefer using Annotations or Comments.

Colors

Similar to comments, you can organize your versions using colors as well. The way to use them is totally up to you and your team’s creativity, but here are a few examples to guide you:

  • Assign colors based on the importance of the changes. e.g. Red for Major, Yellow for Minor, Blue for Asset Change, and so on.

  • Assign colors based on states. e.g. Red for Experiment, Orange for In Review, Green for Approved, and so on.

Version links

Every screen version has a unique link to share with your teammates. You can hover over a specific version and click on the “...” button to copy the Web Link or App URI.

Related articles:

Did this answer your question?