Antaramuka Mini-Multitouch: 8 Langkah

2024 Pengarang: John Day | [email protected]. Diubah suai terakhir: 2024-01-30 11:12

Instructable ini menunjukkan kepada anda bagaimana membuat antarmuka multitouch mini dari bahagian mudah yang boleh anda pesan dalam talian atau beli di kedai pembinaan / perkakasan biasa. Antaramuka multitouch adalah permukaan yang dapat mendaftarkan beberapa 'titik sentuhan' pada masa yang sama, yang bermaksud pengguna dapat menggunakan pergerakan tangan semula jadi untuk memanipulasi objek digital. Sebilangan besar sistem multitouch juga memproyeksikan gambar layar ke permukaan sentuhan, menjadikan interaksi lebih intuitif. Oleh kerana sistem multitouch besar dibina, instruksional ini mengajar anda bagaimana membina sistem multitouch yang lebih sederhana dan lebih kecil dengan harga $ 50-150 dengan menggunakan bahagian yang senang dicari. Mini-Multitouch. Mini-Multitouch berfungsi dengan prinsip yang sama dengan sistem yang lebih besar, dan berguna untuk semua jenis penggunaan hack-ish atau art-ish (fikirkan cat jari, muzik dengan sentuhan, atau interaksi berasaskan isyarat lain). Instructable ini sedang dihantar sebagai sebahagian daripada peraduan "Win a Laser Cutter" bagi pihak Make: Philly, dengan harapan kami dapat memulakan penciptaan ruang kerja komuniti baru kami dengan pengenalan pemotong laser baru yang berkilat:) Nikmati! Kesukaran: Pemula pertengahan (atau pemula yang berani). Memerlukan pengetahuan asas mengenai pematerian, penggunaan gergaji besi dan pisau utiliti, pemasangan perisian, dan mengikuti tutorial perisian. Memahami topik ini dan kesediaan untuk belajar akan membuat anda melalui Instructable ini! Masa Binaan: 8-10 jam untuk seorang pakar dalam topik di atas; 16-20 jam untuk pemula / pertengahan.

Langkah 1: Bahagian dan Penyediaan

Langkah pertama: dapatkan bahagian anda! Di bawah ini, anda akan mendapat cadangan di mana untuk membeli barang dari senarai bahan. Alat: gerudi tanpa besi dan gerudi bit pematerian besi Bahan T-Square: Webcam (Phillips SP900 Disyorkan) - Tersedia untuk pembelian di webWindows PC (maaf Atari, toolkit vvvv hanya untuk Windows.) Kanta inframerah 4.3 x 4.3 mm (aka nightvision) - Tersedia untuk pembelian di web Infrared LED (disyorkan SFH485) - tersedia dari digikey. Bekalan kuasa (output 3.3v DC pada 220mA disyorkan) - Paling banyak tersedia kedai hobi / kraf Tetap cepat gila glew (mana-mana jenama, dan dapatkan dengan berus botol) - Terdapat di kebanyakan kedai hobi / kraf kertas Amplas, 400 grit dan 800 grit - Terdapat di kedai perkakasanBass Polish - Terdapat di kedai perkakasan8 x 10 helai ketebalan standard Lexan (0.85) - Terdapat di kedai perkakasan Jalur 8ft "Tile Divider" - Terdapat di kedai perkakasan Kotak kadbod, setinggi sekurang-kurangnya 1.5 kaki di satu sisi (kami menggunakan 1.5 'x 1' x 1 ') - Tersedia di perkakasan menyimpan (atau hanya meletakkan sekitar!) Sebilangan kecil dawai. Sekiranya anda tidak memasang wayar, dapatkan gulungan kecil dawai 20 atau 22, baik berwarna merah dan hitam.- Terdapat di kebanyakan kedai elektronik / hobi

Langkah 2: Sediakan Kamera Web untuk Mengesan Cahaya Inframerah

Langkah ini menerangkan penyediaan kamera web yang digunakan untuk merakam gumpalan cahaya inframerah yang dipancarkan ketika anda menyentuh permukaan sentuhan. Paparan mini-sentuh ini bergantung pada empat lampu LED untuk menyinari cahaya ke lembaran Lexan, di mana ia akan melantun tanpa melarikan diri, kerana indeks pembiasan. Ini dipanggil Refleksi Dalaman Total. Apabila tekanan (seperti jari) digunakan pada Lexan, tekanan sedikit, mengubah indeks pembiasan, dan membiarkan cahaya keluar. Tempat di mana cahaya melarikan diri hanya di mana permukaannya dimampatkan, menjadikan gumpalan bercahaya yang bagus di mana ada sesuatu yang menekan Lexan. Di sinilah kamera web masuk! Anda dapat menonton gumpalan dengan kamera web, dan dengan perisian khas menggunakannya sebagai input ke dalam komputer anda, seperti tetikus atau papan kekunci. Untuk projek ini (dan kebanyakan paparan berbilang sentuhan) cahaya yang digunakan untuk pengesanan sentuhan berada dalam jarak inframerah dan kamera web mesti diubah suai untuk melihat dalam jarak inframerah. Ini dapat dilakukan dengan mudah dengan menukar lensa kamera web yang ada dengan lensa inframerah yang dapat 'melihat'. LED yang digunakan oleh antara muka mini-sentuh, pada frekuensi 880 nm, berada dalam jangkauan kamera pengawasan 'night vision'. Anda boleh menukar lensa kamera web yang ada dengan lensa 'night vision', dan anda akan bersedia untuk pergi. Sekiranya anda menggunakan SPC900NC yang disyorkan, anda boleh menggunakan lensa IR Kamera 4,3 MM x 4,3 MM. Cuba cari e-bay atau kedai kamera keselamatan tempatan. Sebelum melepaskan lensa yang ada pada kamera web anda, pasang perisian kamera web pada PC anda dan uji kamera web, untuk memastikan kamera berfungsi. Catatan: sangat penting untuk melakukan ini SEBELUM membatalkan jaminan anda dengan membukanya dan menukar lensa! Setelah berjaya mengambil beberapa gambar dan memastikan kamera web berfungsi dengan baik, anda sudah bersedia menukar lensa. Untuk mengganti lensa pada kamera SPC900 (atau kamera lain yang setanding), anda perlu terlebih dahulu melepaskan cincin di sekitar lensa menggunakan pemutar skru. Setelah cincin itu hilang, mudah untuk mengganti lensa biasa dengan lensa 'pengawasan' dengan melepaskan lensa dengan teliti (tetapi dengan kuat). Cincin itu hanya untuk penampilan, jadi anda boleh meletakkannya semula atau membiarkannya. JIKA anda menukar lensa, periksa kamera web untuk memastikan ia tetap berfungsi menggunakan perisian kamera web. Anda mungkin juga perlu menyesuaikan fokus lensa baru. Imej yang anda dapatkan dari kamera web tidak akan kelihatan seperti lensa biasa, ini hanya bermaksud ia berfungsi seperti yang diharapkan. Akhirnya, jika kamera mempunyai cahaya terpasang untuk menyinari apa yang difilemkan, tutup ringan dengan beberapa pita saluran untuk menyekatnya. Sekiranya tidak, ia akan menambahkan sedikit 'bunyi' cahaya dan akan menjadikan paparan anda mempunyai titik sentuhan 'hantu'.

Langkah 3: Bina Bingkai Permukaan Sentuh

Langkah ini merangkumi pembinaan bingkai yang akan menempatkan Lexan, serta persiapan yang diperlukan untuk memasang lampu LED di bingkai.

Bahan terbaik yang saya dapati untuk bingkai adalah 'Tile Divider', yang terdapat dalam jalur 6 hingga 8 kaki dan boleh dibeli di bahagian cetakan di kebanyakan kedai pembaikan rumah. Lihat gambar di bawah untuk penerangan visual (daripada cuba menerangkan di sini!). Bingkai akan sesuai dengan Lexan, jadi anda boleh memotong Tile Divider dengan ukuran yang tepat: potong dua jalur 8 inci, dan dua jalur 10 inci. Setelah jalur dipotong, anda harus menggunakan T-Square untuk memotong hujung jalur pendek untuk membongkok ke dalam pada sudut 45%. Ini akan menjadikan mereka pas dengan rapi dan pas sebagai bingkai di sekitar Lexan. Anda akan memasang empat lampu LED di satu sisi bingkai 8 inci. Mereka perlu dipasang sehingga mereka menyentuh Lexan melalui lubang di jalur, dan menyebar secara merata di sepanjang tepi. Penting untuk meletakkan lubang di dekat bahagian atas jalur, seperti yang ditunjukkan di bawah, supaya cahaya hanya menyinari tepi Lexan, dan TIDAK turun ke kamera di bawah. Tandakan lokasi keempat lubang itu kira-kira 1-inci, 3-inci, 5-inci dan 7-inci di sepanjang pinggir satu jalur Tile Divider 8-inci. Kerana Tile Divider terbuat dari plastik lembut, anda perlu mengebor lubang dalam beberapa ukuran tambahan untuk mengelakkan membengkokkan atau melengkung plastik terlalu banyak. Pertama, gerudi lubang kecil (1/16 "), kemudian gerudi lubang yang sedikit lebih besar (9/64"). Akhirnya, gerudi lubang 3/16 ", yang merupakan ukuran ideal untuk LED dipasang.

Langkah 4: Siapkan Permukaan Sentuh Lexan

Langkah ini merangkumi pengamplasan dan penggilap permukaan sentuh Lexan, untuk pengedaran cahaya maksimum.

Untuk mendapatkan cahaya yang paling banyak ke permukaan sentuhan, salah satu tepi permukaan sentuh Lexan 8 inci mesti dibuat sangat halus (di sinilah LED akan bersentuhan dengan permukaan sentuh). Sebaik-baiknya, anda akan menggunakan tiga bahan: kertas pasir 400 grit, kertas pasir 800 grit, dan cat tembaga. Sekiranya anda tidak mempunyai cat kuningan, anda boleh menggunakan kertas pasir 400 dan 800 grit, tetapi hasilnya akan kurang baik. Lipat sehelai kertas pasir 400 grit di atas sekeping kayu (atau bahkan buku kecil), dan jalankan bolak-balik tiga atau empat kali sepanjang satu permukaan sentuhan 8 inci Lexan. Anda mesti melihat serpihan putih kecil yang keluar. Ulangi ini dengan kertas pasir 800 grit. Selepas setiap pas dengan kertas pasir, anda akan dapat melihat bahawa calar dan noda di pinggir Lexan semakin kecil dan semakin kecil: ini menunjukkan bahawa anda melakukan pekerjaan yang betul (dan tidak begitu memberangsangkan!). Setelah mengorek noda dan lebam, gosokkan pinggir Lexan (hanya bahagian tepi!) Menggunakan cat tembaga anda (ikuti arahan pada bekas cat kuningan). Kagumi betapa halus dan berkilatnya tepi Lexan anda.

Langkah 5: Pasangkan Bingkai ke Permukaan Sentuh, Pasang LED

Langkah ini merangkumi pemasangan permukaan permukaan sentuh dan lampu LED Lexan ke dalam bingkai yang dibina dalam Langkah 3 dari Instructable ini.

Sebelum melekatkan bingkai secara tetap ke Lexan, periksa untuk memastikan bingkai sesuai dengan permukaan sentuh Lexan 8-inci dengan 10-inci dengan meluncurkan jalur Pembahagi Ubin (dari Langkah 3) ke tepi permukaan sentuh: ia harus sesuai dan sesuai bingkai baru yang gembira. Juga, periksa untuk memastikan bahawa tidak ada burr plastik yang tersisa di Tile Divider daripada menggerudi lubang LED, kerana ini dapat membuat bingkai tidak sesuai. Setelah anda memeriksa kesesuaiannya, sudah tiba masanya untuk melekatkan bingkai dan Lexan menjadi satu unit. Tanggalkan bingkai Tile Divider, dan kupas penutup pelindung ke belakang sekitar satu inci dari tepi Lexan, berhati-hati untuk tidak melepaskannya sepenuhnya. Kemudian, luncurkan bingkai kembali ke Lexan, tanpa penutup di antara keduanya. Pastikan bahagian bingkai yang mempunyai lubang LED diletakkan di tepi Lexan yang digilap dengan halus! Apabila semua sisi bingkai disesuaikan dengan keinginan anda, gunakan gam yang gila (atau gam apa pun) untuk merekatkan sudut bingkai antara satu sama lain. Cuba lekatkan bahagian bingkai antara satu sama lain bukan ke Lexan. Sekiranya terdapat lekapan pada Lexan, itu bukan masalah besar dan tidak boleh mempengaruhi permukaan sentuh anda. Sekarang bingkai dipasang ke Lexan, sudah tiba masanya untuk memasang LED ke bingkai. Sebelum melekatkan LED secara kekal melalui lubang di bingkai) cubalah beberapa ujian untuk memastikan anda meletakkannya dengan betul. Untuk 'gumpalan' berkualiti terbaik, LED tidak boleh menghadap lurus ke pinggir Lexan, mereka mesti dipasang pada sudut sedikit ke tepi Lexan: sekitar 20-30 darjah sudut mendatar (lihat gambar untuk lebih banyak lagi perincian). Sudut akan membantu menjadikan cahaya melarikan diri di mana Lexan dimampatkan lebih terang dan lebih jelas. Untuk meletakkan LED untuk pendawaian yang lebih mudah di kemudian hari: pastikan untuk memasang semua LED sehingga dipusingkan agar pin ground (pin yang lebih panjang) berada di atas. Setelah anda berpuas hati dengan sudut dan kedudukan LED, pasangkannya secara tetap di bingkai dengan menahan LED di tempatnya dan gunakan gam gila di bahagian luar LED di mana ia menyentuh bingkai. Pegang LED tersebut di tempat sehingga kering sepenuhnya! (Inilah sebabnya mengapa kami mengesyorkan menggunakan gam gila). Sekarang LED sudah siap, sudah tiba masanya untuk mula melakukan pendawaian.

Langkah 6: Pendawaian LED

Bahagian ini merangkumi semua pendawaian yang harus anda lakukan, dan meliputi penyambungan LED ke sumber kuasa.

Kami mengesyorkan menggunakan LED 1.5 V 100 mA, dan untuk tujuan Instruksional ini anggap anda menggunakan bekalan kuasa DC 200mA 3.3V DC (seperti 'wall wort' atau bekalan kuasa hobi). Anda mungkin perlu menyesuaikan pendawaian LED anda berdasarkan bekalan kuasa apa yang anda ada - periksa dengan seseorang yang biasa dengan elektronik jika anda tidak pasti cara menyesuaikan pendawaian anda. Memasukkan LED bersama seperti yang ditunjukkan pada gambar di bawah ini … jika anda memerlukan latihan dengan pematerian, lakukan ujian menggunakan beberapa LED yang TIDAK terpaku pada bingkai. Untuk menguji pendawaian LED, sambungkan bekalan kuasa dan arahkan ke arah kamera web (disaring IR). Jalankan perisian kamera web anda: jika kamera web mengambil cahaya inframerah, anda akan melihat lampu merah terang pada paparan kamera web (walaupun anda tidak akan melihat cahaya yang datang dari LED itu sendiri, kerana ia inframerah!). Sekarang kembali ke paparan multitouch mini. Sebaik sahaja anda memasang LED menggunakan besi pematerian anda (mengikut rajah di bawah), arahkan kamera web yang disaring IR di kotak mini-sentuh dari atas. Jalankan perisian kamera web anda sekarang jika anda belum menggunakannya: anda akan melihat cahaya pada paparan kamera web, di sepanjang bingkai ketika LED inframerah dipasang (tetapi, sekali lagi, anda tidak akan melihat cahaya dari LED sebenar!). Sekiranya anda tidak dapat melihat cahaya, anda perlu memeriksa pendawaian anda, dan mungkin berkonsultasi dengan seseorang yang biasa dengan elektronik jika anda tidak pasti bagaimana memperbaiki penyambungan LED. Catatan ringkas: cahaya yang dijelaskan di atas adalah kebocoran cahaya, dan tidak diingini: kami akan mengurusnya pada langkah seterusnya sehingga satu-satunya cahaya inframerah yang dipancarkan dari permukaan sentuh adalah cahaya yang datang dari menyentuhnya. Tetapi, buat masa ini, ini adalah kaedah yang baik untuk memeriksa bahawa LED anda dipasang dengan betul. Anda hampir mempunyai paparan multitouch mini!

Langkah 7: Selesaikan Permukaan Sentuh, Letakkan Kamera Web

Ini adalah langkah terakhir dalam pembuatan perkakasan. Sebilangan cahaya dari LED cenderung menyala ke atas dan ke bawah dan bukannya terus ke Lexan, dan cahaya tambahan (kebocoran cahaya) boleh menyebabkan masalah. Lampu tambahan ini dapat memantul objek berdekatan seperti dinding, layar, siling, dll., Mewujudkan kawasan cahaya inframerah yang akan muncul di paparan kamera web anda sebagai titik sentuhan palsu. Cara terbaik untuk mengatasi masalah ini adalah dengan menambahkan sedikit bahan legap di atas dan di bawah permukaan permukaan sentuh Lexan untuk menyekat cahaya dan cahaya bawah ini. Potong tikar bingkai 8-inci dengan 10-inci yang rata dari kadbod, setebal kira-kira 1-inci dan berukuran agar sesuai tepat di bawah permukaan sentuhan. Dimensi dalam tikar ini mestilah 6 x 8 inci, menjadikannya pada dasarnya perbatasan segi empat tepat setebal 1 inci yang sesuai dengan ruang tepat di bawah Lexan. Sekiranya petunjuk arah ini tidak jelas, lihat gambar rajah yang diperluas dalam Langkah 5, yang merangkumi lukisan tikar kadbod ini. Ini akan mengatasi cahaya bawah. Ulangi proses di bahagian atas permukaan sentuh untuk menyekat cahaya. Sekiranya anda mempunyai masa, kelihatan lebih profesional untuk menggunakan sesuatu yang lebih baik (seperti cetakan tepi lantai atau siling) untuk penyekat cahaya, tetapi kami hanya menggunakan tikar kadbod kedua dan ia berfungsi dengan baik! Pada ketika ini, anda mempunyai sandwic permukaan sentuh, dengan Lexan dan bingkai di tengahnya, dan penyekat up-glow dan down-glow di bahagian atas dan bawah, pas di tempatnya dan dipegang oleh gam gila jika dikehendaki. persediaan perkakasan anda, anda hanya perlu meletakkan kamera web. Ia perlu duduk kira-kira 1,5 hingga 2 kaki dari permukaan sentuhan, menunjuk ke sisi 'bawah' Lexan (mis. Sisi tidak disentuh). Anda boleh mencapainya dengan menggunakan kotak kadbod. Berdiri kotak sehingga tingginya 1.5 hingga 2 kaki (sebelah mana anda berdiri bergantung pada seberapa besar kotak anda). Kamera web anda akan berada di dalam kotak, dan permukaan sentuh anda akan berada di atas kotak, jadi anda perlu memotong lubang di bahagian atas kotak yang kira-kira ukuran dan bentuk bahagian Lexan yang terdedah (hanya bahagian terdedah, bukan keseluruhan bingkai!). Lihat gambar di bawah untuk contoh visual. Jalankan kabel kamera web di luar kotak, tetapkan skrin sentuh di atas, dan kagumi keindahan penyediaan perkakasan anda yang lengkap! Sekarang anda boleh mengupas lapisan pelindung Lexan, jika anda belum melakukannya. Tahniah! Anda telah menyelesaikan perkakasan untuk Mini-Multitouch anda! Sekiranya anda menjalankan perisian kamera web, anda seharusnya dapat melihat permukaan sentuhan menyala di mana anda menekannya, idealnya dengan jari anda. Pada langkah terakhir: perisian.

Langkah 8: Sediakan Vvvv Toolkit dan Main

Langkah terakhir ini menerangkan penyediaan perisian yang digunakan untuk berinteraksi dengan paparan multitouch anda. Kini tiba masanya untuk mula menggunakan sistem mini multitouch baru anda! Cara paling mudah untuk memulakannya adalah dengan bekerja menggunakan alat grafik 'vvvv'. Kit alat vvvv tersedia secara percuma, untuk kegunaan bukan komersial. Sayangnya, kerana berdasarkan perisian DirectX Microsoft (untuk kelajuan), vvvv hanya tersedia untuk Windows. Mohon maaf! Untuk mendapatkan salinan kit alat vvvv, pergi ke halaman muat turun vvvv vvvv dan buka zip pakej ke direktori pilihan anda (saya cadangkan c: / Program Files / vvvv sebagai tempat pengawas).vvvv tidak mempunyai program pemasangan atau persediaan, anda hanya menjalankan vvvv.exe apabila anda ingin menjalankan vvvv. Anda akan melihat demo pokok yang bergoyang secara lalai semasa menjalankan vvvv - di sinilah anda dapat melancarkan tutorial dan mengetahui apa yang vvvv mampu, dan untuk apa ia dapat digunakan. Kami mengesyorkan bermula dengan tutorial ini! Dan, sedikit nasihat penyelesaian masalah: jika anda mendapat 'dll kesalahan' semasa anda cuba menjalankan vvvv.exe, anda mungkin perlu menaik taraf DirectX pada mesin anda ke versi 9.0c atau yang lebih baru. Sebaik sahaja anda menjalani tutorial vvvv, ikuti pautan di bawah dan lakukan dua tutorial vvvv pertama (pendek) sebelum meneruskan. Pengenalan Tutorial vvvv dan Tutorial Hello World akan mengajar anda sebahagian besar kemahiran asas yang anda perlukan untuk menggunakan vvvv, dan sangat disyorkan. Sebaik sahaja anda menjalankan kedua-dua tutorial tersebut, anda mempunyai satu langkah terakhir sebelum mengalami sihir mini-sentuhan! Sudah tiba masanya untuk memeriksa bahawa kamera web anda berfungsi dengan vvvv. Anda boleh menguji sama ada vvvv secara automatik mengesan kamera web anda menggunakan Tutorial Videovvvv. Tutorial ini dilengkapi dengan arahan bagaimana menguji kamera web anda di vvvv: ikuti arahan ini! Sebelum melangkah ke langkah terakhir, gunakan VideoIn Tutorial untuk memastikan bahawa anda mendapat gambar dan kamera anda umumnya berfungsi dengan vvvv dengan betul. Sekiranya kamera anda tidak berfungsi dengan vvvv, pergi ke forum vvvv dan dapatkan bantuan dengan penyediaan dan konfigurasi. Sekiranya anda berjaya melakukannya, anda akhirnya mempunyai semua bahagian yang berfungsi, dibina dan dipasang: sudah waktunya untuk pembayaran. Muat turun fail Touch_demo_3.v4p dan robot_image-j.webp