Full Term

This term, I completely finished my computer project. My goal was to create a webpage of the Oak Hill School map where one could hover over different parts and get information about the various buildings. I also took pictures, which have been linked to the different places. In the first month of my project, I focused on getting the basic page format set up. I completed the hover-box code by about November, then focused on putting everything together. In the last week of my project, I finished putting the last photos in and adjusting the page so that everything works.

Over the course of this project, I learned a lot about webpage interactivity. Before I started, I mainly knew about the design and formatting parts, so this project was a bit of a challenge. I believe that now, however, I know a bit more about how to format pages for interactivity and the complexity of code that is necessary to get anything to change.

I also learned a bit about web browser challenges, as the hover boxes that I created only work in Firefox. With more time, I would have worked to fix that issue, but I was working down to the last day of class.

I do believe that I completed the goals that I set out at the beginning of the term, creating a functional webpage (though in only one browser). Each place on the map links to a separate webpage with a photo of the location. The hover boxes are used for information about the place. In the beginning, I did plan to put the photos inside of the hover boxes, but I realized that they would be too small to see in that format, so I moved them. About 3/4 of the photos had some editing done to them, but only to remove clutter that would confuse the image.

All in all, my project has been completed according to my preposition in the beginning of the year, and it is online with this link:
http://dl.dropbox.com/u/71274563/OHSFiles/OakHillMap.html

Week of Jan. 14th–18th

This week, I finished converting all of the photos to PNG format. I linked each one to its own website and modified the pages for comprehension. I checked each link to make sure it worked, and so now I believe I have finished my project.

Week of Jan. 7th–11th

Over the winter break, I spent some time creating new pages for each image. I linked each page to the main file. On Tuesday this week, I spent time troubleshooting because my webpage was no longer showing up. I found out that by moving the page to a different folder within my Dropbox, the web address changed. I fixed the links to each changed web address, so now I believe everything will work. On Thursday, I converted about half of the photos to PNG form so I can use them in the website. Next week, I plan to check through each page of my site and make sure everything is finished. I will finish converting the photos and add each photo to its specific page.

Week of Dec. 17th–21st

This week, I started creating separate pages for each of my photos. I started editing the photos I took last week using Photoshop, and I finished all of the hover boxes on the website. Next week, I plan to finish editing the photos and start placing them in their separate webpages. I will set up the links on each hover area on the map and link them to their photo pages.

Week of Dec. 10th–14th

This week, I finished photoshop editing the pictures that I have so far. I brainstormed ways to show the pictures within my page, and decided that I will probably have the map locations link to separate webpages. I finished taking all of the photos on Thursday, and I will start to edit them next week. I'll start the creation of web pages for each photo next week as well.

Week of Dec. 3rd–7th

This week, I edited my photos some more with Photoshop. I made a list of the ones I still need, but I could not take pictures because my camera was out of batteries. Next week, I hope to take the last pictures and maybe work a bit more on my hover-boxes.

Week of Nov. 26–30

This week, I finished my location descriptions and added a few more hover-boxes for places. I worked with Photoshop to edit two of my photos. Next week, I plan to bring my camera and take some of the remaining pictures. I am in the process of listing off which places have finished pictures and which ones need some modifications.

Week of Nov. 19-23

This week, I finished writing the small descriptions of each place. I fixed the double spacing of the font within the hover-boxes, and I aligned the text within them to the left. The piece of code that I found last week for formatting the boxes did not work, but I found another way to do the formatting. Next week, I plan to inventory all of the photos I have and take a few more. I also want to finish putting hover-boxes on each place.

Week of Nov. 12th–16th

This week, I made a list of all the places I wan on my map and started writing information about each. I finished the hotspot for each on the map, so now I just have to put the hover-box code around each one. I still need to take some pictures of different buildings, but not many. I have recently been looking up a way to easily program the CSS to have a bold title and smaller body text within the hover-boxes, and I think I now have a piece of code that will work. Next week I plan to inventory my photos and put more hover-box codes around the different spots.

Midterm Progress

Throughout the first half of this semester, I have been working on my interactive map. Currently, I've figured out most of the complicated coding of the site, and I now need to put everything together so that it works and is helpful. In the end, I plan to have a hover-box for every place of interest in Oak Hill. I have put most of them into the code as map hotspots, but I will need to put a hover tag around each. I have taken pictures of most of the outdoor places around campus, but I still need to do the indoor pictures. I've started editing some of the photos using Photoshop.

I realized recently that the hover-windows that I have do not work in either Safari or Google Chrome for some reason, but they do work in Firefox. If I have enough time next quarter, I plan to try to solve that problem.

I may need to ask some students who have been at Oak Hill longer which buildings I should include on my map, but I believe right now I have most of the main ones. I plan to start listing photos and places I will need to include so that I can make sure I get everything.

I believe, so far, my coding progress is going well. I plan to do less coding in the second quarter, and focus more on the informational and design aspects. I want to find one more sunny day for any outdoor photography I may have missed, though I have enough pictures now if that is impossible.

In my goals for the project, I believe I am a bit over half way through, but I could spend more time making my webpage compatible with more systems and devices. Currently, it's best in Firefox on a laptop or desktop, but if I have more time, I could make it usable on iPhones, or expand the hover box usage to other web browsers.

Oct. 29th–Nov. 2nd

This week, I worked on modifying CSS within HTML so that I could specify where each hover box goes. I am going to start putting the boxes into their correct positions soon and creating content for each. Next week, if there are any sunny days, I am going to look at some other places for photography and make a full list of everything I want on the site.

Oct. 22nd–26th

This week, I took a break from coding and worked with photoshop on my pictures. I am currently about two thirds of the way through the current photos, but I hope to take more later. Next week, I plan to continue work on the hover-boxes and try to get them into the right spots. I may try going through the W3schools hover tutorials to try to find some information.

Week of Oct. 15th–19th

This week, I worked a bit more on my hover box. It is still independent from the text and generally appears in strange places on my page. I also uploaded the photos I took a few weeks ago to my computer and chose the ones I wanted to keep. I have started editing the photos with Photoshop to make them nicer. Next week, I plan to continue my work with Photoshop, and work some more on my hover box.

Week of October 8th–12th

This week, I continued working on my hover boxes. I could not find the missing piece in my last piece of code, though I spent all of Tuesday looking for it on the internet. Tim helped my find a different piece of code to use, and I'm currently testing it out on my page. Next week I plan to go through my photos to find the best ones to use.

Weekly Update - Oct. 1st through 5th

This week, I took pictures of many places around Oak Hill campus. I will start to eliminate some to choose my final pictures next week. I also started work on the pop up bubbles that I will put the pictures and information into. I tried one pice of css code from the internet and found that it seemed to be missing a piece (a.info:hover state). Next week I plan on trying to find what goes into that missing piece of code so I can get the bubbles working.

Second Week Update

This week, I figured out how to make the page react when you hover over a certain place on the map. I have created hover-over areas for the Upper School Building, the Gym, the Gazebo, the Garden, both parking lots, the main office, the art room, the lower school building, both playgrounds, and the giant chess board. When you hover over one of these places, Javascript overwrites the website and prints either "Hello" or "Hi". Next week, I plan to finish the hover-over spots and start taking photos of the different areas.

First Week Update

This week, I found an image on Google Maps to use as my overhead map. I created a title and subtitle for my page. I also put a basic (one sentence) description of my plan at the top of the webpage. I struggled a bit with calling CSS divs, but I found a solution after a bit of work. I hope to start working on functionality in the coming weeks. I also should be able to add a link to my website in the sidebar of this blog so it can always be accessed from this page.

My Webpage

My interactive map webpage has been started. Currently, it’s just a map, but here’s the link:

http://dl.dropbox.com/u/71274563/OakHillMap.html

I hope to start adding some useful parts.

Hello World

My Project Plan:
I plan to use html and javascript to create a web map of Oak Hill. A user can hover over different areas to see information and images about the spot in a pop-up window. I hope to have pop-ups for at least the upper school building, gym, lower school building, office, playgrounds, and garden. I hope take the pictures myself as I work on the project.
I would like you to evaluate me on how useful and user friendly my webpage is. Also on how close I come to achieving the goals I wrote above.