AOSSIE-Org / AOSSIE-Org/EduAid

Improve UI Interactivity on Landing Page with Responsive Animations

Abierto
#138 2 comentarios 0 reacciones 0 asignados Ver en GitHub
Lenguaje dominante
JavaScript
Estrellas
171
Forks
425
Métricas de merge de PR
Sin PR fusionados en 30 d

Descripción

### **Description**
The current UI on the landing page, where features like "Doc/Audio Input," "In-depth Questions Gen," and "Dynamic Google Form Integration" are displayed, lacks interactivity. This makes the page appear static and less engaging to users. Adding an interactive hover-based expansion for larger screens will improve user experience and make the UI more dynamic and visually appealing.

---

### **Problem Statement**
1. The UI elements on the landing page do not provide interactive feedback to users, reducing engagement.
2. The lack of animations and responsiveness makes the features less noticeable and impactful.
3. There is no differentiation in behavior between mobile and desktop users, leading to usability inconsistencies.

![image](https://github.com/user-attachments/assets/d1d068ad-e14c-40ec-af5e-829f4c43d007)

---

### **Proposed Solution**
1. **Hover-based Animation for Large Screens**:
- Add a hover effect that expands the feature tiles when hovered over, making the content visually engaging.

2. **Responsive Behavior**:
- Disable the hover animation on smaller screens (e.g., phones/tablets) to ensure compatibility and usability across devices.

---

### **Benefits of the Change**
1. Enhances user engagement by making the landing page more interactive.
2. Differentiates behavior based on device type, ensuring optimal user experience on both mobile and desktop platforms.
3. Improves visual appeal, aligning the UI with modern web design practices.

---

### **Expected Outcome**
1. Users on larger screens will experience smooth hover animations that expand feature tiles.
2. Mobile and tablet users will have a static layout optimized for touch interactions.
3. The landing page will feel more dynamic and polished, improving overall usability and satisfaction.

https://github.com/user-attachments/assets/4e94ef15-1874-49ed-81cb-b15b3ea29652

---

Guía de contribución

No hay ninguna guía de contribución indexada para este repositorio

Evaluación

Este issue todavía no se ha evaluado.

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.