sivicstudio / starkludo

Ludo game on Starknet
https://testnet.starkludo.com
MIT License
8 stars 28 forks source link

Make sound when player clicks any square in the board paths #23

Closed princeibs closed 2 weeks ago

princeibs commented 3 weeks ago

When a player clicks any of the square along the board path, a click sound should be made in response. Search for suitable sounds at https://freesound.org/

If you have any more questions or need more clarity on this issue, endeavour to join the StarkLudo contributors channel (https://t.me/+hnjQooODZOA2M2Rk) on Telegram and the project leads will be there to help.

ooochoche commented 3 weeks ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I can take on this

kateberryd commented 3 weeks ago

Can I be assign this

Gift-Naomi commented 3 weeks ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a frontend developer

How I plan on tackling this issue

  1. Find and download a suitable click sound from Freesound.
  2. Load the sound in your project using a method appropriate for your platform (e.g., Audio for web, expo-av for React Native).
  3. Attach the sound to a click event on the Ludo seeds, so it plays whenever a seed is clicked.
kateberryd commented 3 weeks ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I'm a frontend developer

How I plan on tackling this issue

I’ll start by visiting FreeSound.org and searching for a "click" sound that fits the vibe of the game. I’ll look for something short and crisp. After previewing a few options, I’ll download the one that seems most suitable. I’ll also double-check that the license matches the use case, especially if it’s a commercial project.

I’ll ensure that the sound file is in a compatible format like .mp3 or .wav. If it’s not, I’ll convert it using an audio tool. If needed, I’ll edit the sound to adjust the volume or trim any excess using software like Audacity. Once the sound is ready, I’ll place the file in the project’s directory, ideally in a location like assets/sounds/.

I’ll import the sound file into the React component where the board is rendered. I’ll then set up an audio object using the sound file so it can be triggered when needed. Finally, I’ll attach the sound to the square click event so that each time a square is clicked, the sound plays to give the user instant feedback.

CollinsC1O commented 3 weeks ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I'm a frontend and a blockchain developer and I will love to work on this

How I plan on tackling this issue

To make a sound when a player clicks any square on the board paths, i did follow these steps:

Define Sound Files: Choose or create appropriate sound effects for clicks (e.g., a subtle chime or click sound).

Integrate Sound Engine: Use a sound engine or library compatible with your development environment (e.g., HTML5 Audio API, Unity Audio, etc.).

Event Listener Setup: Add event listeners to each square on the board that will trigger the sound effect when clicked.

Load and Play Sound: Ensure the sound files are preloaded and played through the event listener on each click event.

Test and Optimize: Test the implementation to ensure sound plays correctly and adjust volume or timing as needed for optimal user experience.
GoSTEAN commented 3 weeks ago

I am applying via OnlyDust Platform

Background and How It Can Be Leveraged:

I am a frontend Dev and a Solidity Developer.

Approach to the Problem:

  1. Search for Suitable Sound:

    • Go to freesound.org and search for a click sound that complements the gameplay of a board game like Ludo. Look for sounds that are clear, sharp, and not too distracting, ensuring they enhance the player's interaction.
  2. Download and Test Sound Options:

    • Download a few selected click sounds and test them in the game's environment. Check how each sound feels when triggered by clicking a square along the board path.
  3. Integrate the Sound into the Game:

    • Add the chosen sound effect to the game’s code, programming it to play every time a player clicks on any square along the board path.
  4. Playtest the Sound Implementation:

    • Test the game to ensure that the sound effect is played correctly with every click, and there are no issues like overlapping sounds or delays.
  5. Optimize and Adjust:

    • Fine-tune the sound’s volume and duration to ensure it fits seamlessly into the game's audio landscape. Make any necessary adjustments based on the feedback from the playtesting phase.
SoarinSkySagar commented 3 weeks ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a full stack Web3 developer with over a year of experience in creating dapps. Prior to that, I have been working as a full stack developer. My tech stacks include Next.js, React.js, Express.js and typescript. My speciality is creating beautiful frontends and complex backend designs. I love contributing to open source repositories where I can learn new stuff and contribute to the development of an organisation.

How I plan on tackling this issue

The 'Audio' object of HTML can be used to make sounds in the application when player clicks on any square in the board path. Here is a sample code on how we can make sounds when a button is clicked:

'use client';

import { useCallback } from 'react';

const SoundButton = () => {
  const soundPath = '/sound.mp3';

  const playSound = useCallback(() => {
    const audio = new Audio(soundPath);
    audio.play();
  }, []);

  return (
    <button onClick={playSound} className="p-4 bg-blue-500 text-white rounded-lg">
      Click Me!
    </button>
  );
};

export default SoundButton;

We can implement this functionality in this way and hence, the sound making system can be achieved. If assigned to me, I will also:

  1. Make sure the code is clean, readable and error-free
  2. Comments added wherever required
  3. Documentation updated wherever required
  4. Thoroughly tested for any errors before the PR

I would really like to work and resolve this issue, so please assign me @princeibs

MullerTheScientist commented 3 weeks ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I am a full-stack developer with experience in different languages, like Python, Cairo, Solidity, React, and JavaScript.

How I plan on tackling this issue

I will use a consistent sound effect for all board squares. Ensure the sound is not too loud or distracting. Test the implementation on different devices and browsers.

JoelVR17 commented 3 weeks ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

I'm a Full Stack Web Developer with a solid background in front-end and back-end development. So it will be a pleasure to contribute for the first time to this great project. I'm member of Dojo Coding

How I plan on tackling this issue

  1. Search for Suitable Sound Effects:

    • I would begin by visiting FreeSound to search for click sounds that would be appropriate for the game. I would use search terms such as "click," "button press," or "game click" to find the best matches.
    • I will focus on sounds that are short, crisp, and pleasant to ensure they fit well with the user interaction and don’t become repetitive or annoying during gameplay.
  2. Evaluate and Download:

    • After identifying a few potential sounds, I would evaluate them based on their quality, file size, and licensing terms to ensure they can be freely used in the project.
    • I would download the selected sound files and convert them to a web-friendly format (like .mp3 or .ogg) if necessary.
  3. Implement the Sound in the Application:

    • I would add the sound file(s) to the project's assets and create a function to handle the playing of the sound when a player clicks on any square on the board.
    • The implementation in React could look something like this:

      import React, { useEffect } from 'react';
      import clickSound from './assets/sounds/click.mp3';
      
      const BoardSquare = ({ onClick }) => {
      const handleClick = () => {
       const audio = new Audio(clickSound);
       audio.play();
       onClick();
      };
      
      return <div onClick={handleClick} className="board-square"></div>;
      };
      
      export default BoardSquare;
    • This code ensures that every time a player clicks a square, the click sound is played.
  4. Testing and Optimization:

    • I would test the implementation to ensure that the sound plays smoothly without delays or interruptions.
    • Additionally, I would verify that the sound does not interfere with other game mechanics or audio, maintaining a balanced audio experience for the user.
  5. Documentation and Code Review:

    • I would update the project documentation to include details about the sound file used, including its source and license information.
    • Before finalizing the implementation, I would request a code review to ensure the solution adheres to the project's coding standards and performance guidelines.
  6. Join the StarkLudo Contributors Channel:

    • If there are any questions or further clarifications needed, I would join the StarkLudo contributors channel on Telegram to discuss with the project leads and other contributors.
    • I would ensure that the project leads and contributors are aligned with the choice of sound and implementation before proceeding to final deployment.

Additional Notes:

NueloSE commented 3 weeks ago

I am applying to this issue via OnlyDust platform.

My background and how it can be leveraged

Hello, am a frontend developer with experience in using frontend technologies and some level of understanding of the implementations in the ludo game.

i believe with my understanding of the frontend end implementation i would be able to contribute to the project.

How I plan on tackling this issue

Hello, am a frontend developer with experience in using frontend technologies and some level of understanding of the implementations in the ludo game.

i believe with my understanding of the frontend end implementation i would be able to contribute to the project.

onlydustapp[bot] commented 3 weeks ago

The maintainer princeibs has assigned kateberryd to this issue via OnlyDust Platform. Good luck!