Graduate Project Milestone 3

Project Description:

A web page that allows a user to lookup a city, shows the location of the city on a 3D model of the Earth, and gives time and weather information about the city.

Complete MVP

Process:

I started by finalizing the style of the output of the site. Here is a sketch I made:

I ended up moving the location of the user input to the bottom.

I then got the mobile version working. This was difficult as I had to resize the Three.js camera and renderer to cover the lower half of the window, which required a few attempts to get right and also the removal of scrolling. Also, the text would sometimes get cut off if the window was too short, so I made only the text section scrollable using overflow-y: auto;.