We found that the recording length is still a little too long.
Please update to 5 seconds

Please check/update these two small typos we found in our text:

• The word "a" is missing from, "Hear your voice through a simulated cochlear implant."

• The period is missing from the end of, "Hear other sounds through a simulated cochlear implant."

Some elements of the GUI bounce/shift when changing languages. This might be our fault if they were slightly off in the Figma file, but their position should be the exact same with both languages.
Video: https://d.pr/v/tCSmg1

Can the modal be redesigned with proper content and image?

If that's not possible, can we get just get the two images instead? Currently, we're cropping them from the bigger image being used in the modal.

You already mentioned you are fixing this by switching to gatsby-image but I'm documenting just in case.

The image on the informational popup has a delayed "pop-in."
It should be pre-loaded and appear without a delay.

The order of the buttons are reversed -- They should go (from left to right) delete, play, microphone.

Our developers requested we change the formatting of the Image/Sound credits.

Here are the updated credits to use;
Credits.pdf

You will need to reduce the font-size in order to fit them in the same space, as seen in this screenshot:

This should be updated in the Figma file as well.

People were a little confused with our button layout, so we'd like to simplify.

The updates are represented in Figma:
https://www.figma.com/file/kxTKAu4FvGHEEbFVx4QMd2/TSCK---Cochlear-Implants-V2?node-id=0%3A1

To summarize:

• Before recording, only microphone (now larger) button should display
• During recording, microphone button is disabled
• After recording, large play button displays with smaller reset button
• While playing a recording, the play button becomes a stop button
• The stop button stops the sound and and resets playback to 0s
• The reset button deletes the recording, and returns to the pre-recording state showing only the large microphone button.

• Change inactivity timeout from 60 seconds to 40 seconds
• Change recording duration from 10 seconds to 8 seconds

Please update to accommodate these two scenarios:

• While a pre-recorded sound is playing, user should be able to tap the ‘record’ button. This would immediately stop current playback and start a new recording.
• While playing back a recorded sound, user should be able to tap a pre-recorded sound button. This would immediately cancel the recording to start playing the pre-recorded sound.

Currently, you must tap/click the icon to play a sound.
The entire sound "card" should act as the button.

Here are the final image and sound assets for the card buttons:

CochlearImplantAssets_.zip

Feel free to convert the sound formats as needed.

After a visitor starts a sound, could you turn the "play" icon into a "stop" icon?
If a visitor touches the card-button in this state, it would stop playback and swap back to the "play" icon.
(Sorry, we hadn't thought of this earlier. Let me know if this is overly difficult.)

The following issues will be resolved along with the next milestone:

1. The inactivity countdown should not start again until someone interacts with the interface.
2. The content for the modal should be dynamic.
3. The "Delete" button in the Recorder component should also cancel any in-progress recording.

This is a common issue we need to prevent in exhibit touchscreen experiences: https://d.pr/v/5w6xJM

You should be able to add this CSS to disallow:

Disable text selection

  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;

Disable image ghost-dragging:

  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;

Please change the "Sound credit" font to be small enough to fit both an image and sound credit under each, as seen in this mockup: https://d.pr/i/FG44Sa

Please use the following credits:

Bird

Image: Andreas Trepte, www.avi-fauna.info
Sound: Courtesy Daniel71953

Traffic

Image: ⓒiStock.com / life in shots
Sound: Zapsplat, https://www.zapsplat.com

Flag

Image: ⓒiStock.com / creisinger
Sound: Daniel71953 / Creative Commons

Can you move the 'A' down to the next line? (https://d.pr/i/U7WFpl)

The word "song" in the bird song button should not be capitalized.

This button should display a drop-shadow, as seen in this screenshot:

No text or design element should be pure black (Example).

Please replace any pure blacks with Hex #0D003A.

The Gatsby Images sporadically disappear, or fail to load.

https://d.pr/v/idlXwg

It seems to happen either after an inactivity refresh, or the first time the application loads. Reloading the page seems to fix it, but this happened 3–4 times while we were testing.

@abdulrauf11 do you have any ideas on what might be causing this? I haven't seen anything suspicious come out in the console.

On the touchscreen, an orange focus outline is appearing whenever a button is touched.
You should be able to remove this effect with some CSS:
button:focus { outline: none; }

Examples:
https://d.pr/i/7mLhfU
https://d.pr/i/cu4dP3

Add semi-transparent "active" states to all the buttons as seen here: https://d.pr/i/EVWXtt