We’ve been working for the last month on a redesign of the web and desktop apps of WorkFlowy. Our driving goals have been to get rid of unnecessary distractions, and take the overall feeling of WorkFlowy out of the 90’s. I’ve been using the new design daily for the past few weeks, and I’m delighted by it. It’s clean, fresh, functional. Maybe even a little bit beautiful.
We’ve tested the new design internally and with a small group of users, but we want to open the redesign up to feedback from the broader WorkFlowy community. If you’d like to try the new design, head over to the experimental features page (workflowy.com/features/toggle) and turn it on.
To try it on the desktop app, please turn on the feature at workflowy.com/features/toggle and then download the WorkFlowy Desktop Beta at beta.workflowy.com/downloads.
Try it, and send your reactions to feedback@workflowy.com
This redesign was the primarily the work of Stefano Attardi and Michael Leggett. Stefano is the engineer/designer who joined WorkFlowy recently, and Michael is an amazing designer who has been helping out part time, but whom I haven’t mentioned publicly yet. Michael is a longtime WorkFlowy user with a lot of domain expertise in the productivity space. He led design on Gmail, co-invented Google Inbox and did a ton of other impressive things at Google, and we’re very lucky to have his input.
We hope you love the redesign as much as we do. We’re excited to to keep releasing product improvements and new features, and this redesign will serve as a strong base to build upon.
The Beta app doesn’t start on iMac with Sierra 10.12.6. There is just an endless logo shaking animation. I have the options toggled in the web settings. Any ideas how to get past that?
I have this problem, too, on MacBook Pro app. Shaking logo has huge amount of vertical whitespace and obscures part of my list
Had same problem. Fixed this by downloading previous beta from https://github.com/workflowy/desktop-beta/releases/tag/v1.0.20-beta.346
I love workflowy and I like the new design. However I’m another one who finds the font too small, I’ve had to zoom the browser. (I had my eyes checked recently!)
Something I would love to see is a different way of seeing that a bullet has notes so the first line of the note doesn’t have to be displayed. I find it really jarring and distracting when I have a list where some bullet points have notes and others don’t due to the different spacing, so ultimately I rarely use notes.
+1
Same here. 110% browser zoom is perfect for me. Maybe there’s should be some sort of dynamic scaling based on screen res?
I’m also wondering if we’ll ever see any actual feature updates … I had a look at Dynalist and some of the features there are awesome. Especially the internal linking and anchor text links; I have so many big fat ugly distracting links in my Workflowy it kills the experience somewhat (unless I use hacks, most of which aren’t fantastic). How Dynalist handles links is fantastic. But I’ll be sticking with Workflowy as it’s a snappier, smoother experience which is my priority
Just to add… I love the new cleaner design overall, definitely a step in the right direction. Now if you could add some features without hurting performance 😉 Keep it up!
I see a strikethrough.
Haven’t seen anyone mention this, so maybe it’s just me or there’s a checkmark missing somewhere for me, but my completed items used to have a strikethrough. Now they just turn light with no strikethrough, and the light font looks just like my tagged items. Any way to get the strikethrough back?
This was an IE bug that is now fixed.
I really appreciate the effort to make the design clean but there are a few major flaws. Sorry but when the world is moving towards better readability, this has gone the opposite direction of pretty over usable.
Try zooming the default to 125%, that’s the minimum acceptable font size in current age.
I haven’t decided if I like the new layout’s fonts and controls any better. The old ones were fine.
I miss the box margins that helped to see the edges. Too much white all around.
I really miss the little phrase: “Make lists, not war.” I have always liked that over the years.
I miss the links at the bottom to the blog and system status.
I miss the little phrase, too.
A small thing re the SEARCH field: To search I press Esc > type in the search field > in the old version press arrow down and navigate across bullets below; in the new version the arrow down key does not do anything (it does not exit the Search field). Can you please fix it?
There is a lot of unnecessary whitespace at the bottom; it’s even more noticeable than before because the footer is gone.
Also, a keyboard shortcut for the search function would be nice.
Nevermind, it’s esc! I clearly don’t know Workflowy well enough.
The redesign is subtle, but welcome ! Nicely done. I’m a bit concerned about performance though, see below 🙁
A few improvement points :
– Performance is really bad for me ; especially zooming in or opening a big bullet point with lots of content inside. I just measured 8 seconds between the time I click on the bulletpoint, and the time the content appears. When using the current macos Workflowy app, with the old design, it is almost instantaneous. The new version is barely usable for me…
– The “keyboard shortcuts” panel clashes rather severely with the new esthetics 🙂
– Switching between starred pages using the keyboard (command+shift+ “;” on macos) does not make use of the new top-left panel. It still triggers a different mechanism, based on the bottom panel ; this seems quite inconsistent.
About this switching mechanism, I think it could be greatly improved by letting users type the first letters of the starred page he / she needs to reach. Similar to the “Go to” palette of Sublime Text or the way spotlight works. You new top-left panel is already browsable using keyboard arrows. You only need to add a shortcut to trigger the panel, and a “search area” activated by default that would allow to filter the list of starred pages, then press enter to select the most relevant one.
Keep up the good work 🙂
I appreciate that you guys are finally showing some forward movement. The redesign looks great and fits in with your overall elegant aesthetic. Great job.
My one caution is this – please don’t focus solely on the “paint and polish” at the expense of features that folks have been asking about for years (dates/reminders, sorting, font colors etc…).
The design looks really nice and clean!
There’s still a bug with the “Show Completed” button btw: it doesn’t get updated when toggling visibility via the keyboard shortcut. It ends up meaning that toggling via the keyboard inverts the meaning of the button. Like having 2 light switches for the same light bulb 🙂
Also, my eye is always drawn to the blue Show Completed button, simply because it’s the only use of color that I can see on the page. A greyscale option would be awesome, to help keep focus on the content.
I agree, the blue toggle is pretty but as it is literally the ONLY touch of color in the whole page, it gets a little bit distracting !
You are correct — the button doesn’t update / toggle with the keyboard shortcut.
I like the touch of colour though.
Just to clarify: the button update issue relates to the web version only.
yikes …. the new design took a good 10 minutes to load, and once it did load the page was stuck. I couldn’t scroll down.
I’m trying to un-save the changes now ….
other feedback: The new print is unpleasantly small for my eyes
(sorry – !)
Great job! For me, the redesign made Workflowy more enjoyable to use.
My take: I don’t see much of an improvement, and what improvement there might be is overshadowed by new annoyances.
The new font and header style is kinda nice, I guess. But the noticeable increase in whitespace and apparent performance decrease is not: At its core, I use Workflowy for bulleted lists, and a list that requires scrolling down the page to read or that takes an extra second to expand is inferior to one that is fast, compact, and TRULY free of distractions, full stop.
the design is cool, but the only thing i don’t like it that Home is kind of far where cursor is and you have to spend microsends everytime to move it up to that
I’m using Chrome, and the star and three dots to expand/collapse are hidden on top of (or underneath) the right hand end of the text in the first bullet point. it needs to be higher or further right or something.
Also, the search box feels really small – I liked the old wider one.
I like the star drop down in the top left.
Another observation…the old site had an indicator at the top that showed if your changes have saved or not. The new one doesn’t. Other than trying to exit and having it warn me that my changes haven’t yet been saved, is there any way to tell? It’s something I miss.
I agree, I sometimes glance up to make sure it was saved.
+1 for showing the saved/saving status on top level. Currently, it’s inside the settings context menu which is not convenient to watch.
I agree – it’s really useful to see whether local changes are saved.
It’s really common for me to make a tiny change then put my laptop to sleep, and I need to know when it’s safe to do so.
One more vote for bringing this back, and for the same reasons as the other people already gave. I know minimalism is important, but I think knowing whether the data has been saved/synced OK is a high enough priority to merit bringing it back (e.g., in case the laptop’s battery dies, or in case I want to access it on another device).
Previously it was just a single word (“Saved/Saving…”), so it’s not much real estate. But if the word takes up too much space, you could also just use a floppy-disk save icon (versus a rotating circle ‘syncing’ icon?) instead.
+1. Hope this Save status gets visible on the WF new design. This is actually the only reason why I still use the old interface.
I’m quite the fan of the the breadcrumb menu. Love everything about the new redesign. Only thing missing from the app is same as last version: need to be able to copy urls of our own WF from within the app. Keep up the great work!
A couple of quick things I’ve noticed using the beta today; when expanding some lists, sometimes the animation “bounces” at the bottom; the text that’s moved down, moves too far and then back to where it should. Not sure if that’s intentional or not.
I love that when the window is at a comfortable width, the search box collapses. That makes it super easy to tell if it’s selected or not. However, I can’t figure out a way to keep the search bar populated with my search and jump back to the lists, using only the keyboard. I can click in the lists, and use the keyboard to navigate what I’m searching, but have to click first. Maybe double tap ESC to clear the search bar?
Still loving it so far!
Oh, and super duper picky; I personally prefer the previous tag explosion animation; less 3D the better. I will be ok if the current animation stays. 😉
In the next release you’ll be able to hit tab to exit search without cancelling the search
Overall I like it. Cleaner, fewer distractions. My biggest issue is one a few people have mentioned already: the breadcrumb trail is too far away in the top left. Any way to anchor it closer above the actual list, like it used to be? The less mouse movement needed to get where I need to go, the better.
Other than that, good work!
New design looks good. However I have two comments. First issue, and the biggest one, it needs dark mode. I will not use it unless it has dark mode. I spend all day in the app taking notes, and the dark mode is a must for my eyes. Second issue is that with the breadcrumb trail now towards the top, there is less horizontal room for it when you have a long breadcrumb trail since it needs to share room with other elements.
Besides those two issues, it looks great! Nice work!
Noooo… great font but the kerning between bulleted items is too large. I’m scrolling way more than I was before.
Nice idea, but somehow it’s harder to read the lists on my screen even after switching to the old Sans Serif font. I think the text size might be too small. Also, I liked the old “page” concept that put gray borders around it. A bit sad to see that go.
Totally agree. Too hard to read. Too small. Sticking with the old design for now.
It’s still there. You can use the stylys extension and add a border to the .page class.
On new design unforunately I can’t use the TAB key for switching to results:
with ESC key I can jump to the search box, then I insert my search strings, and then I want to switch with the TAB key to the results. And this doesn’t work with new design. The old one works.
Just fixed this, will be released Thursday
Wow, you fixed very quick. Works fine. Thanks.
Now I can continue with testing new design.
By the way: The Show Completed button works inversely — while active it hides the completed items.
You have been fast to fix the bug 😉
Love the redesign — keep up the excellent work!
Excellent work, yet it is still the WorkFlowy as we know it.
Best regards
Will the Chrome and Android apps be getting the same facelift? Love the new look, but I mostly use the Chrome and Android apps.
We released a new Android app in April: https://blog.workflowy.com/2018/04/11/workflowys-new-mobile-app-for-android-is-live/
…and what about the Chrome app?
Unfortunately, the new desktop beta doesn’t work on my Linux Mint 18.3. It just shows #documentView with an animated loader and a scrollbar at about 2/3 of the window’s height. Other than that, a bar showing that 186 out of 250 monthly items are used. I have a Pro account, so WF Beta either points to another account than my regular desktop app, or cannot get the complete account info.
But the screenshot looks sweet, so looking forward ^_^
Is this still not working for you? If so, write to us at help@workflowy.com and we can help out.
Love it. And prefer the new font, much cleaner.
I just opened the new interface, this is the very simple interface I want, you are a great team!
nice and elegant – I just use windows desktop app. had a scare that I’d lost lots of recent entries and couldn’t see the difference but then found a reload menu and all was good
I love the redesign. Modern and light.
just the white space between entries seems a little too wide. If you could shrink it a pixel or two – no more.
thanks
Forget my comment. I have been using it for a couple of hours now and i like the spacing. Much easier to read.
thanks
Overall, the redesign has little impact and, for me, it actually makes the experience worse, as I have to move the mouse all the way to the top left when I want to navigate in breadcrumbs. Maybe limit the buttons on the top bar to the same margins as the content?
What exactly is new in the redesign?
If find the new version is great. The only thing so far, is I’m not fussy about the animation when hovering over a bullet. I’m usually in a eager to do a function and want that dropdown to show up as fast as possible! It also makes the app feel sluggish. An option to control the animation would be great.
On the contrary. IMHO, if you want to zoom in the short delay in displaying the menu is a welcome addition. Having an option is a good suggestion though.
We need “full width button”. Nowadays I use Stylish extention to do this, but its not a “native solution”. Note: new design is a good, modern and clean “universal design” which is equally suitable both for desktop & for mobile. But in many situations (+ in situatuions when we have WWWWWWIIIIIIIIIIIIDDDDDDDEEEEE monitors), when we use desktop (web or client) version we need to have full width page, because we have a lot of data in some situatuins.
+ you will agree, this is an extremely stupid situation when on a wide screen Workflowy column occupies 25% of the place, and the remaining 75% of the screen is an empty white sheet on the left and on the right.
Thereby we need “full width” button. (near “show completed” button)
A lot of my bullets don’t wrap so the effect would be having WF simply left justified. And the nodes that do wrap I think would be difficult to read across a wide screen. More useful I think would be able to more easily show two (or more) nodes side by side.
That would be a nice addition indeed.
I agree.
I am also very limited by this centering and weird content display proportion : a css style of “max-width: 700px” on the .page class, on a 1980px wide monitor seems absolutely nonsense. Also, it makes my long bullets (and yes I have a LOT of them) unreadable because split accross too many lines. An ability to at least go back to left-aligned and/or full-width display would be, to me, mandatory to keep using workflowy.
I get that this design makes sense on a tablet, it just doesn’t make sense in my workflow on modern desktop monitors. It looks a lot like a mobile-first design in fact 🙂 even bootstrap gives a much larger max-width media query on a desktop monitor ^^
+1 for full width. I just restarted today, and it’s pretty frustrating + feels claustrophic. I had absolutely no gripes with how Workflowy worked already..
+1 for full width option as well. Or at least an option to go back to the old version.
Seems like the “View Completed” keyboard shortcut is broken (macOS, Safari). On the non-beta version, Ctrl + O works instead of Cmd + O (since Cmd + O is tied to “Open” in Safari/every app ever).
However, Ctrl + O on the beta version doesn’t do anything…Just a head’s up!
Does this affect the mobile app? If so, do we simply upgrade on the App Store (iPhone)?
Does not change the mobile app (other than the change of default font). We recently updated the design on Mobile and this latest update brings a new design to Desktop and Web.
It’s definitely more elegant, lighter weight and modern-looking. I like the weight of the typeface. I think the white space between entries is a little too wide. Feels like the lines are floating apart. Granted, I’m just switching from the previous design which is noticeably denser with a heavier font. I suspect it’s difficult to balance density and aesthetics. My two cents: a little less white space between rows would improve it. Maybe just a pixel or two, But overall, it’s more attractive and a nice uplift.
Love the new design. One thing i’d love to see in the Mac Desktop app is in-line spellcheck (red underline); this works in the web browser version of Workflowy, but not the Mac app.
Yes, would love to have spellcheck in the app.
It’s great you’re updating, but… Workflowy was not ugly!
Ha, thanks 🙂
Agree that Workflowy was formerly easy on the eyes. Will add that new font too small (yes, I already switched to the default font, but even that font appears smaller) & print seems to blend into the background — not enough contrast. The background is too white (not eye=friendly) & also page trim needs a tiny bit more of blue color trim. Entire webpage is too pale and bland as is.
can I get a dark background back?
Star dropdown on left is much better, and a key command for that would be great. Dropdown could usefully be centralised in the window imo – it can be a lot of information to trawl through, so central helps.
I’m partial to the “Light” font by now, although the new one is nicely clean and usable. Good choice.
The settings window needs a serious update – probably submenus would help, common with other apps’ prefs panes. Suffers by comparison.
Those bullets though… that’s a central core UI element, and I can’t see a change : /. Smaller and less conspicuous bullets are almost certainly on your backlog. Am I right?
Reminders, consolidated display of selected tagged items, and I’m almost ready to ditch OmniFocus.
Ah, star dropdown not yet active on the desktop app – link works fine now.
I’ve noticed some data issues – some data is not displaying in the beta, and formatting differs between orginal and beta.
Awesome that the desktop version now centralises similar to the browser version. Sweet : )
Looks nice. I am excited at the new pace of development.
I also had trouble with the beta download.
The link for the desktop beta download didn’t work for me. It returned “We’re sorry. Something went wrong. We’ve been notified and are trying to fix it.”
We are actively fixing this, apologies!
Now fixed. beta.workflowy.com/downloads
Oooh it’s so much cleaner! Good work! Looks like the link for the desktop app is broken though: https://beta.workflowy.com/downloads/mac/
Oh, thanks for letting us know!
Now fixed! beta.workflowy.com/downloads
Indeed – link needs fixing
not any more, thanks
I liked the old font better… 2c
Awesome work guys! You’ve made the app even more beautiful. Hands down the best organisational tool! Workflowy manages my life!
It’s definitely looks more contemporary. However the one thing that seems to be missing is the automatic collapse when hitting the workflowy name next to the search bar. Now it looks like the only way to do this is through a two stroke process where you expand and contract under the … Otherwise it’s great!
I like it, although I don’t love the new font, and I feel like that was changed on the default design, not just the opt-in one, no? Maybe it’s just me but it seems slightly smaller, slightly skinnier, and slightly harder to read than previously.
Settings > Font > Sans-serif is all it took to get me back to happy 🙂
It looks nice. I have a few questions:
1. Is the new WorkFlowy design using a different font? If so, what font?
2. Is the new design compatible with script customizations?
font-family: -apple-system, BlinkMacSystemFont, “Segoe UI”, Roboto, Helvetica, Arial, sans-serif, “Apple Color Emoji”, “Segoe UI Emoji”, “Segoe UI Symbol”;
That’s different, yeah. And it’s too small for my liking. The small, thin, white text doesn’t work well on the wood background I use, and it looks like the other backgrounds aren’t much better. I intentionally shrink the font because I want to fit a lot of notes on the screen, and since the header font shrinks with it, it’s way too small now. If workflowy had a font size setting for the main notes font then it wouldn’t be a problem because then it would shrink separately.
We added a new font “System” but you can change back to the old font by choosing “default” in your settings.
Ah…was sans-serif the previous default? I just switched to that and that’s how I remember it looking previously.
Yes ‘Sans-serif’ was the old default font if that’s what you want.
Can we have a custom “font-family” field? I.e. I want to use [glorious] Fira Code font without external styling hacks.
It will be. We’re actively fixing issues with scripts as they come in.
Great great greaaaaat! i just ADORE it! Thanks! I wlll miss the old design but this new stuff just ROCKS!!!! It’s evident the team you are building up at Workflowy it’s doing things RIGHT! Thanks!!! Thanks for keeping the development upgrades! We, on our part, will keep using Workflowy! Millions of blessings to you all (The Workflowy team and all of the Workflowy users all over the world!)
Carlos