
Locast Weather
End-to-end / Web Development / UX Design
For this project, I designed and developed a dynamic, responsive weather application that provides real-time weather updates tailored to user location. This project involved end-to-end development, from initial concept and design to a fully functional deployment. The goal was to create an intuitive, visually appealing tool that combines accurate data with a polished user experience.
Tools
React
HTML / CSS
Github
Figma
Procreate
Coolors
Mockup
Key Processes
02 Visual Design Implementation:
01 Sketching and Prototyping:
Created initial sketches to conceptualize the layout and functionality. Built a detailed prototype in Figma, incorporating thoughtful color schemes, typography, and UI patterns to create a cohesive and accessible design.
03 Custom A ssets and Theming:
Designed a set of custom weather icons on Procreate to represent various weather conditions, maintaining a cohesive look and feel throughout the application.
Created initial sketches to conceptualize the layout and functionality. Built a mockup in Figma, incorporating thoughtful color schemes, typography, and UI patterns to create a cohesive and accessible design.
04 Front-End Development with React:
05 API Integration
Integrated a third-party weather API to fetch real-time data, including temperature, conditions, and forecasts.
Added support for both location-based weather retrieval (via geolocation) and user-inputted city searches, ensuring flexibility
Implemented state management to handle user interactions, API responses, and dynamic updates seamlessly.
Built the application using React, leveraging its modular component-based architecture to ensure clean, scalable, and maintainable code.
Implemented state management to handle user interactions, API responses, and dynamic updates seamlessly.
05 Deployment and Hosting
Deployed the application on Netlify, utilizing GitHub for version control and continuous integration to streamline updates and improvements.