NoteHop

Note Hop - Devlog 09

The barebones of this app are (somewhat?) coming together 🎉! Today was more focused on using my individual question banks and creating cohesive pages that connect those question banks into scrollable pages for each instrument. For the coding geeks (my people!), the one of the biggest struggles was trying to get the data structures right, especially when iterating with Lists and ForEach loops.

Also WHY did no one warn me how hard organizing all my structs and variables and instances would be 😭

Actual footage of me trying to figure out where half of my code was.

Note Hop - Devlog 08

This lock in was dedicated to actually code the purpose behind this app… AKA actually learning music 🙃 Just some of the things I’ve done so far!

1. Created a question bank of question banks!
2. Spent hours scouring for sound files for each note (didn’t get tracked by the way 🥀) .
3. Writing and rewriting the interface code (no one told me it was this hard to make it look modern I still hate it 💀).
4. Understand why the code to link an image to a note sound wouldn’t WORK (AHHH).
5. Realizing the error was in a test call from a completely different file…

Anyways blood sweat and tears were shed to build a struct that takes a question bank as a parameter and returns a UI that you can iterate questions through 😁

Me for 7 hours and 35 minutes 🥀.

Note Hop - Devlog 07

I finally made headway on the actual course pages and worked on updating the buttons in the homepage that were pretty but dysfunctional. What took a really really really big amount of time was trying to get my buttons to work, which required switching to a navigationLink() instead of Button() code, and making sure that the page that opened when clicking the button would have the corresponding sticky banner, which, for the longest time, refused to update on each webpage :( Just some of the frustrating scenes I’ve seen and now know how to avoid 🙃

Note Hop - Devlog 06

This lock in period was all about the music library 😁!!!

The first real issue was finding actual, downloadable sheet music, which legitimately took HOURS that weren’t even tracked because it wasn’t on Xcode 😔, but after hours of blood, sweat, and tears, I was able to find a bunch of sheet music pdfs that were perfect for my cause!

Then, was figuring out how to actually code the library… being a complete newbie in SwiftUI, it took hours of YouTube tutorials, thousands of google searches, and the trusted Rubber Duck method to work out every detail and push through every challenge, which include and are not limited to:

1. Organizing the sheet music files within my Navigator Area (and accidentally deleting them at one point 😬)
2. Having no way to title the top of my NavigationStack.
3. Figuring out how to find the right amount of padding to make sure none of my titles were obscured.
4. Creating new structs in previous files to handle my excessive catalogue of songs.
5. Making sure all of my functions were calling each other in the right order with the right parameters.
6. Adding details to each and every song like the title, composer, instrument, and key tips.
7. Adding and formatting a back button to return the user to the music library.

After getting the basics out of the way, I had to go back in and format everything with the app’s font and colors, only to realize that I couldn’t push all of my changes because I had no branch to push them to which ended up taking me a long, long while to fix 😭.

Note Hop - Devlog 05

Was about to start with user data code when all the little things about the homepage started nagging at me 🫠… First, I cleaned up the code by adding functions for repeating segments like formatting images. Then, I added a sticky banner with the greeting that doesn’t move when the user scrolls down. Next, I added an extra sheet music button (Golden Hour!), and then stats buttons like a fire and gem for the potential streak calendar and shop. When making the sticky banner, I wanted more shades of the same color for UI Design, so I had to added lighter shades of the button colors into my assets tab, but then I realized that in dark mode, the text color in the banner would be white against a light yellow banner 😭 So I had to go back and add a whole other color set just to say “I want black font in my banners whether its light or dark mode!”

Note Hop - Devlog 04

Its been a little while since I’ve worked on this 😅. I spent almost four hours first getting back into the project and figuring out what feature to add next (coder’s block I guess 😭). I decided to start small and add more of the homepage with rows for the music library and other shortcut buttons, but with all the extra features the screen was quickly getting squished and words were getting cut out, so I coded a scroll feature that lets the complete text stay on screen and all you have to do to see it is scroll. Then, I added a cutesy font so it wasn’t boring and actually fun to look at 😁!

Note Hop - Devlog 03
Finally began working on Note Hop’s homepage! First I generated a list of greetings and wrote code to choose a random greeting to display on the dashboard, but for some reason the canvas kept throwing an error which could only be fixed by reducing the number of items in the list of greetings. Then, I started formatting the first set of features on the homepage, which would be buttons that take you to the next lesson of the course. With this I also added color sets for aesthetic and accessibility 😁. Next step is to add more buttons make it look like an actual app!

Note Hop - Devlog 02
Spent over an hour starting the design on the homepage… First I designed a set of tabs to go on top of the home screen, and then tried but couldn’t commit until I realized I didn’t have my GitHub Repo under remotes 😭. After figuring out how to commit, I finally finished the set of tabs with mini pages and drafts for content within those tabs.

Note Hop - Devlog 01
Designed first basic wireframe drafts, color schemes, and app icon sketch! Hardest part so far was choosing colors that matched the vibe I want for the app (energetic and ready-to-learn) while complementing each other. (App icon is a work in progress 😅)