Save plan in Lovable

Author: lovable-dev[bot]

.lovable/plan.md

@@ -1,2 +1,73 @@
 
-Aquí tienes el plan de acción corregido y ultra-detallado. He inyectado tus instrucciones de jerarquía, la nueva categoría estratégica CashFlow, el orden alfabético y la restauración estética del día 23.Copia este texto y pégalo directamente en el botón "Edit Plan" de Lovable antes de darle a "Approve".Academy Page Redesign Plan: Quantum Restoration & Strategic Expansion1. Hero Header: 23rd Jan RestorationPriority: Restore the high-tech visual identity exactly as it was on January 23rd.Circular Logo Frame: Restore the double-ring circular frame with depth shadows and the "Quantum Glow" (pulsating animation).Typography: Reset title to 'Nasalization' font with the original green/gold gradient and drop-shadow.Subtitle/Quote: Restore the italicized, wide-spaced subtitle with the original golden-muted color palette.Spacing: Do not over-compact. Maintain the original vertical breathing room that felt premium.2. Partners: Logical & Institutional RestructuringOrganize all partners ALPHABETICALLY within these specific categories:CategoryIncluded PartnersACADEMY PARTNERSAcademia, AulaFacil, Coursera, Cursa, edX, GrowGoogle, Hotmart, MasterClass, Mooc, SkillShare, Udacity, UNED.CASHFLOWAzrael Codex (Bitget), Predik.HEALTHFLOWMeslo Ltd, Motus DAO, My DNA Bank, Proton, Yazio.DATAFLOWAlchemy, HackMD, HackerRank.ECOFLOWClimateReanalyzer, OEGlobal, OpenUpEd.GAMEFLOWExplore, Unity Learn.SPACEFLOWESA, KAGRA, LIGO, LSC, NASA, UNESCO, UNSSC, Virgo.3. Asset & Logo IntegrityPriority 1: Use all files from /lovable-uploads/Academy/ (matching the GitHub repository).Priority 2: For missing official logos (NASA, Coursera, Proton, etc.), use high-resolution official Wiki/External URLs as previously implemented.Visuals: Maintain the grayscale to color filter on hover.Links: Ensure every partner has its functional external link.4. UI/UX Polish (Contact Us & Global)Contact Page: Fix the H1 separator by adding horizontal gradient lines (transparent -> alien-green -> transparent) to the sides of the center dot.Chat Bubble: Add the triangular "comic-style" pointer to the message bubble in the Contact section to make it look like a real chat.Interactions: Ensure all cards use the scale-[1.01] transition with a 300ms duration.5. Technical ImplementationUpdate src/pages/Academy.tsx as a single, clean file.Ensure the partnerCategories constant reflects the alphabetical order and the new CashFlow category.6. Proactive ExpansionIntegrate 2 or 3 additional high-prestige institutions in SpaceFlow or HealthFlow (e.g., SpaceX, CERN, or major BioTech labs) if high-quality logos are available, to enhance institutional weight.
+
+# UI/UX Improvements: Professional DAO-Grade Design
+
+After reviewing the entire codebase, here are the key improvements inspired by top-tier DAOs (Uniswap, Aave, Lido, MakerDAO) and Web3 platforms.
+
+## Priority 1: Homepage Upgrades
+
+### 1.1 Hero Section Enhancement (`src/components/Hero.tsx`)
+- Add animated gradient orbs behind the logo (like Uniswap's homepage)
+- Add a live "pulse" ring around the logo similar to Lido's staking interface
+- Improve CTA button hierarchy: primary button with gradient glow effect, secondary with outline
+- Add a subtle animated particle/star field that responds to scroll
+
+### 1.2 Stats Section Revival (`src/components/StatsSection.tsx`)
+- Currently returns `null` — restore with animated counter stats (like Aave's dashboard)
+- Show: Total Members, Countries, TVL, Proposals Passed
+- Use `framer-motion` number counter animation on scroll into view
+- Place between Hero and FinancialFreedom sections
+
+### 1.3 Explore Spaces Cards (`src/components/ExploreSpacesSection.tsx`)
+- Add glassmorphism hover effect with gradient border animation (like MakerDAO cards)
+- Add subtle icon animations on hover
+- Add a "badge" showing number of partners per space
+
+## Priority 2: Global UI Polish
+
+### 2.1 Page Transition Animations (`src/App.tsx`)
+- Wrap `<Outlet>` with `framer-motion` `AnimatePresence` for smooth page transitions (fade + slide)
+- Reference: Uniswap's smooth route transitions
+
+### 2.2 Footer Redesign (`src/components/Footer.tsx`)
+- Add a "Powered By" tech stack row (Polygon, Aragon, IPFS icons)
+- Add gradient separator line at top (gold → green)
+- Improve social icons with hover tooltip labels
+
+### 2.3 Scroll Progress Indicator
+- Add a thin gradient progress bar at the very top of the viewport (gold → green)
+- Shows how far the user has scrolled — common in premium sites (Medium, Linear)
+- New component: `src/components/ScrollProgress.tsx`
+
+## Priority 3: Page-Specific Improvements
+
+### 3.1 About Page (`src/pages/About.tsx`)
+- Add a "Team/DAO Structure" visual section with connected nodes diagram (like constellation)
+- Improve the Web technologies section with a horizontal timeline instead of stacked cards
+
+### 3.2 Clubs Page (`src/pages/Clubs.tsx`)
+- Add a search/filter bar at the top to filter clubs by category
+- Add member count animation on scroll
+- Add "Coming Soon" badge for clubs under development
+
+### 3.3 CoNetWorKing Page (`src/pages/CoNetWorKing.tsx`)
+- Add an interactive network graph visualization header (nodes connecting = partners)
+- Currently uses `font-[Atomic Age]` which may not be loaded — standardize to Nasalization
+
+## Summary of Changes
+
+| File | Change |
+|------|--------|
+| `src/components/Hero.tsx` | Gradient orbs, pulse ring, improved CTAs |
+| `src/components/StatsSection.tsx` | Animated counter stats section |
+| `src/components/ExploreSpacesSection.tsx` | Glassmorphism cards, badges |
+| `src/components/ScrollProgress.tsx` | New scroll progress bar component |
+| `src/components/Layout.tsx` | Add ScrollProgress + page transitions |
+| `src/components/Footer.tsx` | Tech stack row, gradient separator |
+| `src/pages/About.tsx` | Timeline layout for tech sections |
+| `src/pages/Clubs.tsx` | Search/filter bar, member animations |
+| `src/pages/CoNetWorKing.tsx` | Font fix, header visual improvement |
+| `src/App.tsx` | AnimatePresence page transitions |
+
+Total: ~10 files modified, 1 new component. All improvements use existing dependencies (framer-motion, Tailwind, Lucide).
+