Overflow 0.8.0 — Dark Mode and much more

Natalie Masrujeh
Overflow Storybook
Published in
5 min readOct 10, 2018

--

Overflow 0.8.0 is here! Internally we referred to it as just “Dark Mode” because that was all we planned to launch during this cycle. Well…, we got a bit carried away and did a bit more than that. Read on to find out what we’ve been up to.

Dark Mode

The release of macOS Mojave, was obviously what inspired us to create a dark mode for Overflow. However, we soon realized that this feature would be welcomed by all our users, irrespective of what mode they’d chose to set their macOS at. So although Overflow will change from dark to light mode depending on how you set up your OS mode, you can also bypass this and freeze Overflow to use either the dark or light mode irrespective if your macOS setting. Check this out under Window > UI Mode.

Redesigned Editor

We put a lot of work in redesigning the top toolbar. We made space for the Align and Distribute tools so they are now one click away, just like you asked! The same goes for “Share” which is now found next to the “Present” button at the top right-hand corner of the toolbar.

The insert menu is now comfortably and prominently resting on the left side of the toolbar. All these changes mean that those floating icons are now moved and your canvas is free from clutter and ready to host your beautiful designs.

Presentation

We’ve been listening to your feedback and worked incredibly hard to improve your overall experience while presenting. So, the new presentation layout allows you to quickly switch between Presentation and Prototype mode and also comes with a new options menu that unveils important functionality that was previously hidden behind keyboard shortcuts. Of course, the fastest way to access these options such as toggling connectors on/off is still to use one the corresponding keyboard shortcuts!

Options Menu in Presentation mode

In Prototype mode, you will find 5 new zoom modes for previewing your designs. We believe we’ve made it impossible for you not to find one that suits your needs. Oh, and you can easily access those modes, you guessed right, with keyboard shortcuts from 1️⃣ to 5️⃣.

Zoom Modes

Actual: Displayed at 100% zoom and any design larger than the viewport will scroll by default.

Fill: Scale up or down to fill the width of the viewport and if needed scroll vertically.

Fit: Scale up or down to fit the screen within the viewport.

Width: Scale down to fill the width of the viewport and if needed scroll vertically.

Device: Scale down to fit the device skin within the viewport and scroll the content within the device skin bounds.

💡 Device type can be set in the Editor. When syncing your designs we try our best to auto-detect the type of your device using the dimensions of known device sizes.

Zoom Modes in Prototype mode

The options menu in Prototype mode comes with brand new functionality:

  1. Option to go to the start point
  2. Toggle interaction areas hinting on/off
  3. Toggle navigation arrows on/off
  4. Switcher between light and dark background, to give enough contrast to your designs
  5. Toggle to show/hide the whole UI
Options menu in Prototype mode

Web and Mobile Player

We noticed that first time recipients of Overflow Share links were not experiencing the presentation to its full potential on desktop and mobile. And that’s why we decided to make some features more prominent to aid discoverability.

These include the Boards menu, and a handful of options such as show/hide device skins, show/hide connectors, turn flight animation on/off, etc.
The Presentation and Prototype views are now 2 convenient tabs you can easily switch between.

Previewing a Share link on a mobile device

Especially when testing the prototype, you now have the option to view in Actual size (no device skin) and also hide the Player UI making this a seamless experience.

Overflow plugin for Sketch

We have rewritten some slow parts of the Overflow plugin for Sketch making it much faster (~40%) and compatible with Sketch 52. The plugin will automatically update once you upgrade to Overflow 0.8.0. Keep in mind that, in order for the changes to take effect, you will need to re-launch Sketch.

Enhancements and Bug Fixes

  • The Welcome Window has been replaced with a more stylish Launcher.
  • Windows and modals, within Overflow, open up faster and should be a lot more responsive.
  • Saving an Overflow document is now faster
  • Improved reliability during uploads to Overflow Cloud
  • Fixed an issue where export to PDF/PNG sometimes added an extra padding

Deprecated Feature

We have decided to remove Themes. To be honest we weren’t happy with the way it was implemented and it was adding a lot of complexity to the app. We do plan on adding new ways of managing your styles though and making them accessible app-wide. <spoiler>Style Library</spoiler> 😉

Until next time! Feel free to join our Slack Community and share your feedback, thoughts or say hi! If you encounter any issues, send an email to support@overflow.io.

On behalf of the Overflow team ❤️

Natalie

Not using Overflow? Download Overflow beta for MacOS, for free!

--

--