Skip to content

UI/UX: Optimize landing page images to improve load performance and UX #333

@madhavansingh

Description

@madhavansingh

🎨 The UI/UX Update

UI/UX Update

This proposal aims to improve the performance and user experience of the Resonate landing page by optimizing the images used in key sections such as the hero section and feature screenshots.

Currently, several images (including mobile interface screenshots and illustrations) appear larger than necessary for their displayed size. This increases page load time and can negatively impact the user experience, especially for users on slower networks or mobile devices.

The proposed update focuses on compressing and optimizing these images while preserving visual quality. This will improve page load speed, reduce bandwidth usage, and ensure a smoother experience when users first visit the landing page.

Current Design Issues

The landing page currently uses several high-resolution images (mobile screenshots and illustrations) that appear larger than necessary for their displayed dimensions.

This results in:

  • Increased page load time, especially on slower connections.
  • Higher bandwidth usage for mobile users.
  • Slower initial rendering of the landing page.

Because this is a marketing landing page, fast loading speed is important for user engagement and accessibility. Large image sizes can negatively impact the overall user experience.

Image

Proposed Solution

The landing page currently uses several high-resolution images (mobile screenshots and illustrations) that appear larger than necessary for their displayed dimensions.

This results in:

  • Increased page load time, especially on slower connections.
  • Higher bandwidth usage for mobile users.
  • Slower initial rendering of the landing page.

Because this is a marketing landing page, fast loading speed is important for user engagement and accessibility. Large image sizes can negatively impact the overall user experience.

I would like to work on this improvement as part of my open-source contributions while preparing for GSoC 2026.

Design Considerations

  • Accessibility
  • Visual consistency
  • User flow/navigation
  • Responsive design
  • Dark mode support
  • Other

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions