Add a capture app beginner guide

[sync-by-unito]

Task created from https://dt42-numbers.slack.com/archives/C3CHPJTS4/p1644395175326559?thread_ts=1644394360.587629&cid=C3CHPJTS4

I think the ideal place for Capture App beginner guide should be the README.md and Capture dev-doc. So I'll update those files

Add interactive beginners guide (example in attachements showcaseview.gif)

┆Issue is synchronized with this Asana task by Unito
┆Created By: Ray Hung

[sync-by-unito]

➤ Ray Hung commented:

I think I should put https://www.youtube.com/watch?v=Iblktuo9hLg ( https://www.youtube.com/watch?v=Iblktuo9hLg ) somewhere in the README.md

[sync-by-unito]

➤ Tammy Yang commented:

[email protected] please help take a look of this task

[sync-by-unito]

➤ Sam commented:

also asked ionic team for their opinion here ( https://ionic.zendesk.com/hc/en-us/requests/41699 )

[sync-by-unito]

➤ Sam commented:

Tammy Yang let me know if this concept is acceptable?

[sync-by-unito]

➤ Tammy Yang commented:

Looks good to me! I will add this task to the next sprint. I think we want to

1. Navigate users to take a photo
2. [Trigger: After taking a photo], navigate users to click gallery button
3. Navigate users to click the photo taken
4. Navigate users to click on more actions
5. [Trigger: Second time back to gallery] Navigate users to click history and inbox

Kenny Hung please help review if this makes sense and let Sam know your suggestions

[sync-by-unito]

➤ Kenny Hung commented:

Sam I think it could adjust like as below (cc Tammy Yang)

1. Navigate users to click capture button
2. Navigate users take a photo & record a video and press "X" to main page
3. Navigate users to click the photo taken
4. Navigate users to click on network actions
5. [Trigger: Second time back to gallery] Navigate users to click history(Activity)
6. Navigate users to click Capture transactions & network actions tab in Activity
7. [Trigger: Third time back to gallery] Navigate users to click Inbox, then the same as demo video.

[sync-by-unito]

➤ Sam commented:

Kenny Hung just want to mention about alternative way of educating users. cc Tammy Yang

For example telegram (chat app) uses short videos to educate its users (video attached)

Benefits of short video tutorial might be

1. Easy to follow. Instead of following 10 steps that might take few minutes or sometimes confuse user while interacting how about watching 10 second video? good example is how telegram can explain complex scenarios in 10-15 seconds.
2. Less code. More code = more bugs. Especially tracking if user has seen the guide and resume user guide from where he left off. With video we can just keep track if user seen video tutorial Bump @capacitor/cli from 2.2.1 to 2.3.0 #1 Bump protractor from 5.4.4 to 7.0.0 #2 Bump @types/node from 12.12.50 to 14.0.23 #3 etc

Maybe we could create separate page with no code platform and embed it to capture lite app so user could get notification and swiping notification opens video guide in the capture app. Maybe we can also give little reward for watching video.

Buts it’s just some thoughts I got this morning and wanted to share. Just idea for future

[sync-by-unito]

➤ Sam commented:

Kenny Hung I finished what you asked (cc: Tammy Yang)

1. Navigate users to click capture button
2. Navigate users take a photo & record a video and press "X" to main page
3. Navigate users to click the photo taken
4. Navigate users to click on network actions
5. [Trigger: Second time back to gallery] Navigate users to click history(Activity)
6. Navigate users to click Capture transactions & network actions tab in Activity
7. [Trigger: Third time back to gallery] Navigate users to click Inbox, then the same as demo video.

Here is the demo ( https://youtu.be/0bT9rSygk5g ). Feedbacks are welcome.

If it's acceptable I just need to prepare translations.

[sync-by-unito]

➤ Sam commented:

Kenny Hung improve hint text and collaboration I created this document ( https://docs.google.com/presentation/d/1C0bL3rIhUsZ46fFYEKgBFrhxw-a4rvwh439PRLuyjoM/edit?usp=sharing )
Or anyone else who has feedback can leave notes there.

[sync-by-unito]

➤ Sam commented:

Kenny Hung I also add this small feature in case at Q&A stage you need to reset user guide progress (demo ( https://youtu.be/5_3IaDJ9y74 ))

[sync-by-unito]

➤ Sam commented:

Final In-App user guide ver 2.0 (with EN, CH) ( https://youtube.com/shorts/182A9DmJy60?feature=share ).

If there is any translation error please update it in the google slide document ( https://docs.google.com/presentation/d/1C0bL3rIhUsZ46fFYEKgBFrhxw-a4rvwh439PRLuyjoM/edit?usp=sharing ) I will refactor the code to match new translations.

Here is the pull request ( #1617 ).

[sync-by-unito]

➤ Kenny Hung commented:

Sofia Yan This part needs your help translating En to CH about this doc ( https://docs.google.com/presentation/d/1C0bL3rIhUsZ46fFYEKgBFrhxw-a4rvwh439PRLuyjoM/edit#slide=id.g129f1ce114e_0_269 ).

[sync-by-unito]

➤ Sofia Yan commented:

Kenny Hung should I modified on the origin sentences directly or should I put it in expected text part? I saw there's a translation on the doc already.

Suggest QA check it first, I can help on the Chinese proof-read

[sync-by-unito]

➤ Kenny Hung commented:

Thank Sofia Yan suggestion. I have checked it & added to the slide, and please help review Expect Text you think needs to adjust.

[sync-by-unito]

➤ Sam commented:

Kenny Hung I updated the translations provided by Sofia.
Here is the pull request ( #1617 ).

By the way who I should ask for a code review? Most of the time I ask James but don't want to overload him.

[sync-by-unito]

➤ Kenny Hung commented:

I'm not sure about code review maybe you could ask Bofu Chen who could help this.

[sync-by-unito]

➤ Sam commented:

Kenny Hung updated according to the latest Expected Text
James Chien pls have a look at pr ( #1617 )

[sync-by-unito]

➤ James Chien commented:

I can't find the PR now, did you delete it?

[sync-by-unito]

➤ Sam commented:

James Chien I didn't deleted the branch but I just received notification that my GitHub account is suspended

[2022-05-17T10:34:33.775Z] > git push origin feature-in-app-user-guide:feature-in-app-user-guide [760ms]
[2022-05-17T10:34:33.776Z] remote: Your account is suspended. Please visit https://support.github.com ( https://support.github.com ) for more information.
fatal: unable to access 'https://github.com/numbersprotocol/capture-lite.git/ ( https://github.com/numbersprotocol/capture-lite.git/ )': The requested URL returned error: 403

Let me figure out why 😅 and get back to you