Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[suggestion] Add AnkiWeb logo to 'AnkiWeb account' screen #16300

Closed
snowtimeglass opened this issue Apr 30, 2024 · 16 comments · Fixed by #17204
Closed

[suggestion] Add AnkiWeb logo to 'AnkiWeb account' screen #16300

snowtimeglass opened this issue Apr 30, 2024 · 16 comments · Fixed by #17204
Labels
Accepted Maintainers welcome a PR implementing this feature Enhancement Good First Issue! UI
Milestone

Comments

@snowtimeglass
Copy link
Contributor

snowtimeglass commented Apr 30, 2024

As a desirable approach on the client (AnkiDroid) side, I suppose that it would be better to use AnkiWeb logo for the "AnkiWeb account" screen rather than AnkiDroid logo (only), to be less misleading.
image

In case that an app has a screen for connecting to Twitter/X, it is natural to use Twitter/X logo in the screen, rather than the logo of the app itself (only).

I would think the same is true for the screen for connecting to AnkiWeb.

Originally posted in #16260 (comment)

@snowtimeglass
Copy link
Contributor Author

snowtimeglass commented Apr 30, 2024

it would be better to use AnkiWeb logo for the "AnkiWeb account" screen rather than AnkiDroid logo (only), to be less misleading.

That is, for example,

  • Simply replacing AnkiDroid logo with AnkiWeb logo

  • Displaying the two logos to visualize the independence of the app (AnkiDroid) and the external service (AnkiWeb) from each other.

    [Reference]

    [image]

(Anyway, the current logo on the screen may be a bit too big.)

Originally posted in #16260 (comment)

@oyeraghib
Copy link
Contributor

I agree with @snowtimeglass , having a good UI on that screen would be helpful understanding the flow of what exactly is happening

@david-allison david-allison added Enhancement Accepted Maintainers welcome a PR implementing this feature UI Good First Issue! labels May 1, 2024
@david-allison
Copy link
Member

I've labeled this as Good First Issue!

The first step would be to propose a vector icon which:

  • Fits the requirements above
    • #ankidroid-design on Discord if you need more real-time feedback
    • Bring the results of these discussions back to the issue
  • Can be modified to work in Night Mode
  • Will work Landscape + Portrait
  • Works on both the 'MyAccount' and LoginActivity screens
    • Log In + Logged In: we don't handle sign up
    • Do not make the image larger vertically. We can probably handle smaller
  • Have a brief think about tablets

You'll likely want to work with a placeholder for the AnkiWeb logo, then once the design seems reasonable, confirm with @dae that we're OK to use the logo in the design, and an appropriate license for it.

@tamojitdas
Copy link

Hi, can I work on this issue. New to open source contribution, hence would like to pitch in.

@david-allison
Copy link
Member

That's great! Thanks

@tamojitdas
Copy link

Currently coming up with the logo design and placement along with caption, will get it verified tommorow on discord by @david-allison and @dae

@david-allison
Copy link
Member

Great! No need to ping unless there's something for me to do

@devharsh2k4
Copy link

any updates on this i wanna try

@tamojitdas
Copy link

sure @devharsh2k4 will let u know

@tamojitdas
Copy link

HI @dae @david-allison @snowtimeglass require necessary feeds and confirmation for the following updated layout
The Changes are done ..can raise a PR post confirmation
Login Page + loggedIn Page:
logInPage
loggedInPage

@tamojitdas
Copy link

Also, just in case, if you require to see landscape:
loggInPageLandscape

@snowtimeglass
Copy link
Contributor Author

Thank you for the work and the draft.

Some concerns and expectation:

  • I'm not sure that using "Authorize" here is appropriate. "Connect to AnkiWeb" might be better.
    image

    • Accordingly, the checkmark icon may also need to be reconsidered.
      image
  • The design of "connecting" seems to have room for improvement (in the future). The current black dots don't look very good to me.
    image


    image
    image
    image

    • Using AnkiWeb image only is also alternative.
  • The outline rectangle (shade) of the image looks unnecessary to me.
    image

  • Spacing between images and the label and the input box looks narrow.
    image

  • The AnkiDroid image needs to be revised to more "official" one.
    imageimage

  • "AnkiWeb" text in the logged-in screen appears to be compressed vertically. It may be not desirable.


    image

@tamojitdas
Copy link

alright will work on this

@tamojitdas
Copy link

@snowtimeglass @david-allison @dae pls take a lookimageimage

@david-allison
Copy link
Member

david-allison commented May 20, 2024

@tamojitdas you should come to the design channel on our Discord to get more instant feedback (#ankidroid-design)

And no need to ping dae, all that's needed is a final sign-off that he's ok with the AnkiWeb logo use, and an appropriate licence for us to use

@snowtimeglass
Copy link
Contributor Author

Thank you, it generally looks better to me.

I too think posting it on Discord may be a good idea.
You may want to take and use high-resolution screenshots for that.
image

I feel it might be even better if the vertical margins around the image area were a little wider.

image

image

"Connect To": "Connect to" (sentence case style) would be desirable as it is consistent with the notation of the other labels in this app.
image

Thanks again.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment