Mobile design. - Githubissues

OTTAA-Project / ottaa_project_flutter

Join us to create the first predictive augmentative communication platform for speech-impaired children!

https://ottaa-project.github.io/

GNU General Public License v3.0

10 stars 4 forks source link

Mobile design. #38

Closed hectoritr closed 1 year ago

hectoritr commented 2 years ago

Describe the solution you'd like Here are described minor bugs & UI improvements for the mobile version of the OTTAA Project flutter version.

Tested on emulator

Nexus 10 API 27
Pixel 3a API 27

Action Plan

Onboarding

[x] Top button is showing incorrect text, probably due to automated translation.
[x] Top button does not match the orange on the other buttons.

Tutorial

[x] Not showing step3.long string.

Home

Screen Shot 2022-08-08 at 15 40 04

Screen Shot 2022-08-08 at 15 40 10

Screenshot_1659984167

[x] Not enough margin on the Games button.
[x] Bottom buttons are not centered on the orange bar.
[x] When choosing the first pictogram, something weird happens to the UI. When choosing a 2 picto it fixes itself.

Games Screenshot_1659984319

[ ] Reduce cardview bottom margin (Similar to Grupos or Picto in single view)
[ ] Reduce cardview top margin (make aspect ratio similar to the picto aspect ratio)
[ ] Word level on cardview is not translated

Game Grupo chooser Screenshot_1659984050

[ ] Weird radius on the orange bar, make same as Grupo or Picto single view.

hectoritr commented 2 years ago

Action plan for Pixel 3a

Splash screen

[ ] Not showing any splash screen, just a white screen. (Log throwing this "A splash screen was provided to Flutter, but this is deprecated. See flutter.dev/go/android-splash-migration for migration steps.")

Login screen Screenshot_1659984853

[ ] Give more height to Login buttons.

Onboarding Screenshot_1659984853

[x] Right overflow
[x] Not showing Birthday chooser. Everything should be visible without scrolling
[x] Avatar button Not Showing

Main Screenshot_1661282366 Screenshot_1661282384

[x] Increase the margin on Bottom buttons to be centered on the orange bar.
[x] Unify the Toasts and communication with the user

Groups

Screen Shot 2022-08-23 at 16 22 11

Screenshot_1661282684

[x] Weird black box is happening on the orange bar.
[x] The row of Groups is misaligned on the screen, the top part is covered by the action bar.

Pictogram

Screen Shot 2022-08-23 at 16 27 12

[x] The pictograms have a big margin, the image is small.Lets try to maxime the image shown, keeping the aspect of the pictogram

About OTTAA Screenshot_1661282972

[x] There is information not being fetched and shown

Games Screenshot_1661282995

Screenshot_1661283008 Screenshot_1661283056

Games are not showing properly

[ ] Fix What's the picto game
[ ] Fix Match Picto game
[ ] Fix Memory game

hectoritr commented 2 years ago

@asimjawad Hey, take a look at this and try to unblock the UI so I can continue reviewing and updating this in the meanwhile.

asimjawad commented 2 years ago

@hectoritr ok, working on it, will create a separate branch for it

asimjawad commented 2 years ago

@hectoritr check the mobile design branch,

hectoritr commented 2 years ago

@hectoritr check the mobile design branch,

On it!

hectoritr commented 2 years ago

@asimjawad I've updated the issue with the latest from Mobile Branch