Too many buttons in interface

Mikhail Savchuk

May 15, 2020 20:48

Well, it seems that there are too many buttons in WF interface and they drew too much attention to it. Just count - left bar, breadcrumb, show completed checklist, search, settings, board/bullets, star, menu. It should be an option to hide all interface except breadcrumb.

I occasionally found that I am using IA writer rather than Workflowy. Because it allows me to focus on what I write. No interface at all when you don't need it.

Comments

18 comments

David G Goggin

May 15, 2020 21:47

Edited
You've got to be kidding me. What clutter? I don't see any. One reason I use Workflowy is because the interface is so clean.
0

Comment actions Permalink
Mikhail Savchuk

May 16, 2020 06:54
Well, this is mine. :) Seems you have use older version or tweaks.
2

Comment actions Permalink
Daniel Wadsworth

May 16, 2020 14:41
For me, when I fullscreen Safari, I get the SHOW COMPLETED switch.

Doesn't display in the desktop app. Mine looks like David's too.

The only thing I'd like them to lose is the grey line under the bread crumbs. Then we'd be cooking with gas. And add shortcuts for boards. Need that.
1

Comment actions Permalink
Anton

May 16, 2020 16:54
I totally agree with Mikhail.

All those buttons on the top right are anyway duplicated in the header (...) menu on the top left — so why keep them there at all? Really would be much more clear if they were all hidden.
3

Comment actions Permalink
Daniel Wadsworth

May 17, 2020 02:49
Yes, you're right. There is some redundancy.
2

Comment actions Permalink
Miguel Serra

May 17, 2020 14:18
It'd be nice to have a focus mode to hide all of the interface.
3

Comment actions Permalink
S R LINDSAY

May 24, 2020 13:32
Custom CSS can fix this:

.starButton, .pageMenu, .itemTypePickerMenu .addChildButton { display: none; }

Will get rid of the buttons

/* SHOW TOOLBAR ONLY ON HOVER */ .header { opacity: 0; } .header:hover { opacity: 1; -webkit-transition-duration: .5s; -moz-transition-duration: .5s; transition-delay: .3s !important; }

Will remove top bar - and show on mouse over.

But a focus mode built in would be ideal.
0

Comment actions Permalink
Anton

May 24, 2020 13:38
Hi all,

Thanks for the advice to use custom CSS. Can I ask you for a guidance on how to implement it?

Thanks in advance.
0

Comment actions Permalink
Mikhail Savchuk

May 24, 2020 16:20
Well, is it possible to apply this custom CSS in desktop app?

Thanks, Mikhail.
0

Comment actions Permalink
rawbytz

May 25, 2020 16:18

Edited
The easiest way to implement custom CSS is to use WorkFlowy in a browser with an extension like Stylus installed.

Here's my take. This reduces opacity by default (still visible), and transitions to normal on hover.
```
/* Dim header and page controls */
.header, .pageControls {
  opacity: 0.2;
  transition: opacity 0.8s;
}
/* Increase opacity on hover */
.pageControls:hover, .header:hover {
  opacity: 1;
}
```
1

Comment actions Permalink
Anton

May 25, 2020 18:31
Thank you rawbytz!

I have found your extension called DropFlowy and it worked well for me. Could you comment on how Stylus is different from DropFlowy and which should we use for this usecase?

Thanks.

Regards,
Anton
0

Comment actions Permalink
rawbytz

May 25, 2020 18:45

Edited
> Could you comment on how Stylus is different from DropFlowy

DropFlowy:
+ Very light weight, no persistent memory footprint
+ Use your favorite code editor
- Only works on WorkFlowy
- You must reload your WorkFlowy tab after editing your local CSS file

Stylus:
+ works on any website
+ Editing CSS is instantaneous, no reload required
- Persistent memory footprint

btw, I use Live editor for CSS for trying stuff out.
1

Comment actions Permalink
Frank (Workflowy Support)

May 25, 2020 19:07
@rawbytz,

I would give my left small toe if your above toolbar CSS would allow for "opacity:1" when you hit escape and your cursor is in the search box...
1

Comment actions Permalink
Anton

May 25, 2020 21:51
@rawbytz,

Thank you so much!

I also agree with Frank, the toolbar (re)appearance on hitting escape would be just great...
0

Comment actions Permalink
rawbytz

May 25, 2020 22:18

Edited
Believe me.

I tried to make that work, but gave up quickly... and I could never accept Frank's left small toe if offered.

EDIT! I got it to work! Hold onto your toes!
/* Show header when search box has focus */
.header:focus-within {
opacity: 1;
}
0

Comment actions Permalink
Mikhail Savchuk

May 25, 2020 22:09
Hope it will be out-of-box. :) Customization might be great, but it doesn't work in Desktop app. And, well, what we expect from Worfkowly? Simplicity and focused work.
0

Comment actions Permalink
rawbytz

May 25, 2020 22:16
@Mikhail

I think a built in "focus" view is a good idea. The challenge is: you ask 10 users how they want it, you will get 10 answers.
0

Comment actions Permalink
Mikhail Savchuk

May 26, 2020 19:03
Moreover, I suppose that there is no need in dedicated "focused" mode. :) Focus in Workflowy is implemented by zooming.
1

Comment actions Permalink

Please sign in to leave a comment.

Comments

Didn't find what you were looking for?