Regarding the new "New Note" button design

Having an option to toggle the UI would be nice. Maybe we could also consider updating the icons to a more modern look. I recall that being part of another discussion around making the icons more intuitive.

2 Likes

Vertical space is at a premium so I'd suggest keeping the three items (search, sort, new) on one line as far as possible. I only ever use 'New note' so 'New to-do' could easily be removed for me, or maybe a toggle option in settings. Then the button can be a much shorter and simpler "New" if a text label is required.

Perhaps a poll? See how many people use:

  • New note (only)
  • New to-do (only)
  • Both 'new' options

(wasn't sure whether to post this in github or here, so re-posting just in case)

Just want to provide two suggestions:

  1. Maybe the bottom tag bar is a delightful place and make sense to add those buttons:

OR

  1. Keep it in the note list panel header but stay within one row:

slice2

7 Likes

I only use new note. As long as it doesn't require extra clicks when creating a new note I don't mind ignoring the new to-do button.

Note: until recently I was using Evernote. Among other things, I was annoyed by them making me click twice to create a note (for selecting either note or todo).

2 Likes

I like this suggestion – option 2 in particular. The wording is concise. And the expanding search

I have to say I appreciate the bigger buttons. Not only does it make them more discoverable, it also makes them easier to navigate to with the mouse (when I don't feel like pressing Cmd-N).

1 Like

Option 2 looks nice!

I've been using Joplin for a few years on both my windows computer and android tablet. I live in it, probably using it 20 times a day. I do most of my writing in it. I have thousands of notes. I love it.

I'd love to recommend it to some of my clients, but so far haven't been able to because it is simply too geeky for them. It isn't simple enough. I promise I won't feel insulted if the interface is made simpler. I think adding simplicity and clarity, even if it is unneeded is a good thing.

Those symbols, all of them, are not intuitive, except for the search. Search is pretty obvious. The calendar on mine with an up arrow makes me think it'll open a calendar so I can set a todo task. I sort by date with newest on top and don't mess with it, but even now, I sometimes look at it and for a few seconds wonder, what's that for?

The New Note icon seems to me like an edit note icon that would open a popup edit window for the currently selected note.

I would appreciate anything that can be done to make it more intuitive and simpler appearing because I have lots of clients who would benefit from it, but won't use it as it stands.

While I'm at it, and thinking of what could be done so Joplin would work for my clients, is there a way to turn off Markdown entirely? I'd like to not have any markdown visible to confuse people at first. I used the css code someone offered here for removing wysiwyg toggles and buttons, but don't know how to remove the layout button and md toggle and end up with only wysiwyg. There could even be a beginner mode.

6 Likes

I think that the + and the word new are redundant. Either one or the other.

As much as I like icons, I do agree with what I think is now accepted UI best practice that text descriptions are always more clear than icons. On Google products I can't tell you how many times I stare at the screen trying to figure out how to create a new "thing" before I notice the multi coloured plus icon in the bottom corner.

That said, I use Joplin on a small screen and prefer if things stay as small as possible.

1 Like

I'm wondering, as a feature request, if someone could design a "Beginner CSS file". Like a theme for beginners. Super simple. No markdown. No dual screen. No layout. A choice in Options to use the beginner theme with limited options or the "Advanced" them with Markdown, more plugins, etc. That way those who want an uncluttered, no hand holding interface can have it, yet there is something less intimidating and more intuitive for beginners.

3 Likes

Probably better to create a new post for that since it really isn't about the new note button design specifically. There is a whole Features category.

I agree here. One thing to consider is that Joplin assumes that its users understand markdown or are willing to take a risk with WYSIWYG editor that may not be perfect. So there is a certain expectation of competence in the user. It seems that there is little sense in chasing for the least competent set of users who are probably just using iPhone notes or Google Keep anyway.

3 Likes

Well just because certain aspects of the app aren't user friendly doesn't mean we should settle for this. I think an app can be suitable for both regular and advanced users if it's done well. But again we take your feedback into account and trying to improve all this

2 Likes

Agreed, I am all for improvement but I think it makes sense to consider the trade off especially if there is a big real estate impact

1 Like

Agree, disliked it from first sight.
My radical solution in userchrome.css:

.ieXZSX .sc-dkrFOg {
     font-size: 0;    
    max-height: 0px;  
    max-width: 0;     
}
.kgepTw .sc-dkrFOg {
    font-size: 0 !important;  
    max-height: 0px;          
    max-width: 0;             
}
.krIjOP {
     height: 15px !important;     
    min-height: 15px !important; 
    max-height: 15px !important; 
    width: 20px  !important;     
    min-width: 20px  !important; 
    padding: 0px !important; 

Just a comment, but using those cryptic CSS classes is usually not the best idea. They may work in the current version of Joplin, but they are generated randomly, so they can change any time, and there is zero guarantee that they will even exist in the next version.

2 Likes

As an option, it may be worth moving the button to a new line if the container with the buttons is overflowing (As a result, there will be 3 levels when overflowing and 2 if everything fits)

I like Option 2 as well.

umm. I'm personally well over 70 and had no problem at all figuring out which button created a todo and which created a note.

I really like the fact that a minimum of space is taken by the search/sort/new/new buttons which gives more space to the list of items. I'll have to let one item drop off the bottom if you enforce this new format because I have a 6 rectangle screen layout which I don't want to change. At a minimum, can we have the option of keeping it the way it is.

Nothing is harder on us old folks than changing up the UI every day or two. I threw my phone at the wall this morning because they completed changed the layout of my music app. I don't think I can throw my computer that far, so please do not give me the urge.

I'm still loving joplin after a few days although I am having some strange things happening which are OT and I'll put them in a more appropriate discussion. I managed to import my 1000 or so toodledo items using a batch script creating folders of md files from the exported csv file and only had to add the tags manually. I discovered what YAML headers are after I did my migration or I think I probably could have included tags. (fwiw, the toodledo script to joplin needed too many prerequisites and setups for a non-python person like me.)

Cheers!

2 Likes

I like it, too.
I am happy with the existing but this solution seems to solve both problems. Clarifies the meaning of the buttons and also does not steal real estate from the list of items.
:+1:

I like the second proposal as well, that's basically what I came here to suggest.
I use both Notebook and Note lists in one column on the left, this change hit me hard and shifted the notes down by one, eating precious screen real estate and making that part of the screen extremely cluttered (2 lines of controls right under the synchronize button).

That said I still think the Sort notes button is useless, the option is in the menu.
I would propose to al teast try and give useless things like the Sort Notes and All Notes buttons and Tag list a clear HTML ID since the classes are randomly named and it's difficult to target them via user CSS without breaking on every update.

2 Likes