[FEAT] Create UX/UI of Pulse Capture via Camera

[tesla809]

⚠️ IMPORTANT: Please fill out this template to give us as much information as possible to consider/implement the feature.

Prerequisites

• check this box if you have completed the following:
  • Reviewed the contributing guidelines and support files
  • Reviewed the README file for the repository you are working in
  • Searched for relevant instructions on our Discord server
  • Searched the issues of the repository you are working in to make sure one was not already filed

Summary

Create a UI/UX for the Pulse Capture via Camera feature.
It will need a button in the navbar as well.

For now, we can replace the map feature with this feature that is NEEDED for MVP to be deployable in field.

Decide on what icon we can use that has a non-restrictive license (heart icon, something that signifies pulse camera, etc).

There should be a toggle for the finger measurement (back-facing camera) and face (forward-facing camera)

The UI/UX will describe how it works with as few words as possible. It should be intuitive to use on the first try. The cleaner the UX/UI the better.

It will have its own view on the app.

See associated issue: #677

See: ROADMAP-TO-MVP

See this github repo for an idea of how it work

Shout out to @habom2310 for creating this way back when.

examples:
See examples 2020

see more example 2015

Motivation

**Why are we doing this? **
We need a mock-up of how the pulse capture feature will look like. It is a KEY component to get to MVP status.

What use cases does it support?
Supports hitting our specifications to get to MVP status according to ROADMAP-TO-MVP

** What is the expected outcome? **
The Front end team knows what the UX/UI will look like for the Feature

Possible Alternatives

Just make it up as you go. But this creates a bottleneck and reduces collaboration across team.
This solution allows for collaboration and a clear picture of what to build.

Additional Context

See: ROADMAP-TO-MVP

See this github repo for an idea of how it work

See examples 2020

see more example 2015

[AdhamAH]

Something like this?

[tesla809]

Looking AMAZING @AdhamAH !!! Can we have the heart alone instead?

[SvenVanPoucke]

Great, looking forward to use it, congrats Op wo 6 mei 2020 00:12 schreef Anthony Albertorio <[email protected]

…

: Looking AMAZING @AdhamAH <https://github.com/AdhamAH> !!! Can we have the heart alone instead? — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub <#685 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ABOUXYQ7B2KIW7QNKHZRHY3RQCFNVANCNFSM4MWRDFYA> .

[SomeMoosery]

@BrianHHough when making a PR to add these to the /design directory (as I assume this is where wireframes should go still) - this is the issue you'll likely close when making the PR.

I can go ahead and make individual issues for each screen once this is done as we can easily parallelize this work.

[AdhamAH]

@SomeMoosery I made the skeleton for this as you can see. If you recall I had to manually to style more.jsx to fit into the NavBar.
When I made NavBar.jsx there was no plan for a popup. Using BottomNavigation was not the best thing here. So when @BrianHHough upload the design, we can make an issue to add the pulse button and update the NavBar.jsx with something more flexible like this

I think it is safe to close this for now

[SomeMoosery]

I saw you made that but it is difficult to track what is being done by who when changes aren't being tracked in issues. I know Brian uploaded I believe 8 new screens somewhere in Discord. I believe the process should be something:

1. @BrianHHough adds the wireframes to the appropriate folder and closes that Issue
2. We write out issues for all 8 new views
3. We parallelize the work and clearly track each

I just want to be sure we don't start relying too much on Discord and not tracking work being done in issues as that's how things can potentially get out of hand - it's a bit difficult to follow changes being made when there's no appropriate issues out / git flow being followed for them is all. Although I have been busy - if I'm missing context definitely let me know :)