Shiori icon indicating copy to clipboard operation
Shiori copied to clipboard

[UI] [SUGGESTION] UI & UX Improvement concept and idea

Open CroissantDuNord opened this issue 1 year ago • 0 comments

Currently, the UI of Shiori, is fine it's not the best looking, but It's usable for 99% users, but The UX is not very good some part of the UI are hard to use or understand or intuitive, or lose space with bad layout I tried to fix this UX those issues, This is a lot of work I can fully understand why you can't change some of the things showed here, That's why I explained the fix I made, so you chose the one you would like to add

I followed these rules

  • Don't fully change the layout / organization, so current users are not lost
  • Don't implement hard to code / design features
  • No crazy animations / effect, even if I like to put fancy animation idea / video background, I don't want low-end device to struggle to run the app

In these concept I used Material You, the new Google material design (Used Android 12+ but supported with older version), this is because I use it well, and I have pre-made element for this design system, but you can keep your current UI, This is just for the concept


The Character Tab

The issues

image

Concept

image

The Weapons tab

The issue

This tab has similar issue from the Character tab, refer to that

Concept

(I centered the text on the card to the left, so it's easier to read) image

The Home Tab

The issues

image

Concept

(I could not find a fix for the settings visibility issue, you could add a button / option to view with the first time setup ?) image

The Character Info

The issues

image

Concept (WIP)

This concept is not finished, I will edit this issue to post a final version image

This is the things I have made so far, If you have any question ask me, I might edit this issue to add more concept, if you want me to review a design in priority ask me to, Good luck to your project

CroissantDuNord avatar Sep 10 '23 12:09 CroissantDuNord