[Epic] Voice Messages - Phase 1

[langleyd]

After phase 1, voice messages can be sent, received and played in the timeline. They can be previewed and are integrated into other features such as notifications and room summaries. Some functionality may come for free as part of pre-existing features.

Note the that send and preview are split into separate stories to flush out challenges in sending earlier.

Based on

• MSC3245: Voice messages (using extensible events) matrix-org/matrix-spec-proposals#3245
• MSC3246: Audio waveform for extensible events matrix-org/matrix-spec-proposals#3246
• MSC3927: Extensible Events - Audio matrix-org/matrix-spec-proposals#3927

Note that for compatibility with classic Element apps, this implementation will be based on an older version of MSC3245 called 'v1' (see matrix-org/matrix-spec-proposals#3245 (comment)).

### User Stories
- [ ] https://github.com/vector-im/element-meta/issues/2083
- [ ] https://github.com/vector-im/element-meta/issues/2084
- [ ] https://github.com/vector-im/element-meta/issues/2085
- [ ] https://github.com/vector-im/element-meta/issues/2104
- [ ] https://github.com/vector-im/element-meta/issues/2105
- [ ] https://github.com/vector-im/element-meta/issues/2106
- [ ] https://github.com/vector-im/element-meta/issues/2108
- [ ] https://github.com/vector-im/element-meta/issues/2109

Open questions

### Rust
- [x] Is it worth to use the libopus crate? (use libopusencoder-android/swift-ogg initially then re-evaluate)

Out of scope

• [Epic] Voice Messages - Phase 2 #2081

Sign-off

### Android
- [ ] Design sign-off on completion
- [ ] QA sign-off on completion
- [ ] Product sign-off on completion

### iOS
- [ ] Design sign-off on completion
- [ ] QA sign-off on completion
- [ ] Product sign-off on completion

References

• Product spec
• Original product spec

Technical lead: @jonnyandrew

myhours project: Element X

[callumu]

Some design comments for iOS FYI @alfogrillo:

• Hold to record tooltip should be moved so that the point of the tooltip is centered above the microphone icon
• Tooltip text size should be body/sm/semibold
• If the keyboard is shown, selecting and holding to record a voice message shouldn't hide the keyboard
• Can you remove the border colour for the recording UI in the composer?
• Can the red dot blink instead of being stationary?
• Can we add the green scrubber in the preview before sending? Don't worry if it's too time consuming - we can add this in the next version
• Play and pause icon should be 24px like in the designs - can you double check these?
• Can the change between the play and pause icon be instant? Right now there's a blinking effect on the whole button which shouldn't be there

[alfogrillo]

@callumu can clarify some of the above?

Can you remove the border colour for the recording UI in the composer?

You mean removing the border after the a record (in the preview), or during it?

Can the change between the play and pause icon be instant? Right now there's a blinking effect on the whole button which shouldn't be there

I think the button is fading during the user interaction (the press on the button) like most of our buttons do in the app.
Are you suggesting to remove this behavior here?

[callumu]

You mean removing the border after the a record (in the preview), or during it?

Oh yes sorry I mean during both.

I think the button is fading during the user interaction (the press on the button) like most of our buttons do in the app. Are you suggesting to remove this behavior here?

For this use case yes. Either that or with a much faster fade