Sorry that I haven’t been keeping tabs on this project for a long time, but I finally fixed the problems! After salvaging the parts from my mistake last time, I prototyped with a breadboard, where I realized that the problem wasn’t with the hardware, but with the software. Turns out I designated the wrong GPIO pins to the components on the PCB. After figuring that out, I soldered everything onto a spare PCB, put it in my 3D printed case, plugged it in, and it now works! The volume control and keys work, although the functions are a bit funky, but sadly, I couldn’t salvage the OLED, and so there is an empty green space in that area. Other than that, it looks amazing!
So I recently got the materials for my hackpad, which was nice, and I immediately got to work on it. The first problem I encountered was my PCB design. I messed up the diode footprint, and ended up with surface-mounted pads for through-hole diodes, which has horrible structural integrity when you solder them together. However, since I can’t afford to get more PCBs, I had to make do with the 5 copies that I had. My first soldering job was fine, I added all of the components, did the diodes last, and ripped out the pads :(. However, I did end up hand-soldering three of them, and so i flashed my software to the RP2040 to see if any of those keys worked. To my disappointment, none of them worked, and I even switched around the orientation of the diodes about 3 times! Then came the worst part: DESOLDERING. I took out the keys fairly easily, but I had to sacrifice one rotary encoder(which was fine because the pack comes with two). Sadly, the two parts I needed most, the OLED and the RP2040, were stuck!! I managed to take both of them out in the end(didn’t record the time) and ended up ripping out pads on the rp2040 and burning up the OLED. Oh yeah, and I also had to demolish the PCB to get them free? For now, I’m getting a new RP2040, but I probably can’t procure another OLED. So once my parts arrive, I’ll have to experiment on a breadboard😭. Look at my mishaps below, and hopefully you’ll see it working soon.
I made SO much progress!!
For the JavaScript, the basic functionality was carried over from the notes app on my NINJAGO WEBOS, but I did need AI to educate me on how to implement new functions. Also, the CSS and HTML were written mostly by me with the help of tutorials.
Ok, so far I haven’t differentiated a backend and frontend for the projects tab, but for now you can add projects with an image, title, and summary, and they’ll appear as projects on the projects tab. Also, when you click on them, it brings you to a separate viewing tab to see all about the project, although I haven’t started working on the part where you can add devlogs. Also, adding projects isn’t permanent, as when I reload the tab, they all disappear (since I want it to save to the website for everyone to see, I have to implement a Node.js backend, which I haven’t learned about yet). I also slightly changed the theme into dark mode and made the buttons to enter the project look futuristic. They are NOT AI; I made them with the help of this video: (https://www.youtube.com/watch?v=a1NVen8SaqE), but it does look a bit different for reasons unknown. Anyway, stay tuned!
After realizing that I already have most of my accomplishments and extracurriculars on a different project that I’m making in school, I understood that maintaining a second site would be kind of useless.
So, in an attempt to salvage my efforts and make it something worth using, I’m going to take my Javascript knowledge from the NINJAGO OS project I’m also currently making to create a project and devlog site, similar to stardance, as I want to have a place to store all of my hobby projects. However, I don’t want anyone adding information to my site but me, so i’m biting the bullet and learning to differentiate a frontend and backend (with minor AI help), while salvaging the about page of the already existing porfolio. This way, when people online stumble upon it (as i’ll use the grant I got for purchasing a website domain), they’ll know about me first before moving on to my projects.
That’s pretty much it! Looking forward to it!
I was editing the css to see what parts I used AI for and what was my work, I ended up breaking something that I hopefully fixed, so it took a bit of time. Page looks the same though.
Changed the apps to custom ones I made on canva without using AI.
After finishing Ninjanotes, I went on to make two apps (one of which is Spotify, but it just opens in a new browser for now). The thing that I spent most of this time on was the Calculator App. Since I still have almost no idea how to use JavaScript, I got AI help again, but I didn’t just copy its code. It taught me what to do myself and helped me debug problems, one of which was the new full-screen feature that’s included in all windows. I also made it generate icons, but I will eventually replace them with my own art, because they look horrendous. Anyway, that’s it for now, and I’m going to get the GitHub Page ready for my first ship because, as of now, I have done the requirements. However, I will still keep working on this, so stay tuned!
Ninjanotes is done! First major change: the styling, which looks AWESOME. Next, I added a delete, edit, and add note button, making it a full fledged note taking app. Also, the icons for each note look like scrolls! I’m onto the next app now, so what should I make? I need your help.
Added some functionality to the NinjaNotes app. It took some time because I didn’t really understand the JavaScript in the guide, but I got it to work with AI guidance. I also forgot to mention that I added a close button for the topbar to prevent it from getting in the way at times.
Added NinjaNotes as an app (although no design or functionality has been done yet)
Through following the guide, I made the window draggable, with an open and close button, and a header for the window. Some minor details include centering the stuff on the welcome screen and putting all of the styles in a css file.
Made the Landing window, the background, and the top bar. Again, like my last project, it’s based on Ninjago(I can’t really think of anything else), but it’s fine because I plan to make peripherals for my desk all based on different Ninjago characters. So far, I’ve done a Kai-themed Hackpad, and now I’m making a webOS for the eventual bigger project of a Lloyd-themed Cyberdeck!(ik cool right?) Anyway, because I still have to get a bit used to HTML, this might take a bit of time, but working on my personal site helped me improve my html/css skills, so it’ll be alright. Anyway, stay tuned!
QMK FIRMWARE:
So for today, I finished the CAD Design, including minor fixes. However, the core part that I completed was configuring my macropad to QMK. Also, I finally decided on a name, the NINJAPAD! Anyway, that’s it for now, so stay tuned! Just have to fix my github repo and make production files.