A social media web application that helps users to determine when and where is most optimal for stargazing
OVERVIEW
This is a personal project from when I did the full stack web development boot camp at General Assembly SF. I used a third party weather API to query the search and the geolocation using ajax request. In response, it displays the moon cycle of the day, cloud coverage and the temperature of the location. Users are also able to upload astrophotography and the location of the photographs they uploaded will render in a modal using Google Maps API.
KEY FEATURES
- Search for the weather condition of any location using search input or user's geolocation.
- Weather forecast displaying the moon cycle, temperature, cloud coverage and light pollution map.
- Share - users are able to sign up and share stargazing photographs.
- Socialize - users are also able to comment on other user's images.
Based on these features, I made the wireframes with Balsamiq.
ROLE
Wireframing
Visual design
Full-stack web development
TIMELINE
4 Week Sprint
TECHNOLOGY
Ruby on Rails
HTML / CSS / JS / jQuery
Semantic UI
PostgreSQL
Illustrator /
Photoshop
Balsamiq
AccuWeather API
WIREFRAMES
DESIGN ELEMENTS
- Time lapse of night sky — full screen video backdrop as landing page.
- Parallax scrolling — using z-index to create a 3D scrolling effect.
- Modal — full screen modal is prompted after clicking on the location of any uploaded images.
- Moon phases — the moon cycle displayed in the forecast is created using Moon Phases typeface.