AOSSIE-Org / AOSSIE-Org/EduAid
Improve UI Interactivity on Landing Page with Responsive Animations
- 主要言語
- JavaScript
- スター
- 171
- フォーク
- 425
- PR マージ指標
- 30日以内にマージされた PR はありません
説明
### **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.

---
### **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
---
コントリビューションガイド
このリポジトリのコントリビューションガイドは索引されていません
評価
この issue はまだ評価されていません。