Digital book reading experience website

Prompt: # Book Reading Platform - UI Specification ## Global UI Elements ### Navigation Bar (Persistent across all pages) - Left side: - Logo/Brand name - Search bar with advanced filter toggle - Library dropdown - Community dropdown - Right side: - Reading progress indicator - Notifications bell icon with counter - Profile dropdown menu - Theme toggle (light/dark) - Settings quick access ### Global Footer - Platform information - Quick links to main sections - Social media links - Newsletter subscription - Terms and Privacy links - Language selector ## 1. Landing Page (Unauthenticated) ### Hero Section - Large, engaging headline - Brief platform description - Sign up/Login buttons (prominent) - Animated book showcase - Social proof counter (readers, books, etc.) ### Feature Highlights - 3-4 main features with icons - Interactive demonstrations - Animated transitions - "How it works" section ### Social Proof Section - User testimonials carousel - Partner publisher logos - Reading statistics - Awards/Recognition ### Call-to-Action - Free trial promotion - Feature comparison table - FAQ accordion - Registration form ## 2. Home Dashboard (Authenticated) ### Header Section - Personalized greeting - Daily reading goal progress - Current reading streak - Quick actions bar ### Currently Reading Section - Book cover carousel - Progress indicators - "Continue Reading" buttons - Time left estimates - Last read timestamp ### Recommended Section - AI-powered recommendations grid - Category-based sorting - Hover previews - Quick-add to reading list ### Reading Stats Widget - Reading pace graph - Completion trends - Genre distribution chart - Achievement progress ### Community Activity Feed - Friend updates - Book club activities - Discussion highlights - Reading challenges ## 3. Book Reader Interface ### Top Bar - Book title and author - Chapter navigation - Progress indicator - Reading time estimate - Bookmark button ### Reader Controls (Collapsible) - Font size adjustment - Line spacing control - Margin width slider - Theme selection - Layout options (single/double page) ### Sidebar Tools - Table of contents - Bookmarks list - Annotations panel - Search in book - Dictionary lookup ### Reading View - Clean, distraction-free layout - Smooth page transitions - Progress bar (bottom) - Page numbers - Chapter markers ### Annotation Tools - Highlight options (multiple colors) - Note-taking interface - Drawing tools - Image annotation - Sharing options ## 4. Library Page ### Filter Panel (Left Sidebar) - Genre hierarchy - Author filter - Publication year range - Reading status filter - Rating filter - Format filter - Advanced search options ### Book Grid View - Customizable grid/list toggle - Sort options - Cover thumbnails - Quick info on hover - Batch selection tools ### Book Card Components - Cover image - Title and author - Rating display - Progress indicator - Reading status badge - Quick action buttons - Add to list button ### List Management - Custom shelves - Reading lists - Want to read - Currently reading - Completed books ## 5. Community Hub ### Activity Feed - Real-time updates - Friend activities - Reading challenges - Discussion threads - Book club events ### Book Clubs Section - Active clubs list - Meeting schedule - Reading progress - Discussion boards - Video chat integration ### Reading Challenges - Active challenges - Progress tracking - Leaderboards - Achievement badges - Challenge creation tool ### Social Features - Friend suggestions - Reading compatibility - Direct messaging - Group chats - Content sharing ## 6. Profile Page ### Profile Header - User avatar - Bio section - Reading statistics - Achievement badges - Social links ### Reading History - Timeline view - Rating history - Review history - Reading patterns - Genre preferences ### Personal Library - Custom collections - Favorite books - Want to read - Currently reading - Completed books ### Achievement Gallery - Badge collection - Progress tracking - Milestone timeline - Ranking information - Challenge history ## 7. Settings Page ### Account Settings - Profile information - Email preferences - Password management - Connected accounts - Privacy controls ### Reading Preferences - Default font settings - Theme preferences - Reading mode defaults - Progress tracking - Notification settings ### Accessibility Options - Font size presets - High contrast mode - Screen reader support - Keyboard shortcuts - Reading guides ### Data Management - Export options - Backup settings - Data privacy - Usage statistics - Device sync ## Mobile Responsiveness ### Mobile Navigation - Bottom navigation bar - Swipe gestures - Condensed menus - Quick access buttons - Reading mode toggle ### Mobile Reader - Full-screen mode - Touch-friendly controls - Gesture navigation - Simplified interface - Offline access ### Mobile-Specific Features - Reading progress widget - Quick bookmarks - Share sheet integration - Screen orientation lock - Picture-in-picture support ## UI States ### Loading States - Skeleton screens - Progress indicators - Placeholder content - Loading animations - Error states ### Empty States - Helpful messaging - Suggested actions - Illustration/icons - Quick start guides - Sample content ### Error Handling - User-friendly messages - Recovery options - Contact support - Offline indicators - Retry mechanisms