Electron Gamepad/Keyboard Input Recorder & HTML Visual Display
- or -
Post a project like this£1.0k(approx. $1.3k)
- Posted:
- Proposals: 4
- Remote
- #3696595
- OPPORTUNITY
- Expired
Description
Experience Level: Expert
Estimated project duration: 3 - 4 weeks
We have a desktop app built with Electron (using REACT) which captures the screen of a person when playing a game; however, we'd like to have the following built to capture the interaction of someone using their keyboard/mouse or gamepad like the following examples (https://obsproject.com/forum/resources/input-overlay.552/) (https://www.youtube.com/watch?v=_jdupqY9oxM&t=3s) and be able to show that back in the browser after the test is run for the user to analyse their behaviour.
As part of the project, we'd need the following outcomes:
[1] The 'Electron React' application would check in the background that they're either connected/disconnected.
If connected correctly, it would display either the keyboard/mouse or Gamepad on the screen & the interactions visually to the user in HTML, so they can confirm everything is working correctly.
[2] Once a user is happy it's working, they would then press a button to start recording their inputs from that point.
[3] All the input data (For both methods (Grouped separately)) would be tracked, categorised & timestamped to the recording timecode until they hit stop recording.
--- Note this would need to be in a structured lightweight format that could then be sent to a database.
[4] A person can then hit a button to playback/watch the interactions (see the keyboard/mouse or gamepad) in HTML/a browser on their own without any input to assess how they were playing a game.
[5] Additionally, a person should also be able to:
[a] playback the recorded inputs at the following speeds x0.25, x0.5, x0.75, x1.0, x1.25, x1.5, x1.75, x2.0.
[b] hide & show the visualisations at any point in the recording process.
Note,
[1] Our intention is not to overlay this information onto the screen recording in real-time; however, to keep it in our recorder, which is minimised while someone takes part in an activity and will be displayed in a web browser after the recording is uploaded to our online platform for someone to watch back.
[2] We will supply the artwork assets in an illustrator file to use. A working/MVP design has been attached for the gamepad; however, an updated version would be supplied in layers to be re-created by yourself in HTML whatever way is recommended by you to optimise load times/playback.
[3] This should be a standalone application that our team would integrate into our company PC recorder when the prototype has been validated.
[4] The data schema for storing the inputs should be as compact as possible & we'd require a guide provided to describe the reasoning for the schema chosen.
As part of the project, we'd need the following outcomes:
[1] The 'Electron React' application would check in the background that they're either connected/disconnected.
If connected correctly, it would display either the keyboard/mouse or Gamepad on the screen & the interactions visually to the user in HTML, so they can confirm everything is working correctly.
[2] Once a user is happy it's working, they would then press a button to start recording their inputs from that point.
[3] All the input data (For both methods (Grouped separately)) would be tracked, categorised & timestamped to the recording timecode until they hit stop recording.
--- Note this would need to be in a structured lightweight format that could then be sent to a database.
[4] A person can then hit a button to playback/watch the interactions (see the keyboard/mouse or gamepad) in HTML/a browser on their own without any input to assess how they were playing a game.
[5] Additionally, a person should also be able to:
[a] playback the recorded inputs at the following speeds x0.25, x0.5, x0.75, x1.0, x1.25, x1.5, x1.75, x2.0.
[b] hide & show the visualisations at any point in the recording process.
Note,
[1] Our intention is not to overlay this information onto the screen recording in real-time; however, to keep it in our recorder, which is minimised while someone takes part in an activity and will be displayed in a web browser after the recording is uploaded to our online platform for someone to watch back.
[2] We will supply the artwork assets in an illustrator file to use. A working/MVP design has been attached for the gamepad; however, an updated version would be supplied in layers to be re-created by yourself in HTML whatever way is recommended by you to optimise load times/playback.
[3] This should be a standalone application that our team would integrate into our company PC recorder when the prototype has been validated.
[4] The data schema for storing the inputs should be as compact as possible & we'd require a guide provided to describe the reasoning for the schema chosen.
Adrian C.
100% (2)Projects Completed
3
Freelancers worked with
3
Projects awarded
60%
Last project
11 Jun 2019
United Kingdom
New Proposal
Login to your account and send a proposal now to get this project.
Log inClarification Board Ask a Question
-
Electron is for both platform, but just for confirmation, do you need for both platform i.e windows and mac ?
1033833
We collect cookies to enable the proper functioning and security of our website, and to enhance your experience. By clicking on 'Accept All Cookies', you consent to the use of these cookies. You can change your 'Cookies Settings' at any time. For more information, please read ourCookie Policy
Cookie Settings
Accept All Cookies