[Author Prev][Author Next][Thread Prev][Thread Next][Author Index][Thread Index]
Re: [tor-bugs] #28329 [Applications/Tor Browser]: Design TBA+Orbot configuration UI/UX
#28329: Design TBA+Orbot configuration UI/UX
-------------------------------------------------+-------------------------
Reporter: sysrqb | Owner: tbb-
| team
Type: enhancement | Status: new
Priority: Very High | Milestone:
Component: Applications/Tor Browser | Version:
Severity: Normal | Resolution:
Keywords: tbb-mobile, ux-team, TBA-a3, | Actual Points:
TorBrowserTeam201812 |
Parent ID: | Points:
Reviewer: | Sponsor:
| Sponsor8
-------------------------------------------------+-------------------------
Comment (by antonela):
Hi folks,
I have been working on the Connecting flow and also on Network Settings.
As we signed, this version will follow this user flow
https://trac.torproject.org/projects/tor/raw-
attachment/ticket/28329/userflow-1.1.png
Essentially, we will still have a Connect button.
[[Image(https://trac.torproject.org/projects/tor/raw-
attachment/ticket/28329/mockups-3.png, 700px)]]
`1.0`
It is the first screen when TBA start. The Connect button will start the
bootstrapping. Users need to trigger it manually. The settings icon at the
top right will go to Network Settings.
`2.0`
Once the user taps to connect, the icon will get animated and we will show
the bootstrapping messages. We want advanced users to be able to see/copy
tor logs. We will expose it by swiping to the left. If Tor fails, we will
move users to the Settings Network screen.
For the unsuccessful scenario, we can take different paths:
a - Have a retry button
b - Suggest users to move to the Network Setting screen to config a
Bridge
c - Move the user to the Network Setting screen with a message about
what failed and some encouragement on how to fix it.
Do we have data about why bootstrapping fail in mobiles? Which are the
most common failing cases?
`3.0`
If users arrive here after a failed connection, the copy at the top will
change to encourage users to take action to fix it. I made the first
approach on this screen. My idea is to divide this section into two:
Bridges and Advanced Settings. With this split, users are lead to tap the
first option instead of start exploring options that they don't know what
are.
---------
**Network Settings**
Since we want to have a balanced experience compared with desktop, I
include the same options we have on the desktop. We'll not have moat for
this version, so I skipped it.
The user flow is the same for each option. Users can switch on/off each
setting, and then we move them to a second screen where the configuration
is made.
When the user returns to the main network setting screen, they can see in
the description an status of the changes they made. If users want to
change it, they can tap the entire row.
The copy is up to review. Material Design has excellent suggestions about
how to approach this copy https://material.io/design/platform-guidance
/android-settings.html
[[Image(https://trac.torproject.org/projects/tor/raw-
attachment/ticket/28329/network-settings.png, 700px)]]
--
Ticket URL: <https://trac.torproject.org/projects/tor/ticket/28329#comment:16>
Tor Bug Tracker & Wiki <https://trac.torproject.org/>
The Tor Project: anonymity online
_______________________________________________
tor-bugs mailing list
tor-bugs@xxxxxxxxxxxxxxxxxxxx
https://lists.torproject.org/cgi-bin/mailman/listinfo/tor-bugs