Étagère d'affichage liée à Steam : 18 étapes (avec photos)

2024 Auteur: John Day | [email protected]. Dernière modifié: 2024-01-30 09:07

Passé

Mon frère a des figurines Funko POP qui représentent ses personnages que ses amis jouent le plus souvent dans les jeux vidéo. Nous avons pensé que ce serait cool s'ils avaient une vitrine qui aurait des LED pour représenter leur statut sur Steam. Donc, avec mon expérience précédente avec Arduino, Steam API et le travail du bois, j'ai dit que je pourrais probablement comprendre quelque chose.

Pour tous ceux qui ne savent pas ce qu'est Steam, Steam est une plate-forme de distribution numérique développée par Valve Corporation pour acheter et jouer à des jeux vidéo avec un système de communication intégré. Steam a également la possibilité de permettre aux utilisateurs de voir ce que les autres jouent, si la personne est sur leur ordinateur, absente, en jeu, etc., il vous permet même de jouer avec eux si vous le souhaitez.

Caractéristiques / Conception

Une fois que nous avons décidé que nous allions faire ce projet, je me suis assis et j'ai commencé à écrire quelques fonctionnalités que je savais que cela aurait besoin d'avoir.

• Configuration/connexion Wi-Fi sans fil comme un Chromecast.
• Variateur / interrupteur marche-arrêt.
• LED désamorcées.
• Modes LED d'état.
• Aucun entretien après l'installation et la construction.
• Les figurines POP doivent s'asseoir sur/dans.
• Ne doit pas être gourmand en énergie.

Après avoir décidé de ce que le projet devait inclure, mon frère et moi avons commencé à revoir les conceptions jusqu'à ce que nous obtenions ce que nous avons maintenant.

Une note importante

La conception originale était une boîte à plusieurs niveaux. Cependant, une fois que nous avons construit les deux bases, nous avons pensé que cela aurait l'air mieux comme une longue étagère au lieu d'une boîte à plusieurs niveaux. Je vais faire de mon mieux pour expliquer comment nous l'aurions construit si nous avions commencé avec le nouveau design, donc si vous remarquez sur certaines des images que nous avons des pièces de tailles légèrement différentes, c'est la raison.

Étape 1: Matériaux

Électronique

• NodeMCU V1.0 ESP8266 (Lien)
• Câble USB 2.0 A-Mâle vers Micro B (Pour la programmation)
• Fil de silicone de calibre 22 10 pi (lien)
• Gaine tressée extensible de 1/8 po 10 pi (lien)
• Prise CC à montage sur panneau (lien)
• Alimentation 5V 2 A CC (Lien)
• Boîte de projet (Lien)
• Potentiomètre (Lien)
• Soudure (à peu près n'importe quelle soudure électrique fonctionnera)
• Fil de projet 22 AWG (Lien)
• Bande LED (Lien)

Projet Bois (Home Depot voir photos)

• 1 Chêne 0,25" X 1,5" X 48"
• 1 Chêne.5" X 1.5" X 48"
• 2 Chêne 0,25" X 5,5" X 48"
• 1 feuille de polycarbonate 8" X 10"

Notez qu'une carte de 0,5" X 5,5" X 48" est montrée dans les images mais n'est pas utilisée dans le projet.

Assemblée

• 2 Tubes d'époxy en deux parties (Home Depot)
• Colle à bois (Home Depot)
• Aimants.315" Dia X.118" Thk (Home Depot) (Optionnel)
• Teinture ébène (Home Depot) (En option)
• Pulvériser du polyuréthane (si taché)
• Bande de peintres

Étape 2: Outils

Ce sont les outils que nous avons utilisés

• Banc de scie
• Scie à bras radial
• Pinces
• Ponceuse à bande
• Scie à ruban
• Pistolet à colle chaude
• Ciseaux
• Fer à souder
• Pince à dénuder
• Perceuse électrique
• Perceuse
• Papier de verre
• Mètre à ruban
• Déposer

Bien que nous ayons utilisé ces outils, cela ne signifie pas que vous devez utiliser ces outils exacts. Cela ne vous aiderait pas à pas si vous cherchez à répliquer directement le projet. Par exemple, la scie à ruban pourrait remplacer une scie sauteuse, une scie à chantourner, une scie à main, etc.

Étape 3: Construire la boîte de projet

1. Tout d'abord, percez un trou dans la boîte de projet de n'importe quel côté que vous souhaitez être à l'avant, ce sera pour le potentiomètre de gradation. Nous avons percé ce trou sur le petit côté en plein milieu. Si vous utilisez le potentiomètre répertorié dans la liste des pièces, la meilleure perceuse que nous avons trouvée à utiliser pour cela était 17/64 (Photo 1).
2. Deuxièmement, percez un trou à l'arrière pour les fils qui iront à l'étagère, en regardant la boîte de l'avant, nous avons mis ce trou à l'arrière à gauche, nous avons trouvé que la perceuse 3/16 fonctionnait mieux pour cela mais c'était un ajustement serré.
3. Ensuite, percez un trou à l'arrière pour notre prise d'alimentation CC, nous la mettons à l'arrière à droite. Si vous utilisez la prise d'alimentation dans la liste des pièces, la meilleure perceuse pour cela était une 5/16. (Photo 2)
4. Après cela, percez un trou à l'arrière pour le bouton de réinitialisation (ce bouton exact n'est pas répertorié car nous l'avons sorti de notre boîtier Arduino), nous le mettons juste à côté de la prise d'alimentation.
5. Avant d'assembler la boîte de projet, nous avons limé la languette du potentiomètre car nous pouvons serrer le potentiomètre suffisamment pour que nous n'en ayons pas besoin.
6. Enfin, placez toutes les pièces dans leurs trous respectifs et serrez-les. (Photo 3)

Étape 4: Électricité

Tout en faisant l'électricité, il vaut peut-être mieux suivre le schéma (image 4).

1. Coupez la gaine tressée à 9' 8'. Si vous n'avez pas besoin de toute la longueur ou si vous avez besoin de plus de fil, coupez seulement la gaine de 4 pouces de moins que la longueur du fil (cela nous permettra d'avoir le fil suspendu aux extrémités pour souder à l'intérieur de la boîte du projet et dans l'étagère).
2. Tenez les 3 brins de fil 22 AWG dans votre main afin qu'ils forment une sorte de triangle et enveloppez-les avec du ruban électrique.
3. Faites passer les 3 brins de fil 22 AWG à travers la gaine tressée (extrémité du ruban électrique en premier) en laissant environ 2 pouces de fil à chaque extrémité, cela peut être difficile, mais nous avons dû faire passer le fil tout le long. (Image 1)
4. Insérez le fil dans le trou de fil sur la boîte de projet de sorte que la gaine tressée soit légèrement à l'intérieur de la boîte de projet, puis collez à chaud les fils autour du trou pour éviter qu'ils ne soient retirés. (Photo 2)
5. Dénudez l'extrémité du fil rouge sur environ 1/4 de pouce, puis soudez-le à la branche la plus courte de la prise d'alimentation CC.
6. Dénudez l'extrémité du fil noir sur environ 1/4 de pouce, puis soudez-le à la branche la plus longue de la prise d'alimentation CC.
7. Placez l'ESP8266 à l'intérieur de la boîte de projet (à utiliser pour l'espacement).
8. Dénudez l'extrémité du fil blanc sur environ 1/4 de pouce, puis soudez-le à la broche D4 de l'ESP8266
9. Coupez 2 morceaux de fil de projet rouge et noir pour aller de la prise d'alimentation à la broche Vin et à la broche GND.
10. Soudez les deux comme nous l'avons fait avec les deux autres fils rouge et noir à la prise d'alimentation, puis soudez le noir à la broche GND et le rouge à la broche Vin.
11. Coupez 3 morceaux de fil de projet rouge, noir et jaune pour aller de l'ESP8266 au potentiomètre.
12. Dénudez l'extrémité des 3 fils à environ 1/4 po.
13. Soudez ces trois morceaux de fil comme indiqué sur le schéma au potentiomètre avec le noir connecté à une broche GND, le rouge à la broche 3.3V et le jaune à la broche A0
14. Coupez 2 autres morceaux de noir et jaune.
15. Dénudez chaque extrémité des 2 fils à environ 1/4 po.
16. Soudez-les aux pattes séparées du bouton de réinitialisation, puis le fil noir à la broche GND et le fil jaune à la broche D3.

Avec tout cela, tout devrait figurer sur le schéma électrique montré sur les images, à l'exception des LED, car celles-ci n'ont pas encore été coupées ou soudées.

Étape 5: Couper le bois

1. Coupez la planche de chêne 0,5" X 1,5" X 48" en deux dans le sens de la longueur de sorte qu'il y ait deux morceaux d'environ 0,5" X 0,75" X 48".
2. Coupez les deux moitiés de l'étape 1 pour qu'elles mesurent 0,5" X 0,75" X 44". Celles-ci serviront de dos et de support de led à l'intérieur de l'étagère.
3. Coupez la planche de 0,25" X 1,5" X 48" en deux dans le sens de la longueur de sorte qu'il y ait deux morceaux d'environ 0,25" X 0,75" X 48".
4. Coupez les deux moitiés de l'étape 3 de manière à ce qu'elles mesurent 0,25" X 0,75" X 44". Celles-ci serviront de façade qui prendra en sandwich une feuille de polycarbonate.
5. Coupez les deux planches de 0,25" X 5,5" X 48" à 0,25" X 5,5" X 44" (conservez la ferraille). Ceux-ci serviront de haut et de bas de l'étagère.
6. Récupérez la ferraille de l'étape 5 (la ferraille doit mesurer environ 0,25" X 5,5" X 4"). Coupez deux morceaux de 0,25" X 5,5" X 1 1/8" dans la ferraille. Ces deux pièces seront les embouts de l'étagère.

Étape 6: Couper le polycarbonate

1. Coupez le polycarbonate de 8" X 10" à 5,5" X 10"
2. Coupez le polycarbonate en 8 bandes de 5,5" X 3/4".

Nous avons coupé le polycarbonate sur une scie à ruban mais cela pourrait être fait avec une scie sauteuse ou même une scie à table.

Étape 7: Collez (Partie 1)

Avant le collage nous avons poncé chacune de nos bandes de polycarbonate sur la ponceuse à bande pour leur donner une finition transparente mate cela peut aussi être fait juste avec du papier de verre. Après avoir coupé et poncé toutes les pièces en polycarbonate, nous pouvons coller le devant de l'étagère. Si vous n'avez pas de ponceuse à bande, vous voudrez peut-être faire attention à cette partie afin de ne pas avoir d'époxy sur le devant et de gâcher la finition mate transparente.

1. Disposez l'une des pièces de 0,25" X 0,75" X 44".
2. Posez chacune des bandes de polycarbonate sur le dessus pour vous assurer qu'elles s'adaptent toutes avant le collage.
3. Mélangez une grande quantité d'époxy (cela sera utilisé sur le dessus d'une planche et sur le dessous de l'autre, assurez-vous d'en faire assez).
4. Appliquez de l'époxy sur le dessus du panneau de 0,25" X 0,75" X 44".
5. Posez les 8 bandes de polycarbonate sur le dessus de la planche.
6. Appliquez de l'époxy sur les bandes de polycarbonate.
7. Posez l'autre planche de 0,25" X 0,75" X 44" sur le dessus et sandwich avec de nombreuses pinces.

Étape 8: Collez (Partie 2)

En attendant que le devant durcisse, nous collerons le dos. Le dos sera composé d'une pièce de 0,5" X 3/4" X 44" avec des entretoises en polycarbonate qui serviront d'évent.

1. Couper les restes de polycarbonate en 8 bandes d'environ 3/4" X 3".
2. Mélangez une flaque d'époxy de taille moyenne.
3. Utilisez de l'époxy pour coller les 8 bandes de polycarbonate sur le côté de 3/4" de large de l'une des planches de 0,5" X 3/4" X 44", espacées uniformément sur toute la longueur. La planche mesurera désormais.593" X 3/4" X 44".
4. Fixez les bandes de polycarbonate au bois jusqu'à ce que l'époxy sèche.

Étape 9: ponçage

Une fois que le panneau avant (le polycarbonate pris en sandwich entre le bois) a fini de durcir (voir le conteneur époxy pour le temps), poncez les deux côtés de sorte qu'il y ait une surface lisse et sans époxy. Une fois le dos durci, nous pouvons également le poncer pour éliminer tout excès d'époxyde.

Étape 10: Collez (Partie 3)

Maintenant que nous avons nos planches avant et arrière, nous pouvons les coller à notre base (0,25" X 5,5" X 44").

1. Utilisez une fine colle à bois pour coller la planche avant contre le bord avant de la base (0,25" X 5,5" X 44").
2. Utilisez une fine colle à bois pour coller le panneau arrière contre le bord arrière de la base (0,25" X 5,5" X 44").
3. Utilisez des pinces pour serrer les deux planches en place.

Étape 11: Barre LED

1. Coupez la bande led en tronçons de 3 pixels (Photo 1).
2. Soudé les bandes ensemble en utilisant le fil du projet pour les aligner au milieu de chaque section de polycarbonate (Photo 2)
3. Collez à chaud la longue bande au deuxième morceau de bois de 0,5" X 3/4" X 44"
4. Percez un trou de 3/16 dans l'un des embouts d'environ 1 po dans la pièce (Photo 5).
5. Poussez le fil tressé à travers le trou, collez-le à chaud en place et soudez les fils aux plots respectifs (noir à GND, rouge à 5V, jaune à DI), cela peut également être vu dans le schéma de câblage électrique.
6. Mettez un mince cordon de colle sur le bas de la barre LED et fixez-le au fond de sorte qu'il se trouve à environ 1/2 pouce de la carte avant pour aider à désamorcer les LED (image 6).
7. Percez des trous pilotes dans les deux embouts dans le panneau arrière et la barre LED, puis fraisez les trous et insérez des vis à cloison sèche de 1 pouce pour maintenir les extrémités (photo 5).

Étape 12: Configuration du logiciel Arduino

La puce ESP8266 est largement disponible et a un faible coût, elle a des fonctionnalités pour héberger des serveurs Web, faire des demandes aux serveurs Web et bien d'autres choses qui vous permettront de connecter votre projet Arduino à Internet. Afin de programmer l'ESP8266, vous devez d'abord avoir installé l'IDE Arduino à partir du site Web Arduino.

1. Ouvrez l'IDE Arduino.
2. Allez dans Préférences qui se trouvent sous l'onglet Fichier en haut de la fenêtre (Image 1).
3. Descendez dans « URL de gestion de cartes supplémentaires: » et insérez ce lien « https://arduino.esp8266.com/stable/package_esp8266com_index.json » (Image 2).
4. Cliquez sur OK
5. Allez dans le menu des outils et allez dans le tableau puis dans le gestionnaire de tableaux… (Image 3).
6. Recherchez "ESP", la deuxième option qui devrait apparaître devrait être "esp8266 by ESP8266 Community", changez la version en version 2.5.0 et cliquez sur installer. (Photo 4)
7. Une fois l'installation terminée, cliquez sur Fermer.
8. Retournez au menu des outils, allez à la carte, sélectionnez NodeMCU 1.0 (module ESP-12E) (image 5)
9. Dans le menu Outils, faites en sorte que toutes les options ressemblent à l'image 6.
10. Téléchargez les fichiers joints à cette étape pour la bibliothèque de connexion automatique et de liste simple.
11. De retour dans l'IDE Arduino, accédez au menu Sketch, Inclure la bibliothèque, cliquez sur Ajouter une bibliothèque. ZIP…, puis accédez au fichier AutoConnect.zip que vous venez de télécharger.
12. Répétez l'étape 11, mais sélectionnez SimpleList.zip au lieu d'AutoConnect.zip. (Photo 7)
13. Allez dans Inclure la bibliothèque dans l'onglet Esquisse et cliquez sur Gérer les bibliothèques… (Image 8).
14. Recherchez PageBuilder et installez-le (Image 9).
15. Recherchez ArduinoJson, changez la version en version 5.13.5 et installez-la (image 10).
16. Recherchez Neopixel, sélectionnez la 3ème option et installez-la (Image 11).

Étape 13: Programmation

Maintenant que l'IDE Arduino est configuré, nous pouvons commencer la programmation.

1. Téléchargez le code du projet joint à cette étape.
2. Ouvrez le fichier dans l'IDE Arduino.
3. Connectez l'ESP8266 à votre ordinateur à l'aide d'un câble Micro USB
4. En haut du fichier, vous verrez "String STEAM_KEY = "XXXXXXXXXXXXXXXX"; // Votre clé steam de l'API steam." vous devez remplacer "XXXXXXXXXXXXXXXX" par la clé Steam que vous pouvez récupérer à partir de ce lien si vous n'avez pas de domaine à saisir, entrez simplement "127.0.0.1" comme domaine.
5. À ce stade, si vous avez apporté des modifications à la conception, par exemple en ajoutant plus ou moins de LED, vous pouvez modifier certains des paramètres du code en haut. Il contient des commentaires pour vous aider dans ces modifications.
6. Allez dans Outils, puis allez au port et sélectionnez la seule option disponible (s'il y a plus d'une option, débranchez l'esp8266 et rouvrez le menu des outils et allez au port et voyez ce qui a disparu puis rebranchez-le et voyez ce que l'on est revenu et sélectionnez celui-là) (Image 1).
7. Une fois le port sélectionné, vous pouvez cliquer sur le bouton de téléchargement en haut à gauche (image 2).
8. Une fois le téléchargement terminé, vous devriez voir le démarrage de l'Arduino (les voyants auront un voyant bleu qui rebondit, attendez qu'il devienne violet si vous ne voyez aucun voyant lorsque vous avez fait quelque chose de mal dans les étapes) à ce stade, vous savez que tout fonctionne correctement.
9. Débranchez l'esp8266 du câble micro USB et branchez l'alimentation 5v dans la prise dc à l'arrière et vérifiez que les LED et le gradateur fonctionnent.

Étape 14: mettre le haut

À ce stade, vous avez le choix entre plusieurs façons de monter le couvercle, à la fin, nous l'avons mis avec des vis à cloison sèche 3/4 que nous avons percées et fraisées. Il est également possible de le coller avec de la colle à bois sur la barre avant et de l'époxy sur les entretoises arrière en polycarbonate.

Nous avons teint avant cette étape, mais cela aurait dû être fait avant la coloration.

Étape 15: coloration

Nous avons choisi de teindre notre étagère avec une teinture d'ébène et d'appliquer du polyuréthane pour protéger l'étagère. Si vous choisissez de teindre ou de peindre votre étagère, vous devez d'abord couper du ruban de peintre pour couvrir le polycarbonate sur la barre avant afin de ne pas le recouvrir. En dehors de cela, il n'y avait pas d'étapes spéciales pour la coloration, mais pour suivre les étapes sur la boîte.

Étape 16: Configuration

1. Branchez l'étagère là où vous souhaitez la laisser.
2. Accédez à votre téléphone ou à n'importe quel ordinateur doté d'une capacité Wi-Fi.
3. Recherchez un signal wifi nommé Steam-Status-Hub (Photo 1) et connectez-vous.
4. Une fois connecté, votre appareil vous indiquera que le wifi veut que vous vous connectiez pour obtenir Internet, mais c'est vraiment notre méthode de configuration du projet (Photo 2).
5. Lorsque vous cliquez sur la fenêtre contextuelle indiquant que vous devez vous connecter, vous verrez quelque chose comme l'image 3.
6. Cliquez sur les trois lignes dans le coin supérieur droit.
7. Cliquez sur les identifiants Steam et entrez les identifiants Steam 64 de l'ami que vous souhaitez afficher, assurez-vous d'appuyer sur le bouton d'envoi après avoir entré tous les identifiants. Notez que le premier identifiant apparaîtra le plus proche de l'esp8266 dans le câblage, puis le second, etc. (SteamID64s peut être trouvé à partir de ce lien).
8. Cliquez sur les trois lignes dans le coin supérieur droit.
9. Cliquez sur Ajouter un nouveau point d'accès et entrez vos informations wifi et cliquez sur Appliquer.
10. Après avoir cliqué sur Appliquer, vous serez redirigé vers votre écran wifi et votre étagère liée à Steam devrait afficher le statut de vos amis après une minute.

Étape 17: Fonctionnalités

Maintenant, il y a beaucoup de fonctionnalités que je n'ai pas abordées dans ce Instructables telles que le bouton de réinitialisation que je vais énumérer ici.

• Si le bouton de réinitialisation est maintenu enfoncé pendant 5 secondes, il supprimera les anciennes données wifi et redémarrera avec un point d'accès comme il l'a fait lors de la configuration.
• Les LED ont plusieurs modes d'état pour afficher les erreurs, par exemple, les LED clignoteront en violet lorsqu'il ne peut pas se connecter au wifi et vous devez le réinitialiser, les LED clignoteront en cyan s'il y a un problème pour récupérer les informations pour le id qui a été entré, les LED clignoteront en jaune s'il y avait un problème avec le réseau ou si la clé API Steam qui a été entrée est mauvaise.

Les LED ont plusieurs couleurs pour représenter l'état de la vapeur d'une personne

• Rouge = Occupé.
• Jaune = Absent.
• Vert = En jeu.
• Bleu = en ligne.
• Orange = Sommeil.
• Cyan = Vous cherchez à échanger.
• Violet = Vous cherchez à jouer.

Étape 18: Conclusion

L'étagère liée à Steam continuera d'être une utilisation quotidienne de mon frère. Tout au long de ce projet, j'ai appris bien plus que ce que je savais sur Arduino et le travail du bois et je continuerai à utiliser ces nouvelles connaissances sur mes prochains projets. En repensant à ce que j'ai créé, j'ai réalisé qu'une partie du design aurait pu être modifiée et j'ai fait de mon mieux pour expliquer ce que nous aurions fait si nous l'avions fait. Au cours des deux prochaines semaines, je chercherai toujours à travailler sur le code de ce projet et à le maintenir à jour. S'il vous plaît laissez-moi savoir si vous avez des questions ou des problèmes au sujet de cette instructable et je ferai de mon mieux pour vous aider.