Balsamiq

Toggle navigation

Keeping Projects Clean and Organized



Projects can become packed with many elements, and sometimes it's good to take a moment to do some house keeping. Cleaning up your project will make it easier to navigate, smaller in size, and thus much faster!

Let's look at few different ways to optimize a project.


Organize Wireframes and Use a Hierarchy

The Navigator Panel lists all the wireframes that belong to your project in a chronological order.

You can reorder them as you wish (by dragging them up and down) and it also offers a hierarchical structure to better organize your wireframes, allowing you to create a parent/child relationship between them.

To use it, select the wireframe you wish to be the child and press the TAB key. The child wireframe will be placed in a tree hierarchy below the wireframe above it.

You can then use the arrows to the left of the parent wireframe to show and hide the wireframes under it.

gif

To restore it to the top level, press SHIFT+TAB.


Select the Unused Images/Assets

Using Assets can be really useful when creating your wireframes but since we spend most of the time in the Wireframes view, Assets can easily become cluttered with unnecessary elements.

With that in mind, we created an option that allows you to select all images that are not used in your wireframes. The option is available in the Edit menu, as shown below:

Selecting it will open the Assets view where all the unused images will be selected for you. You can then move all the items to the trash from the context menu.


Optimize Existing Images (For Older Projects)

When you import an image file to a project, our tool automatically optimizes it to ensure good performance by:

  • resizing it to a maximum size of 2 MegaPixels
  • downscaling retina/HiDpi images to 1x size
  • converting PNG images to JPEG when possible

However, these optimizations are not applied to existing images in a project.

Since we released this feature in February 2020, a simple trick to optimize all the images of an older project is to import the project into a new, empty project. The option is available from the Project menu (or File menu on our Desktop product).

This way, all the images will be processed and optimized.


Clean Up the Symbols

Symbols are another great feature that let you create reusable common elements that you can use across different wireframes. Let's look at the best way to keep them "clean".

When an individual Symbol is selected, the lower portion of the right panel shows which wireframes (if any) the Symbol is used in. This is a good indication for deleting Symbols that aren’t being used.

You can use the context menu to delete Symbols and Symbol Libraries from your project.

Tip: You can hold down SHIFT or CTRL/CMD to select multiple Symbols and delete multiple Symbols at once.


Empty the Trash

Moving items to the Trash does not remove them from the project. Using the "Empty Trash" option is the only way to delete those items permanently.


Extra Step: Split Your Project Into Smaller Ones

On a side note, we usually recommend keeping a project under 100 wireframes to avoid performance issues. Sometimes, splitting a project into smaller ones is a nice and easy way to help with slowness issues too.


We hope that these tips will be useful to improve your project's organization and help with any performance issues you may hit.

However, don't hesitate to reach out and share any related BMPR file with us via support@balsamiq.com if needed. We're here to help! :)