This project started out as a quick website being built using a static HTML file. But as I came up with new features I decided to make it more dynamic using PHP and JS. Since this has been a side project done in a couple of hours, no great time was spent using best or coolest code practices.
- Take a screen shot of the map on the phone
- Open in PS and crop to 1125x1125
- Resize to 800x800
- Export as PNG
- Upload to https://derivv.com/ to make additional sizes 50x50, 100x100, 200x200, 300x300, 400x400, 500x500, 600x600, 700x700
- Create sizes and download zip
- Unzip and upload to TinyPNG
- Upload 500x500 version to TinyPNG
- Download zip from TinyPNG
- Add to correct project folder
- Make the activity public
- Copy the iFrame code
- Make the activity private
- Set the ids for the activity in the "database"
- Set the distance for the activity
- Name all activities by the letter it represents
- Get screenshot of each activity to use as letter image
- Set the distance of each activity in the data file
- Set the activity ids of each activity in the data file
- Test locally
- Make activities public
- Test locally
- Upload everything to the server