1. Upload your own assets quickly

With Fluid UI, you can use uploaded images in two ways - by adding them into your uploads library if you need to use them often (for multiple projects) or directly onto a page (if you plan to use them only once).

You can upload to your library by:

  1. Clicking "Select image(s)" in your uploads tab
  2. Dragging images from your desktop into your library
  3. Using the "Upload" button in the quickbar

quickbar upload

You can add one off images to a page by focusing on that page and:

  1. Pasting an image you have copied directly from outside the editor (for example, out of Google image search or a screenshot) with Control/Command + V.
  2. Dragging an image from your desktop onto the active page.

Uploads in Fluid UI

2. Work effectively in fullscreen

Fluid UI is a browser based tool - which means search bars, plugins, bookmarks and toolbars can get in the way if you are working on a smaller screen. Never mind that - Fluid UI is even more beautiful when working full screen. Working in full screen gets rid of all the unnecessary browser chrome and gives you the maximum amount of space for your prototype.

Fluid UI switch to fullscreen

3. Six invaluable navigation shortcuts
  • To pan around the canvas when zoomed in:
    SPACE + CLICK/DRAG with your mouse or touchpad or two-finger swipe on your touchpad.
  • To zoom out again to see all your pages:
    Use ESCAPE.
  • To focus in on a specific part of a page when zoomed out:
    Clicking the top, bottom, left or right side of a page will make sure that part of your page is accessible after it zooms in to become the active page.
  • Switch modes quickly:
    Switch quickly from EDIT, COMMENT and PREVIEW modes with E, C and P respectively.
  • Close or resize the library to maximise your available design space:
    "L" will open and close the library, which can also be resized by dragging it on the right hand side.
  • Changing fine detail:
    Control/Command + and - will change your zoom level when zoomed in on a page. Perfect for getting those pixels exactly in line.
4. Add a color picker

One of the features that is yet to be implemented in Fluid UI is the colour picker - which can be annoying if you are trying to match exact colours. That said, there is an easy fix - just install the ColorZilla plugin for Chrome or for Firefox

5. Use design standards

Design isn't just about what tool you use - it's dependent on the platform and users you are designing for. Apple, Google and Microsoft have released detailed design guidelines for iOS, Material Design and Windows respectively.

6. Remove shared access by archiving

Have you shared around a project for comments or feedback? Do you want to stop getting feedback on that version? Just make a copy of your existing project and archive the old one. Archived projects aren't accessible in preview, so your clients will be directed to provide feedback on your newer version once you provide the updated preview link.

Remove sharing permissions for a user

7. Export your screens in a single PDF

You can save your screens as one single PDF by selecting the "Save as PDF" option in the print settings menu:


And don't forget!

1. Get support

Fluid UI comes with 16 hour live chat support built in. Don't be afraid to ask us any questions you have.

2. Join the community

You can meet other Fluid UI users in a number of places - in our Linked In group, on Facebook, on Twitter. We're also setting up fluidui.slack.com - where all our team will hang out - contact us for an early invite!

3. Partner with us

We want to connect designers, developers, product visionaries and entrepreneurs all around the world together to unlock the world's creativity. If you feel you can contribute - let us know in the chat or join us on our groups!