UI Improvement

[stefaniamak]

Current UI

Notes on the design

1. Some buttons are used only when others are active, e.g. the save should pop-up when the user is on edit mode
2. The cancel button is a bit unclear: does it mean cancel of editing? cancel of the emblement (closes the book)?
3. Edit could be incorporated more into the design I think, e.g. something like an actual quill sitting at the side and when clicked it enables you to edit the text
4. The Add and Delete can be changed to symbols like "+" or ":wastebasket:", and their placement is a bit odd: not in the middle, nor to the side, nor somewhere specific in between
5. The title is a bit small in my opinion. I think the fact that the page has quite some text, the user should have an easier time reading the title, so by having a wider title can give an easy summary for it
6. I don't think we should have the buttons (or any other design e.g. like the quill I suggested) invisible like the second screenshot Niruandaleth had send (though I believe the screenshot was sent to have a blank reference)
7. The next and previous page buttons look nice. they are simple and self-explanatory

Examples

Life is Strange

Reference

Comments

I think this might be a nice example, as it contains a lot of text as well. There are images play the role I described at 5 above, meaning that they play as a summary of the text, thus the user will read it only if they really want to see further details.

Reference from the article Quest log and quest path | Quests

Reference

Comments

I don't think it is necessary to have the buttons on top of the book, but it's an idea as well.