Abandoned Hudson Valley is a website created to share information with other explorers about abandoned structures in the Hudson Valley area.


I created Abandoned Hudson Valley because I have a fascination with abandoned structures and their aesthetics and history. When I was trying to find abandoned structures near me I found it quite challenging, so I wanted to remedy this for others like me and create a central source that provides you with all of the information you would need to know about abandoned locations in the Hudson Valley.
Personas


Jordan and Alex are both interested in finding out more about abandoned structures near their area. Jordan is interested in finding locations for conservation and ensuring the safety of her community. Alex is looking to find cool places to photograph and wants to connect with his local community.
Site Map

I added and changed a few things about my original site map design. I originally thought that I wouldn't be able to create a community forum, so I instead created an About page that links to existing forums through Facebook Instagram, and Reddit. I was however able to find an outside source that allowed me to include a small forum through a website called Disqus. I also didn't include much abut the history of each location but would like to add links to websites that cover this in the future.
Wireframes

I changed my wireframes quite a bit from what they originally looked like. My original page included the iframe map and didn't have pictures for each H2, but in the end, it felt more fitting and cleaner to have the iframe on the locations page. I also think adding images to the home page helps to add more intrigue.
Figma Workspace
I updated my figma prototypes as I coded my website. I found what I had created through Figma would be more practical if I changed some of the designs to better fit my code. One of the main changes I made was moving my nav bar from the bottom of my header to the top. This worked better for practicality because it allowed me to have the nav change into a hamburger menu that would be more accessible on mobile devices. The community page also looks a bit different than I expected since I outsourced the code from Disqus. However, I am happy with the outcomes of it regardless I think it still works very well.
Code


I think that overall I am happy with how my website turned out for my first time coding ever! I found coding in HTML and CSS to be a bit challenging and frustrating at times when I couldn't get the code to work. As I continued coding I found a lot of ways to write less code and simplify the process by grouping things through classes and making small changes with specified IDs. I also learned the importance of accessibility in website design and tried my best to include alt-image titles and make sure the colors I chose had proper constants. I added media quarries that allowed the website to adjust according to the screen size and become accessible to mobile devices as well. In the end, I found it rewarding, and now that I know what I'm doing I actually really like and want to do more web-based projects like this in the future. If I am able to revisit this site I would like to find a way to add more about the history of each location either through a link or through text and expand the news page to include more articles.