এয়ার - ট্রু মোবাইল এয়ার গিটার (প্রোটোটাইপ): 7 টি ধাপ (ছবি সহ)

2024 লেখক: John Day | [email protected]. সর্বশেষ পরিবর্তিত: 2024-01-30 07:56

ঠিক আছে, তাই, অবশেষে আমার ছোটবেলার স্বপ্নের কাছাকাছি আসার প্রথম অংশ সম্পর্কে এটি সত্যিই সংক্ষিপ্ত নির্দেশযোগ্য হবে।

যখন আমি একটি ছোট ছেলে ছিলাম, আমি সবসময় আমার প্রিয় শিল্পী এবং ব্যান্ডগুলিকে নিখুঁতভাবে গিটার বাজাতে দেখেছি।

আমি যখন বড় হয়েছি, আমি গিটার বাজাতে শিখতে এবং এমনকি অন্যের মালিকানাধীন কিছু বাজানোর জন্য যথেষ্ট কৃতজ্ঞ ছিলাম, কিন্তু এখনও আমার নিজের নেই:(তাই আমি অবশেষে বসে থাকার সিদ্ধান্ত নিলাম যেটি ফোনে পুরোপুরি চলে, কম্পিউটার ভিশন ব্যবহার করে এবং আমার মত লোকদেরকে অনুমতি দেয় যারা গিটার চায় কিন্তু ভ্রমণ করতে পারে, ভেঙে যেতে পারে বা খুব ছোট হতে পারে!

আপনি এই ওয়েবসাইটে প্রোটোটাইপ অ্যাপটি খুঁজে পেতে পারেন

কিভাবে খেলতে হয় তা দেখতে, "আপনি সম্পন্ন" ধাপে যান।

* আপনার ফোনে এটি ব্যবহার করতে ভুলবেন না এবং স্ক্রিনটিকে পাশের দিকে ল্যান্ডস্কেপ মোডে চালু করুন *

উপভোগ করুন!

(ﾉ ◕ ヮ ◕) ﾉ *: ･ ﾟ ✧ ･: *ヽ (◕ ヮ ◕ ヽ)

সরবরাহ:

1. স্মার্ট ফোন

2. ডেস্কটপ কম্পিউটার বা ল্যাপটপ (প্রোগ্রামিং এর জন্য)

ধাপ 1: ব্যাকগ্রাউন্ড এবং কোডে নোট

এই প্রকল্পটি মূলত একটি কোডেড প্রজেক্ট যার লক্ষ্য সম্পূর্ণভাবে ফোনে চালানো।

এই প্রজেক্টটি নিয়ে আসার সময়, আমি অন্যান্য বিভিন্ন অ্যাপ ব্যবহার করে দেখেছি এবং বর্তমানে বাজারে থাকা অন্যান্য ডিভাইস যেমন এয়ারজ্যামজ বা কুরভ গিটার, পোর্টেবল গিটার বা প্লে স্টোরে রিয়েল গিটার অ্যাপের সন্ধান করেছি।

আমি তাদের অনেকের অভাব খুঁজে পেয়েছি:

1. কিছু বাহ্যিক যন্ত্রের প্রয়োজন

প্রায় সব অ্যাপই আপনাকে প্রকৃত chords বা মিউজিক বাজাতে দেয়নি এবং শুধু বোর্ড সিমুলেটর ছিল

Ex. বহিরাগত যন্ত্রপাতিগুলো ছিল বেশ মূল্যবান এবং অনেক গিটারবাদক শুধু একটি প্রকৃত গিটার কেনার পরামর্শ দিয়েছিলেন

এগুলি সহ চিত্রগুলিতে চিত্রিত।

এবং তাই এয়ার অ্যাপকে এই সমস্যাগুলি সমাধান করতে হবে যখন ফোনে পুরোপুরি চালাতে সক্ষম হবে। আমি বিশ্বাস করি এটা সম্ভব কারণ ২০২০ সালে আমাদের কাছে অনেক ভালো মোবাইল ব্রাউজার টেকনোলজি এবং কম্পিউটার ভিশনের অনেক উন্নতি আছে যা আমাদের একক RGB ক্যামেরা দিয়ে বিস্ময়কর কাজ করতে দেয়।

তাই আমি সম্পূর্ণরূপে শুরু করার আগে এটি দেখতে কেমন হবে এবং এটি কীভাবে কাজ করবে তার কিছু স্কেচ করতে এগিয়ে গেলাম।

আমি আমার কোডিংয়ের মাইলফলকও বের করেছি তাই এই নির্দেশনায়, কোড দিয়ে আপনাকে বিরক্ত করার পরিবর্তে, আমি আপনাকে আমার নকশা প্রক্রিয়ার মধ্য দিয়ে নিয়ে যাব এবং শেষে টীকাটি কোডটি সংযুক্ত করব যাতে আপনি পড়তে পারেন এবং আপনার প্রয়োজন হলে দেখতে পারেন।

সম্পূর্ণ কোডটি https://github.com/msimbao/air এ পাওয়া যাবে এবং আমি আপনার কোড ফাইলগুলিকে একইরকম কাঠামো করার পরামর্শ দিচ্ছি।

এছাড়াও লক্ষ্য করুন যে অ্যাপটি চালানোর জন্য, এটি হোস্ট করা প্রয়োজন। আমি এখনও পর্যন্ত এটি গিথুব হোস্ট করার সময় চালানোর জন্য খুঁজে পেয়েছি।:)

পদক্ষেপ 2: স্ট্রামিং অ্যাকশন

প্রথম প্রধান কোডিং মাইলফলক, কোন বাহ্যিক পরিধি ছাড়া ডিজিটালভাবে একটি স্ট্রাম প্রতিলিপি করার উপায় খুঁজে বের করা ছিল। আমার অবিলম্বে চিন্তা ছিল আমার ফোনের RGB ফ্রন্ট ফেসিং ক্যামেরা ব্যবহার করা।

আমার চিন্তা ছিল যে যদি একজন ব্যক্তির একটি বাজ থাকে তারা খেলতে চায়, তারপর যখন তারা তাদের ক্যামেরার সামনে হাত সোয়াইপ করবে, তখন একটি শব্দ বাজানো হবে।

এটি বের করার পরে, আমার তখন একটি ভাল প্রোগ্রামিং ভাষা দরকার যা আরজিবি ক্যামেরার সাথে ভালভাবে ইন্টারফেস করতে ব্যবহার করা যেতে পারে।

আমি জাভাস্ক্রিপ্টের জন্য স্থির হয়েছি কারণ আমি রিয়েক্ট নেটিভ বা অন্য কিছু দিয়ে একটি ক্রস-প্ল্যাটফর্ম অ্যাপ তৈরি করতে পারতাম অথবা শুধু একটি ওয়েবসাইটে গিটার হোস্ট করতে পারতাম এবং এটি সবার জন্য উপলব্ধ হতে পারে।

আমি তখন হাতের সোয়াইপটি কীভাবে একটি অ্যাকশন ট্রিগার করতে পারি তা বের করার বিভিন্ন উপায় খুঁজে পেয়েছি যা একটি কর্ড শব্দ বাজানো হতে পারে কিন্তু এটি করার অনেক উপায় ছিল।

মেশিন লার্নিং খুব ভাল কাজ করেছিল যখন আমি আইবিএম এর পরিষেবাগুলি চেষ্টা করেছিলাম এবং সপ্তাহে প্রায় 3000 ইমেজ প্রশিক্ষণ দিয়েছিলাম সোয়াইপ রিকগনিশন এবং কর্ড রিকগনিশনের জন্য। আমি ভিক্টোরিডবিয়া দ্বারা handtrack.js চেষ্টা করেছি। দুর্ভাগ্যবশত তারা উভয়েই মোবাইল ফোনে অবিশ্বাস্যভাবে ধীর ছিল।

আমি তারপর diffcam.com এ lonekorean দ্বারা গতি সনাক্তকরণ এবং একটি বাস্তবায়ন জুড়ে হোঁচট খেয়েছি। আমি শিখেছি যে দুটি আলাদা ফ্রেম রেকর্ড করার জন্য ওয়েবক্যাম ব্যবহার করা সম্ভব এবং তারপরে ফ্রেমের মধ্যে পার্থক্য গণনা করা এবং পার্থক্যটিকে একটি স্কোর দেওয়া সম্ভব। যদি সেই স্কোর একটি নির্দিষ্ট থ্রেশহোল্ড অতিক্রম করে, তাহলে আমি একটি কর্ম সম্পাদন করি।

লোনকোরিয়ান তার ডিফ ক্যামের জন্য একটি ইঞ্জিনও তৈরি করেছিল যা আমি এয়ার গিটারের জন্য ব্যবহার করার সিদ্ধান্ত নিয়েছিলাম এবং এটি আমাকে মোশন স্কোর পাওয়ার জন্য পুরোপুরি কাজ করেছিল!

মেশিন লার্নিং মডেলের প্রশিক্ষণের প্রচেষ্টার ছবি এবং সেই সাথে diffcam.com এর উদাহরণ সংযুক্ত করেছি।

দ্রষ্টব্য: এই বর্তমান প্রোটোটাইপে, ঝাঁকুনি বারবার পুনরাবৃত্তি করে, এটি বন্ধ করার জন্য, আপনি যে শব্দটি বাজাতে চান তা ধরে রাখুন। এটি একটি বাগ যা আমরা সামনে ঠিক করার আশা করি।

সম্পূর্ণ স্ট্রামের কোডটি স্ক্রিপ্ট.জেএস ফাইলে পাওয়া যায় এবং লোনকোরিয়ানের ডিফক্যাম ইঞ্জিন এখানে রয়েছে।

ধাপ 3: কর্ড স্বীকৃতি

পরবর্তী কোডিং মাইলফলক ছিল জিন স্বীকৃতি লাইভ পরিচালনা করার উপায় খুঁজে বের করা।

আমি চেয়েছিলাম যে একজন ব্যবহারকারী প্রকৃত কর্ড আকারের প্রতিলিপি তৈরি করতে সক্ষম হোন এবং তাই ভাল হাত বসানোর অনুশীলন করুন এবং তাদের বিভিন্ন chords অনুশীলনে সহায়তা করুন।

শেষ ধাপের মতো, আমি জিন স্বীকৃতির জন্য মেশিন লার্নিং চেষ্টা করেছিলাম, কিন্তু মোবাইল ফোনে এটি খুব ধীর ছিল।

আমি তখন রিয়েল গিটার অ্যাপ থেকে কিছু শিখেছি যে ফোনের স্ক্রিনে একটি ফ্রেটবোর্ড লাগানো সম্ভব হতে পারে স্ক্রিন ব্যবহার করে জিনের আকার তৈরি করতে।

আমি তখন জাভাস্ক্রিপ্টে মাল্টি-টাচ ইন্টারঅ্যাকশনের অনুমতি দিতে শিখতে হয়েছিল এবং মজিলার ডক্স থেকে একটি দুর্দান্ত টিউটোরিয়াল এবং উদাহরণ খুঁজে পেয়েছিলাম

টাচ ইন্টারঅ্যাকশনগুলি বিশেষত জাভাস্ক্রিপ্টে জটিল হতে পারে তবে ধারণাটি হ'ল আমরা কিছু ডিভ তৈরি করতে পারি এবং তারপরে বিভিন্ন স্পর্শ ইভেন্টগুলি পরিচালনা করার জন্য ফাংশনগুলি সংজ্ঞায়িত করতে পারি:

1. টাচ স্টার্ট: যখন একটি আঙুল স্ক্রিন স্পর্শ করে

2. স্পর্শ শেষ: যখন আঙুল চলে যায়

3. touchMove: যখন আঙুলটি পর্দায় থাকে কিন্তু অবস্থান পরিবর্তন করে

আমরা তখন সেই ফাংশনগুলোর চারপাশে কাজ করি আমাদের নিজস্ব উপাদানগুলিকে সংজ্ঞায়িত করতে যা বিভিন্ন স্পর্শ ইভেন্ট এবং সংমিশ্রণে সাড়া দেয়।

আমাদের ক্ষেত্রে, আমরা CSS এবং তারপর জাভাস্ক্রিপ্ট ব্যবহার করে একটি ঝগড়া বোর্ড ডিজাইন করি, অ্যাপকে বলি যে যখন নির্দিষ্ট ডিভগুলি একসাথে চাপানো হয়, তখন একটি স্বর স্বীকৃত হওয়া উচিত।

আমরা তখন একটি অডিও বস্তু সংজ্ঞায়িত করতে পারি যা আমরা কর্ডটি পাস করব এবং তারপর যখন একটি সোয়াইপ ইভেন্ট ঘটে তখন সেই অডিওটি চালাব।

বিভিন্ন জ্যোতি সংমিশ্রণ সংজ্ঞায়িত করার জন্য, আমি এই ছবিটি ব্যবহার করে ঝগড়া বোর্ড তৈরি করেছি এবং তারপর প্রতিটি বিশেষ অবস্থানকে একটি ডিভ হিসাবে সেট করেছি যা আমি স্পর্শ করতে পারি এবং অন্যদের সাথে একত্রিত করতে পারি।

জ্যা অগ্রগতি সংজ্ঞায়িত করার কোড এখানে পাওয়া যায় এবং fretboard নিয়ামক সংযুক্ত কোডে পাওয়া যায়।

ধাপ 4: শব্দ শব্দ খোঁজা

এখন যেহেতু আমাদের সিস্টেমটি চিনতে সেট করা হয়েছে, আমাদের কিছু প্রকৃত জ্যোতি প্রয়োজন।

সৌভাগ্যক্রমে, যখন আমার অডিও নমুনার প্রয়োজন হয় তখন freesound.com সবসময় আমার সহায়তায় আসে। আমি কেবল chords অনুসন্ধান করেছি এবং danglada দ্বারা প্রধান chords একটি আশ্চর্যজনক প্যাকেট পাওয়া।

আমি তখন সেগুলি ডাউনলোড করেছিলাম এবং এগুলিকে অডেসিটি ব্যবহার করে সম্পাদনা করেছিলাম যাতে নিশ্চিত করা যায় যে তাদের অধিকাংশই যখন রেকর্ড করা হচ্ছিল তখন শর্ট পজের পরিবর্তে শব্দটি অবিলম্বে শুরু হয়েছিল।

অদম্যতা ব্যবহার করে তাদের ক্লিপ করার জন্য, আমি কেবল তাদের অ্যাপে টেনে আনলাম তারপর আমি যে শব্দটি চাই তা বেছে নিলাম (পুরো avyেউয়ের অংশ এবং সমতল রেখার অংশগুলির কোনটিই নেই যার কোন শব্দ নেই)। আমি তারপর এডিট ট্যাব> বিশেষ সরান> ট্রিম অডিওতে যান। তারপর আমি ট্র্যাক ট্যাব পেয়েছিলাম> ট্র্যাক সারিবদ্ধ করুন> শূন্য থেকে শুরু করুন। আমি তারপর ফাইল, তারপর রপ্তানি> WAV হিসাবে রপ্তানি যান।

আমি WAV হিসাবে রপ্তানি করি কারণ আমি জাভাস্ক্রিপ্ট অডিও প্রকল্পে কাজ করা সহজ পেয়েছি।

আমি তখন এই ফাইলগুলি হোস্ট করার জন্য glitch.com ব্যবহার করেছি কারণ তাদের একটি আশ্চর্যজনক সামগ্রী বিতরণ নেটওয়ার্ক রয়েছে যা আপনার বিভিন্ন প্রকল্পের জন্য ব্যবহার করা যেতে পারে। আরেকটি বিকল্প হতে পারে ফায়ারবেস ব্যবহার করা যা বিভিন্ন প্রকল্পের জন্য আমার গোটো যা আমার কলেজের মেকারস্পেসের জন্য মেকারস্পেস ইনভেন্টরি অ্যাপের মতো আরও তথ্য সংরক্ষণ করতে পারে।

আপনাকে কেবল প্রকল্প ডিরেক্টরিতে সম্পদগুলি টেনে আনতে হবে এবং তারপরে আপনি যখন সম্পদ ফোল্ডারে ক্লিক করবেন এবং আপনি যে সম্পদটি পেতে চান তাতে ক্লিক করলে আপনি একটি লিঙ্ক খুঁজে পেতে পারেন। গ্লিচ তখন আপনার সম্পদের জন্য একটি অনন্য সিডিএন ইউআরএল তৈরি করবে। উদাহরণস্বরূপ, এখানে একটি প্রধান কর্ড শব্দের লিঙ্ক রয়েছে।

আমি তারপর একটি getChord ফাংশন এই সব chords একসঙ্গে লিঙ্ক করতে পারেন যে যখন fret অবস্থানের একটি নির্দিষ্ট সংমিশ্রণ চাপানো হয়েছে এবং তারপর একটি হ্যান্ড সোয়াইপ ঘটনা ঘটে যখন অ্যাপ্লিকেশন চালানোর জন্য একটি উপযুক্ত কর্ড বরাদ্দ করা হবে।

ধাপ 5: সমাপ্ত অ্যাপ্লিকেশন এবং সমাপ্তি

হোস্টিং সম্পর্কে যাওয়ার অনেক উপায় আছে।

সত্যি বলতে আমি যা পেয়েছি তা হল গিথুব ব্যবহার করা। এর কারণ হল যদি আপনি একটি অ্যাপ ভালভাবে প্রোগ্রাম করে থাকেন, তাহলে আপনি আপনার পুরো ব্যাক এন্ডকে ডাটাবেস বা ফায়ারবেস থেকে ফায়ারস্টোর দ্বারা পরিবেশন করতে পারেন অথবা এমনকি glitch.com থেকে CDN এবং অন্যান্য জায়গা থেকে সম্পদ সংরক্ষণের জন্য ব্যবহার করতে পারেন।

গিথুব -এ প্রকল্পটি হোস্ট করতে, আপনাকে যা করতে হবে তা হল একটি গিথুব অ্যাকাউন্ট খুলুন, একটি নতুন সংগ্রহস্থল তৈরি করুন। তারপরে সেট আপ করা আরও সহজ করার জন্য, আপনি আপনার প্রকল্পের নাম দেওয়ার পরে, সর্বদা একটি লাইসেন্স যুক্ত করতে ভুলবেন না (আমি একজন বিশেষজ্ঞ নই কিন্তু আমি খুঁজে পেয়েছি যে এটি আমার জীবনকে সহজ করে তোলে)। আমি সবসময় GNU এর মত একটি পাবলিক লাইসেন্স ব্যবহার করি।

একবার সংগ্রহস্থলটি সেট আপ হয়ে গেলে, আমরা কেবল আমাদের ফাইলগুলিকে সংগ্রহস্থলে টেনে আনতে পারি এবং নীচে সবুজ কমিট বোতামটি ক্লিক করতে পারি।

তারপরে আমরা স্টার এবং ওয়াচ বোতামের নীচে রিপোজিটরি পৃষ্ঠার ডানদিকে গিয়ার আইকন সহ সেটিংস ট্যাবে যাই। একবার সেটিংসে, নিচে স্ক্রোল করুন যতক্ষণ না আপনি Github Pages বক্সটি দেখতে পান। সোর্সকে মাস্টার শাখায় পরিবর্তন করুন এবং আপনি চাইলে একটি থিম বেছে নিন। আপনি থিমগুলিকে গুগল করে কীভাবে ব্যবহার করতে হয় তা শিখতে পারেন (আমি কখনই সেগুলি ব্যবহার করি না কারণ আমি প্রায়শই আমার নিজের CSS এবং থিম আইডিয়া নিয়ে আসি)।

যখন পৃষ্ঠাটি প্রস্তুত হয়ে যাবে, আপনি একটি সবুজ হাইলাইট পাবেন এবং আপনাকে বলবে যে আপনার সাইট প্রকাশিত হয়েছে এবং অ্যাক্সেস করা যাবে।

ধাপ 6: সম্পন্ন

আপনি এখন আপনার নিজের হেডফোন, বেডরুম বা ট্রেনে সান্ত্বনায় একটি দুর্দান্ত জ্যাম সেশন উপভোগ করতে পারেন। আপনি যদি চান তাহলে আরো কিছু chords যোগ করুন এবং এমনকি গিটার fret অবস্থানের সঙ্গে চারপাশে খেলা।

মোশন ডিটেকশনের একটি দ্রুত নোট

1. একটি গিটার ঝাঁকুনি সোয়াইপ জন্য থ্রেশহোল্ড script.js ফাইলে সামঞ্জস্য করা যেতে পারে কিন্তু নিশ্চিত করুন যে আপনি যখন অ্যাপ্লিকেশনটি ব্যবহার করছেন, আপনার ফোন যে ব্যাকগ্রাউন্ডটি দেখছে তা তুলনামূলকভাবে স্থির।

2. উদাহরণস্বরূপ, ট্রেনে, আপনার হেডফোন লাগানো এবং আপনার ফোনকে ভিতরের দিকে ঘুরিয়ে নেওয়া ভাল যাতে যাত্রীরা আপনার চারপাশে ঘুরতে থাকলে ফোনের ক্যামেরা শুধুমাত্র আপনার হাতটি বেশিরভাগ সময় নড়াচড়া করতে পারে।

3. আপনার হাতের থ্রেশহোল্ডের উপর নির্ভর করে ফোনটি হাত দিয়ে ধরে রাখা তুলনামূলকভাবে স্থির হওয়া প্রয়োজন। আমি মনে করি আমি একটি উচ্চ থ্রেশহোল্ড সহ কিছু পরীক্ষা চালাব এবং আরও নির্দিষ্ট হওয়ার জন্য সীমাগুলি আপডেট করব।

খেলতে:

আপনার ওয়েব ব্রাউজারে অ্যাপটি লোড করুন, তারপর এটি ল্যান্ডস্কেপ মোডে কাত করুন।

তারপর যখন আপনি আপনার হাত দোলাবেন, তখন একটি কর্ড বাজবে, তবে, যতক্ষণ না আপনি সর্বনিম্ন ডান কোণে F কী স্পর্শ করবেন ততক্ষণ এটি বাজতে থাকবে।

বিকল্পভাবে, আপনি একটি কর্ড সমন্বয় করে শব্দ বন্ধ করতে পারেন।

যখন আপনি একটি কর্ড সংমিশ্রণ করেন, বর্তমান শব্দটি থেমে যায়, তখন একটি নতুন কর্ড শব্দ নির্বাচন করা হয়।

ধাপ 7: শিখেছি এবং চূড়ান্ত শব্দ

আমি সত্যিই এই প্রকল্পে কাজ করতে পছন্দ করতাম এমনকি প্রোটোটাইপ করতে অনেক সময় লেগেছিল এবং অন্যান্য প্রজেক্ট এবং হোম ওয়ার্কে কাজ করার সময় অ্যাপটি তৈরি করা হয়েছিল। আমিও পথে বেশ কয়েকটি দুর্দান্ত জিনিস শিখেছি;

1. ডিজিটাল পণ্য ডিজাইন করার সময়, সর্বদা আপনার প্রোটোটাইপগুলিকে যত দ্রুত সম্ভব করতে ভুলবেন না কারণ আপনার প্রথম অনুমানগুলি ভুল হবে এবং শেষ পর্যন্ত পৌঁছানোর জন্য আপনাকে দ্রুত তা চালাতে হবে।

2. একটি প্রকল্পে যতটা সম্ভব অর্থ ব্যয় করা এড়িয়ে চলুন। আপনি যা পারেন তা সর্বদা পুনরায় ব্যবহার করুন এবং আপনার হাতে থাকা সহজ জিনিসগুলি দিয়ে সর্বদা শুরু করুন।

3. নতুন ভাষা, কাঠামো এবং সিস্টেম শিখতে ভয় পাবেন না। এগুলি প্রায়শই আপনি প্রথমে ভাবার চেয়ে সহজ।

এবং আমার স্বপ্নকে সত্যি করার জন্য লোনকোরিয়ানকে অসংখ্য ধন্যবাদ

যদি আপনি অ্যাপটি কীভাবে বিকাশ করতে আগ্রহী হন তবে আপনি আমাদের মেইলিং তালিকায় যোগ দিতে পারেন। একটি ছোট দল এবং আমি একটি সম্পূর্ণ সংস্করণ তৈরির জন্য কাজ করব যারা ভাঙা, ভ্রমণকারী বা ছোট বাচ্চাদের যেখানেই থাকুক না কেন তাদের একটি দুর্দান্ত পোর্টেবল গিটারের অ্যাক্সেস আছে।

আমরা সত্যিই কিছু সাহায্য চাই বিশেষ করে গ্রাফিক ডিজাইনার, গিটার প্লেয়ার এবং কোডারদের কাছ থেকে সবকিছু পরীক্ষা করে দেখার জন্য।

উপভোগ করুন (ﾉ ◕ ヮ ◕) ﾉ *: ･ ﾟ ✧ ･: *ヽ (◕ ヮ ◕ ヽ)