It is necessary to develop a design for a weather mobile application based on the existing design of the website (there is a project in Figma) and the ready website.
Main:
1. All weather pages must have two icons at the bottom – one opens the list of cities, the other is settings, where you can choose the degree scale (Celsius or Fahrenheit), speed (km/h or mph), precipitation (mm or inches), and languages (a precise list will be provided). In the middle between the two icons, there should be items corresponding to the list of cities.
2. Use weather icons from the website (will be provided), each icon must have its own background (can be a gradient). Main
types: sunny (blue background), cloudy (three types that will suit sunny with clouds weather),
rain and snow with sun (also 3 types when it is sunny but with precipitation), just rain and snow (3 types of gray background),
fog, thunderstorm, night (also three types from clear night to night with precipitation).
3. For each city, there must be a toggle between weather by days and months.
4. There should be a slider switch with items (cities) like on the iPhone with circles at the bottom, which
shows the total number of cities but no more than 8, it should be centered and the main city by geolocation.
5. The design must be based on the style, fonts, and icons of the website.
6. A Buy premium icon or button is needed, it is important to place it in such a way that it is
not intrusive and does not leave empty space if it is not present.
Main (Appendix 1):
You can create something in between the mobile version of the website weather and the iPhone weather, it is important that at the top there is a block with the city name and temperature, as well as a textual description of the weather (Sunny on the chest), and below a block with the current weather by hours and a 2-week forecast by days.
Monthly Weather
This is the page that is accessed from point 3 when switching to weather by months, it is important that past days are marked as inactive. There should be a list of months, or the name of the next and previous month on the sides, which becomes transparent from the center to the edge with a gradient, and only one month in the form of a calendar takes up the entire screen. At the top, there is also a block with the current weather, but without the block with the hourly slider. There may be some other ideas regarding this. Below the block with months, it is necessary to add graphs for temperature and precipitation by months for the year in total. A more detailed description can be obtained through personal communication.
Weather for the Day
The page will contain general information about the weather for the day, hourly weather, and graphs of humidity, pressure, and visibility. There will also be a block with information about the lunar cycle. No additional illustrations are needed on the page, possibly only a few simple icons. Also, each page must have a button or icon that allows returning to the previous page. A more detailed description can be obtained through personal communication.
List of Cities (Appendix 2)
The list of cities like on the iPhone with search, use the color scheme and icons as in point 2 of the main description for each city. For this section, it is necessary to create 2 pages, one with the list of cities like on the iPhone, the other with search results.
Behance
Freelancehunt
