New Simple Joplin's UI and UX by giteshsharma

[giteshsharma]

First of all thanks everyone for appreciation and praising

I tried to include all the things that I previously missed and thanks everyone again for pointing out these things.

UPDATE 1

Few Small Features Ideas and Updates

Hide Sidebars

@nr458h

There was already a discussion, that some people (including me) prefere to have the option to hide the sidebars completely

@randke

Nice design, very clean and simple. Any chance of it having just the Note editor maximized with everything hidden so that you can stay focused on writing… like iA Writer?

This feature will perfectly work as sidebars are hidden but icon bars have less opacity,
whenever user move cursor on the right side of the screen icons will be more visible.

Properties

Instead of using two different button, we can show properties by single button

Search

@Request: Revamped Search Placement and Implementation on UI Features

The core idea behind this feature request is to make searching through notebooks and notes more intuitive and natural flowing with the current ui.

@bedwardly-down I tried to improve the search bar and searching, I think you were suggesting the same thing, Isn't it?

@nr458h

I would prefer to have the search bar in a easy reachable place

@mic704b

The search bar also shows the number of results, are you proposing to show it in the search bar itself? It isn’t shown.

I tried to improve this in new mockup, check them out

Updates for previous layouts

1. Adding back/forward button

@mic704b

Where will the backward/forward note navigation buttons go?

2. Adding Tags

@mic704b

where are the note tags displayed?

3. Managed Icons

@laurent

These designs look good, but the long list of icons is not great in terms of usability, especially since it mixes buttons meant for the editor (Bold, Italic, etc.), with buttons meant for the note as a whole (Info, External edit, etc.), with buttons meant for the whole app (Search, Layout, etc.)
So it would be interesting to see designs that take this into account, and position the buttons to makes it more obvious what they are for.

Damn correct, I think these new layout will solve this problem and I also added classic Joplin design in mockup.

@memophen

Combining the different types in one bar could still be considered if they have different background colors, like the search field in C and D , or are separated by a horizontal ( A and B ) or vertical ( C and D ) line.

I had the same thoughts and tried both things (lines and different bg), but finally moves some buttons at bottom as you can see in the layouts and horizontal lines for buttons which have same functionalities.

Although I tried lots of other things and put them in google drive and you can view them by visiting the link at bottom of this post. And If you have other suggestions then please add as your suggestions are good

@memophen

One question about the note title. Is “Brief” in the viewer the note title, and “Points to remember” the first header? When scrolling, will “Brief” scroll away or stay on top of the screen?

Brief is title and it will stay top of the screen

4. Plus sign in header to add new notebook/ new notes

@nr458h

Maybe you could handle the creation of a notebook or a note similar to the tags and put the plus behind the “All Notebooks” or the “Meetings”

@abogawat

Moving the ‘Add notebook’ and ‘add note/todo’ links in the respective sidebars

@mic704b

I’m not sure I would want to have the new note, todo, notebook actions always visible and taking up so much space in my note list. I would prefer to see two more notes listed than have these options there.

@codyburleson

“Tags”. I’m just thinking of the classic usability law: “things the behave the same should look the same.”

Done

---

Classic Joplin Layout

---

I tried few more changes in classic joplin layout

---

Different Layout

I create another layout but does goes forward with it, what are your thoughts about this one.
In this layout I put tags below title.

---

EDITOR+VIEWER

I think markdowns are not that great in this mockup and will them for sure

---

Other Layouts

I tried lots of other things in icon-bar like diff bg color, border etc and these things are not included in this post. I choose the best one for the post but still If you can check them out and give feedback it will be really helpful. I uploaded them on google drive
Link
https://drive.google.com/open?id=1SN87Y5Lo6rmwYMdTI7PSzy_SFUWCuj8b

TODO Feature

This feature is not included right now in the above layouts because we wants global todo list and local todo list both. And I am note sure how to implement this.

I am thinking of creating a todo box in notes-list just like I created for tags in notebooks-list. And dividing global and local todos there

If you have any Idea please share.

@nr458h

• I do like the idea of moving the formatting bar above the title
• Probably the position of the formatting bar could be an option

Yeah It will be great if we add such an option for user

@themightychris

It seems like having the formatting buttons on the right side would conflict with a layout that had editing in the left pane and preview in the right pane, as the buttons would be attached to the uneditable preview rather than the editor. Maybe flipping the editor and preview would be palatable?

You are right, we will add an option to switch editor/viewer's position to left and right and this will solve this problem.