search

inaturalist / iNaturalistAndroid

Android app for iNaturalist.org
https://market.android.com/details?id=org.inaturalist.android
MIT License
164 stars 57 forks source link

Settings Screen #238

Closed joellebel closed 8 years ago

joellebel commented 8 years ago

This is a lower priority item, but I thought I'd whip it up... Voila, the Settings screen.

image

Notes:

I've added the Help button to the main menu and am thinking it could link to the Getting Started page which is way more insightful than the current tutorial

@kueda and @loarie do we still need to keep a link to the tutorial in the app? It's pretty out of date.

image

kueda commented 8 years ago

Looks good. I detest the tutorial, but it does have the advantage of being localized into Spanish. If our Mexican colleagues are ok with trashing it, I'd say we can lose it, but @loarie would have more insight there.

joellebel commented 8 years ago

@kueda and @loarie is that explanation of the network settings is accurate?

@loarie any conclusion on the tutorial?

kueda commented 8 years ago

You might change the Network Settings explanation to something like "Affiliation within the iNaturalist Network of websites." The way you have it now I think you'd need to change that text for every site in every locale.

loarie commented 8 years ago

re: network explanation, how about "Your network affiliation localizes parts of the app and changes the institutional partner that can can view and download your data [learn more]" where learn more is a link to http://www.inaturalist.org/pages/network ?

Also can we clarify Naturalista to Naturalista Mexico

loarie commented 8 years ago

Ken-ichi's is fine with me (jinx) maybe "Affiliation within the iNaturalist Network of websites. [learn more]" with the link if we're into the whole linking thing

loarie commented 8 years ago

re: tutorial - is it still loading on app launch? - because we should probably stop that (thereby making it like the iOS app which has a tutorial linked to the settings screen but not a tutorial that launches on app launch)

But re: having a trigger that launches an in app tutorial towards or launches the web gettings started material in a browser, I don't have strong feelings.

@alexshepard do we have analytics on how many people click on the iOS tutorial from the settings screen?

alexshepard commented 8 years ago

Approximately 1% of daily users navigate to the tutorial on iOS.

joellebel commented 8 years ago

Thanks for the feedback, guys. I ended up reworking things because Android settings typically don't have two links in one line item. Folks may not realize they can tap on the rest of the cell to change the network as opposed to learn more. So I came up with this solution which is a little more work, but I think worth it.

The right screen is what the user sees when tapping the "iNaturalist Network" cell. Tapping "More Info" takes you to the web page explanation of networks. Tapping on one of the networks activates the corresponding confirmation modal. After tapping "OK" in the modal, the modal closes and the selected network is reflected with its radio button in the on state. Tapping back in the upper left takes the user back to the Settings screen. Tapping the Android back button takes you back to the Settings screen with all changes (if any) reflected, as well.

Since this can be really confusing and unlike anything I've ever seen in any other app, I like a longer explanation so I took parts from the webpage.

image

Note

The More Info button on the iNaturalist Network screen links here: http://www.inaturalist.org/pages/network

Network Confirmation Modals

Just realized I need to fix the logos on these modals so they're visible. I'm also not liking the word "Use..." and the "?" after the logo. Will post updated designs.

image

image

@budowski I'll let you know when the Sketch file has been uploaded to dropbox.

joellebel commented 8 years ago

Network Modal Design

Here's the wording and design for the modal.

image

@budowski Here's the text for every modal so you can easily copy and paste it... Note that Naturalista (Colombia) is not camel case.

iNaturalist

iNaturalist is a member of the iNaturalist Network in Mexico. Would you like to use this network to localize your experience and share data accordingly?

Naturalista

Naturalista is a member of the iNaturalist Network in Colombia. Would you like to use this network to localize your experience and share data accordingly?

NaturaLista

NaturaLista is a member of the iNaturalist Network in Mexico. Would you like to use this network to localize your experience and share data accordingly?

iNaturalist Canada

iNaturalist Canada is a member of the iNaturalist Network in Canada. Would you like to use this network to localize your experience and share data accordingly?

NatureWatch NZ

NatureWatch NZ is a member of the iNaturalist Network in New Zealand. Would you like to use this network to localize your experience and share data accordingly?

joellebel commented 8 years ago

Files

Logo Files

@budowski I had to recreate the inat, colombia and new zealand logos because they either had too much padding or were white. I tried to make them as close to the size they are now. I noticed we don't have these logos in the various resolutions so I just created one version of them. Let me know if you need different sizes though. I've put them here on dropbox, in the "Network Logos V02" folder: https://www.dropbox.com/sh/nv37tskx4r91g6p/AAAeKsOM1M1yx6sLD0C5IyE6a?dl=0

Screenshots for TCel

I've made screenshots of the screens in various resolutions so you can superimpose them over the simulator using TCel to see how well things are matching the design. ...Or if you don't prefer the simulator, you can use a tool called Vysor which projects your phone's screen onto your monitor and then you can lay the TCel window with the screenshot in it over the Vysor window. Here's more about Vysor https://www.vysor.io/ It's totally free. I really like this tool.

The screenshots are in this folder, "Screenshots for TCel"

Sketch File

The sketch file is also in the Settings folder and called, "Settings_v01_r01_ForDev.sketch" Sketch has upgraded to version 39 so let us know if you haven any problems opening it or need an upgraded version of the app.

Please let me know if you have any questions.

budowski commented 8 years ago

@joellebel - what do you think about the current implementation (build 157 - beta)?

joellebel commented 8 years ago

@budowski This is looking good and working well. Here's my notes...

@kueda Let me know if you got my contact support email. Thought I'd test it, just in case.

joellebel commented 8 years ago

Forgot to mention...

Current

image

Desired

image

budowski commented 8 years ago

OK, fixed these issues - build 159 (beta)

budowski commented 8 years ago

@joellebel - looks good?

joellebel commented 8 years ago

Yes. I've been experiencing different font sizes on various androids and was trying to get to the bottom of it, but we can certainly launch with this. Thanks for following up!

joellebel commented 8 years ago

Adios Settings screen!