[RFW0094] Update UI/UX design for Monlam AI tools

[tenkus47]

RFW0094: Update UI/UX design for Monlam AI tools

Named Concepts

Translation Switcher : A button on UI that switches language of the app Monlam AI tool: Wep app for using Monlam AI models UX: User Experience UI: User Interface

Summary

the current UI of Monlam AI has problems regarding uniformity of DOM Elements and also some UX changes required.

changes required are:

1. Uniform UX for all the model. every model should provide a similar User Experience so the UI need to be as simple and similar across all Models
2. Language changes on single click
3. The options during registration have to be localized . that means when user chooses English . the option should be shown in English too
4. Position of dark mode and Translation Switcher need to be next to each other (can be changed if UX is compromised)
5. Position for language labels in MT should get closer to the switch button ( switch refer for the button for changing direction of translation)
6. Predefine text sizes and spacing.
7. Specification of files format and size should me visible to users
8. Spacing between buttons should be same / Remove Text Area resizing from UI.
9. Font not Matching in different platform (need to test on different platform)
10. Current logo need replacement Reason: current logo is not so appealing and doesn't support dark mode
11. input File should be mentioned with correct size unit. eg. Kb or Mb etc

    Input

    output of RFW100 - issue #347 Requirements specified above

Expected Output

the next update monlam ai should fix the above mentioned issues and match with the Mockup on figma

Expected Timeline

You need to mention the expected time line you want.

References

Monlam AI

[ta4tsering]

for the expected output if there is a mock up of it then it would be real nice, so that means the RFW that has Mockup creation in it should come before making the changes so that means that RFW should be mentioned in the summary or something. maybe the excpected output of the mockup RFW should be a link to the figma of the final accepted mockup

[gangagyatso4364]

when uploading a document there need to specification label for file size with the filename, right now it just looks like number.

[kaldan007]

6. Predefine font sizes, spacing, font family and translation should not be hard coded. Please refer standard approach like making enum and localisation files. this one need to be separate rfw

[ngawangtrinley]

Test the mobile version and look for visual inconsistencies:

[ngawangtrinley]