- About
- User Stories
- Technologies Used
- User Journey
- Features
- Wireframes UI/UX
- Website Layout
- Live Website
- API
- Installation
- Team Members
What?
Climostate is a beautiful, simple and easy to use app that gives you the best weather forecast for any country or city in the world for three consecutive days. Once you enter the name of the country in the search field, it displays information about that country such as its capital, currency, and language.
Why?
Climostate aims to give you an glimpse about weather help you have a better explore experience, by knowing your destination and the country you intend to visit based on the weather in that country.
How?
Planning Phase:
- We defind the idea for the application and gathered content through APIs and photos that suits with our application theme.
- Sitemap consisted of 2 pages: Landing page and the Country Details page. and Sections were planned.
- Page Layout was planned the UX/UI Wireframe was sketched.
- The application then was designed on the base of the Wireframe in Figma.
- We assessed the tasks we needed to accomplish as well as our skillsets.
- And finally we divided up the workload accordingly.
Development Phase:
The team agreed on guidelines to follow during development. The technologies and guidelines that we agreed to use and follow are:
- HTML5 language and taking advantage of the Semantic elements.
- CSS3.
- Git & Github.
- Making the pages responsive for 3 devices: Mobile, Tablet and Desktop.
- Javascript (JS).
- Local Storage.
- API.
- see an Image for the country I'm looking for
- see the official name of the country I'm looking for
- see the flag of the country I'm looking for
- see the continent of the country I'm looking for
- see the population count of the country I'm looking for
- see the native name of the country I'm looking for
- see the language spoken of the country I'm looking for
- see the currency used in the country I'm looking for
- see the overall weather of the country I'm looking for
- see the cities of the country I'm looking for
- select a city in the country to see the weather status
- see the wind speed of the selected city in the country I'm looking for
- see the temperature of the selected city of the country I'm looking for
- see the forecast for 3 days of the selected city inthe country I'm looking for
- As the user enters the Event web application home, he can view different sections that shows (Features - Testimonials - Explore places).
- The user can navigate to the desired section to see by clicking on to it in the navigation bar or by scrolling and going to it.
- The user can look up for the desired country by typing its name and click "Get Started!".
- The user then will be moved to the desired country page in which he was looking for.
- The user will see different cards about the country including a (Photo, General info, Cities and Weather state for the next 3 days for the city).
- Even if the user hinted about the country he is looking for, our application will try to match his hint with the expected country to be shown.
- if invalid input was typed, the user will simply be navigated to a page which tells him that no country found.
- Easy to use.
- Displays weather forecasts in a clear and easy to understand manner.
- Easily browse weather information for any country in the world.
- Displays information about the country you intend to visit.
- Enjoy every moment you open the application with beautiful pictures related to the country.
- Protect your health with air speed and temperature indicator.
- Pixaby for photos
- Rest Countries for countries
- Countries Now for cities
- Heroku App for weather state
You can see our demo website Here.
- git clone https://github.com/GSG-CF04/Climostate.git
- cd climostate
- code .