[Demand] Network-Specific Guides Revamp

[neruthes]

Metadata

Field	Value
Previous Stage	...
Figma Link	figma.com/...
Expected UX prototype due	2019-11-22
Actual UX prototype release	2019-11-21
Expected engineering due	2019-12-29

Catalogue

Current Stage

• Entry
• MBGuideBar Module
• Components:
  • Guides on Facebook
  • Guides on Twitter

Left For Future Stages

• Backup Alert

Entry

If the user specifies his username and clicks "Next" button, the user will be directed to a 5-step guide.

If the user clicks this "I do not know my username..." button, the user will be direct to a guide which is a little different in terms of steps.

MBGuideBar Module

Mainly designed for wide screens. For smaller screens, minor adjustments may be necessary.

Structure

• Header
• Content
  • Title
  • Body (usually 2 lines)
• Buttons Area
  • Right Button (Next Step / Finish)
  • Left Button (Prev Step)
• Close Button

Component: Guide for Profile Connecting on Facebook

Connect Profile

Title: Current task: Connect profile @%s on facebook.com

Step	Body Line 1	Body Line 2	Right Button	Left Button	Close Button
1	Step 1/5: Login	Login on facebook.com as @%s	Next Step	-	End Guide
2	Step 2/5: Navigate to your profile	Visit https://www.facebook.com/%s.	Next Step	Prev Step	End Guide
3	Step 3/5: Enter bio editing mode	Click button "Edit bio".	Next Step	Prev Step	End Guide
4	Step 4/5: Add public key to profile bio	Click here to copy public key. Paste it to your profile bio, and save profile.	Next Step	Prev Step	End Guide
5	Step 5/5: Verification	Please wait as Maskbook is trying to check whether the setup is successful...	Finish (%ns) (disabled) (%n is a countdown from 8)	Prev Step	End Guide
5a	Step 5/5: Verification	You have successfully connected @%s on facebook.com to persona "%s".	Finish	-	-
5b	Step 5/5: Verification	Not successful. Please go back and try again.	Finish (disabled)	Back	End Guide

Component: Guide for Profile Connecting on Twitter

Connect Profile

Title: Current task: Connect profile @%s on twitter.com

Step	Body Line 1	Body Line 2	Right Button	Left Button	Close Button
1	Step 1/5: Login	Login on twitter.com as @%s	Next Step	-	End Guide
2	Step 2/5: Navigate to your profile	Visit https://twitter.com/%s.	Next Step	Prev Step	End Guide
3	Step 3/5: Enter profile editing mode	Click button "Edit profile".	Next Step	Prev Step	End Guide
4	Step 4/5: Add public key to profile bio	Click here to copy public key. Paste it to your profile bio, and save profile.	Next Step	Prev Step	End Guide
5	Step 5/5: Verification	Please wait as Maskbook is trying to check whether the setup is successful...	Finish (%ns) (disabled) (%n is a countdown from 8)	Prev Step	End Guide
5a	Step 5/5: Verification	You have successfully connected @%s on twitter.com to persona "%s".	Finish	-	-
5b	Step 5/5: Verification	Not successful. Please go back and try again.	Finish (disabled)	Back	End Guide

Notes

• Decide whether to skip Step 1 according to login status.
• Decide whether to skip Step 2 according to page URL.
• During profile connecting, the Guide Bar should show only if the tab is opened by the Maskbook dialogue or the website has an active profile connection request.
• For profile connecting, all other navigations in the Guide Bar are manual. We do not automatically turn pages.
• When the Step 5 countdown reaches 0, jump to Step 5a or Step 5b, according to the verification result. Jump earlier if the result comes earlier; 8-second countdown is only a timeout mechanism.
• Clicking "Back" button in Step 5a or Step 5b, go back to Step 4.

[Tedko]

should we implement this in holoflows?

[neruthes]

should we implement this in holoflows?

Off-topic

[Jack-Works]

record a intro video and play it in Picture in Picture mode will be easier

https://w3c.github.io/picture-in-picture/#dom-htmlvideoelement-requestpictureinpicture

[neruthes]

@Jack-Works Possible, but matching steps and guiding eye attention might be more challenging. Also, a text-based step-by-step guide would be more inclusive for people who face difficulties with sight fidelity.

[Tedko]

Another problem just encounter by our user, who is experienced with PGP/keybase etc:

我忘记了，发了proof post 只有我自己可见。

[Jack-Works]

Another problem just encounter by our user, who is experienced with PGP/keybase etc:

我忘记了，发了proof post 只有我自己可见。

This is somehow expected. User can post proof post to thier friends not public

[Tedko]

“只有自己可见” not friends

…

On Mon, Nov 25, 2019 at 10:43 Jack Works ***@***.***> wrote: Another problem just encounter by our user, who is experienced with PGP/keybase etc: 我忘记了，发了proof post 只有我自己可见。 This is somehow expected. User can post proof post to thier friends not public — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#409?email_source=notifications&email_token=ABTAVTLK2JX3PQQGOUFQXSDQVM3TZA5CNFSM4JO55632YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEFA54RA#issuecomment-557964868>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ABTAVTKFW4TIQOO7BHLAG4TQVM3TZANCNFSM4JO5563Q> .

[Tedko]

abandoned