Key Concepts/Intentions
For my final project, I decided to create a travel application so people could have good cultural information and an easy place to quickly translate whatever words/phrases they needed. I drew inspiration from the experiments with Google page. I had found a translator that translated objects into a different language simply based on an image. I wanted to create my own translator, but have it for people who needed to translate something on the go and also have some good cultural information if they haven't been there before. I started creating this in Week 1 with some basic design layouts. I wasn't exactly sure what I wanted my page to look like, but I knew what I wanted to include.
When week 2 came around, I decided to take things even further and add some color and graphics while still working on the design and layout. I was also still looking into ways to add the translator effect and what cultural information I wanted to add. I also tried using the p5 speech library to add an easy easy way to select a country and use it to easily translate what ever words the user wanted.
During week 3 and 4, with additional feedback from my professor and classmates, I decided to change my idea some. The translator effect was becoming challenging because there weren't any easy to use APIs to help with translating, I decided to switch APIs and use one that included information for almost all the countries. it wasn't as comprehensive as I wanted it to be so I decided to research and add my own information on the page. I also decided to use the National Weather API, as it's one I've used before, to include some weather information about each country's capital I wanted to include. Since I didn't think I would have time to figure out whether or not, I changed my p5 application to change the background and have it populate circles for the colors based on an image.
One of the good pieces of feedback I received was to space out the information so the user isn't receiving it all at once. That's something I want to include in my next steps. I want to maybe add some more animation or layer the information better, but figure out a way to space out the information. I would also want to play more with the code and translator APIs to figure out how to include speech and the translator aspect to my final project.
Major challenges
One of the biggest challenges I had was trying to get the background p5 sketch to work. I changed what was going to happen at the last minute and didn't have much time to figure it out. Once I decided to not use the p5 speech library, I had to figure out another way to use the p5 library. After talking with Ruta, I decided to use p5 to change something subtly and I remembered Dan Schiffman's pointillism sketch. I wanted to use that idea to have the background change based on each countries flag. I had a hard time figuring out how to trigger the effect after each button click instead of starting when the page loads. After reaching out to Ruta, Craig and Brian, they were all able to help give me a small piece of the puzzle to fix the glitch and allow the image to show up after the button click. Another major problem that I had was with the APIs. I had a hard time finding a free translator API that I could use which was one of the main parts of my project. I had to really rethink how I wanted to present my data and restructure my project a few days before the project was due.
Resources/References
Here is a link to a Project demo.
Here is a link to the GitHub repo.
Comments