AOSSIE-Org / AOSSIE-Org/Perspective
[ENHANCEMENT] Modernize and Optimize Landing Page for Perspective-AI
- Dominant language
- TypeScript
- Stars
- 50
- Forks
- 78
- PR merge metrics
- No merged PRs in 30d
Description
Description
The current landing page provides a solid foundation but requires a more modern, interactive, and conversion-focused design to better communicate the value of Perspective-AI. To improve user engagement and better showcase our AI-powered bias detection capabilities, we propose a comprehensive rebuild of the Home component.
Current Implementation Analysis
Structure: Uses a standard vertical layout with Hero, Features, "How it Works," and Tech Stack sections.
Visuals: Relies on static lucide-react icons and basic CSS gradients.
Interactivity: Limited to a theme toggle and basic button navigation to /analyze.
Proposed Improvements
1. Interactive "Live Demo" Hero Section
Instead of a static description, replace the hero image or text block with a "mock" analysis tool.
Feature: A simulated input field where users can see a sample biased headline transform into a "balanced perspective" in real-time.
Goal: Immediately demonstrate the core value of "Counter-Perspective Generation".
2. Enhanced Data Visualization
Feature: Replace the static statistics grid with animated counters or a small radar chart showing how the tool analyzes "Sentiment," "Factuality," and "Bias."
Technology: Utilize a lightweight library like Framer Motion for smoother entry animations.
3. Visual "Flow" of the AI Pipeline
The current "How Perspective Works" section uses cards.
Feature: Design a visual "pipeline" or "graph" representation that mirrors the LangGraph architecture mentioned in the documentation.
Goal: Highlight the technical sophistication of the "Reasoned Thinking" and "Fact Checking" nodes.
4. "Featured Perspectives" Carousel
Feature: Add a section showcasing real-world examples of analyzed articles (e.g., a political news piece vs. its generated counter-perspective).
Goal: Provide social proof and concrete examples of the "Expected Outcomes" like "Better Discourse" and "Sharper Analysis".
5. Technical Stack Badge Optimization
Improvement: Update the technologies list to include specific icons for FastAPI, LangChain, and VectorDB rather than generic colored badges.
files gonna be modified-
frontend/app/page.tsx
frontend/components/ (New components for sections)
frontend/app/globals.css (For custom animation keyframes)
### Additional Context
_No response_
### Code of Conduct
- [x] I have joined the [Discord server](https://discord.gg/hjUhu33uAn) and will post updates there
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.