Website Design - OtagoPolytechnic/Cloudy-with-a-Chance-of-LoRa GitHub Wiki

Weather Website Redesign Overview

Website:
https://weather.op-bit.nz/

This update focuses on redesigning the widgets located in fullstack/src/components/widget.jsx. The main goal was to improve the UI and graph visuals to create a cleaner, more readable presentation of data, consistent with the frontend UI/UX redesign efforts.

Key Details

  • No changes were made to backend data flow or database calls, ensuring full compatibility and no disruption to existing backend functionality.

  • The redesign builds upon prototyping and UX design ideas developed by previous project groups, incorporating their insights to enhance the frontend user experience.

  • These changes improve frontend presentation only without affecting underlying data logic or API integration.

  • To review the updated widgets with live data, follow the Docker database setup instructions provided in the related documentation. This allows side-by-side comparison between the new and old widget implementations.

  • This approach supports iterative frontend development focused on usability and aesthetics, while maintaining backend stability and reliability.

Sources and References

Site Visual Comparison

Old Site:
Old Site

New Site:
New Site 1
New Site 2
New Site 3

Codebase Changes

Main Project Folder

  • /fullstack β€” Focus of redesign and development

Key Edited Files

New Page Routes Added

Landing Page Components

Located at /fullstack/src/app/LandingPageComponents, including:

Key Closed Issues

Key Improvements Needed

  • Improve Error Handling for API and Website for Clearer Diagnostics β€” Issue #226
  • Re-add Weather Emojis to Today’s Forecast Component β€” Issue #227
  • Enhance Search Bar to Suggest Available Pages Based on Common Word Searches β€” Issue #228
  • Fix Case Sensitivity Issue Preventing About Page Images from Displaying β€” Issue #229
  • Improve Cloud AI Page UI and Integrate Image Input β†’ Analysis Flow β€” Issue #230
  • Refactor Page Component Layouts & Styling for Better UI/UX Consistency β€” Issue #231
  • Refactor Frontend Background Styling Using Tailwind with Locally Stored Image β€” Issue #232
  • Fix Mobile Navbar Scroll Behavior for Consistent UX/UI β€” Issue #233
  • Add Smooth Loading Screen Between Page Transitions β€” Issue #234
  • Improve Responsiveness & Layout Overflow Control Across Screen Sizes β€” Issue #235
  • Replace Dummy Data in SevenDayForecast and TodayForecast with API Backend Data β€” Issue #237

Other Issues To Work On

Additional Resources