VRCX icon indicating copy to clipboard operation
VRCX copied to clipboard

[UI] Enhancement

Open Map1en opened this issue 1 year ago • 2 comments

This is a tracking issue for UI improvements. I've been working on some UI enhancements recently, I think it's a good idea to create an issue to track these changes.

This includes basic alignment issues, layout organization, and some UX adjustments afterwards.

  • Alignment issues
  • Layout organization
  • UX adjustments

Currently, modifications are made according to the default theme. Later, additional changes will be made to other themes based on the existing style.

If possible, I would appreciate some suggestions so I can have a clear direction for improvement, Thanks.

Related PRs:

  • #1034
  • #1047
  • #1054
  • #1062
  • #1078
  • #1103
  • #1122

Map1en avatar Dec 16 '24 09:12 Map1en

Kamiyas Material 3 theme supports https://www.npmjs.com/package/@material/material-color-utilities but I never got around to adding it. They also made another theme that was never added https://github.com/kamiya10/VRCX-theme/tree/main/bg Maintenance cost of large amounts of themes can add up. Our UI library element-ui everything is based off of is deprecated. Upgrading would require switching to Vue3 or another JS framework, essentially requiring a full rewrite making it not a viable option. These fixes and improvements are most welcome.

Natsumi-sama avatar Dec 16 '24 10:12 Natsumi-sama

First of all, the current program's functionality is excellent. However, there are many aspects of the UI that could be improved.

Under the default theme, there are already several issues as described in the posts above. My plan is to start with alignment and arrangement: ensuring that most elements are properly aligned and displayed in a more intuitive way.

Next step would be unifying UI components: currently, many similar interactions are not using the same type of component, which likely needs to be corrected. Lastly, for better UX - this is a long-term consideration and won't be addressed immediately.

Currently, non-default themes have numerous display issues, far more than those in the default theme. These aren't just basic alignment problems - they appear unattractive and are even difficult to use. Furthermore, when modifying the default theme code and changing the existing DOM structure, adapting other themes requires a considerable amount of work. Based on this, I suggest giving lower priority to adapting other themes. To avoid excessive workload, we might even consider temporarily deprecating some themes or pausing their updates.

Map1en avatar Dec 17 '24 05:12 Map1en