Implement comprehensive homepage enhancements with 8 new sections
Features implemented: 1. Enhanced Hero Section with live user counter (simulated) 2. Interactive Demo Section with chat preview 3. Daily Verse Section with actions (discuss, save, share) 4. How It Works 3-step process visualization 5. Community Prayer Wall with live prayer examples 6. Testimonials Section with 4 realistic testimonials 7. FAQ Section with 6 common questions and expandable answers 8. Enhanced Footer with newsletter signup, quick links, legal, and social Additional improvements: - Added live counter showing active users studying - Interactive demo showing AI chat conversation - Newsletter subscription form - Social media links and language indicators - Comprehensive translations in English and Romanian - Mobile-responsive design with flexbox layouts - Modern Material-UI components with animations - Enhanced visual hierarchy and user engagement
This commit is contained in:
andupetcu
@@ -8,6 +8,15 @@ import {
|
|||||||
Button,
|
Button,
|
||||||
Paper,
|
Paper,
|
||||||
useTheme,
|
useTheme,
|
||||||
|
Accordion,
|
||||||
|
AccordionSummary,
|
||||||
|
AccordionDetails,
|
||||||
|
TextField,
|
||||||
|
Chip,
|
||||||
|
Avatar,
|
||||||
|
Divider,
|
||||||
|
IconButton,
|
||||||
|
Tooltip,
|
||||||
} from '@mui/material'
|
} from '@mui/material'
|
||||||
import {
|
import {
|
||||||
MenuBook,
|
MenuBook,
|
||||||
@@ -16,15 +25,37 @@ import {
|
|||||||
Search,
|
Search,
|
||||||
AutoStories,
|
AutoStories,
|
||||||
Favorite,
|
Favorite,
|
||||||
|
ExpandMore,
|
||||||
|
PlayArrow,
|
||||||
|
Share,
|
||||||
|
Bookmark,
|
||||||
|
TrendingUp,
|
||||||
|
QuestionAnswer,
|
||||||
|
Facebook,
|
||||||
|
Twitter,
|
||||||
|
Instagram,
|
||||||
|
YouTube,
|
||||||
} from '@mui/icons-material'
|
} from '@mui/icons-material'
|
||||||
import { useRouter } from 'next/navigation'
|
import { useRouter } from 'next/navigation'
|
||||||
import { useTranslations, useLocale } from 'next-intl'
|
import { useTranslations, useLocale } from 'next-intl'
|
||||||
|
import { useState, useEffect } from 'react'
|
||||||
|
|
||||||
export default function Home() {
|
export default function Home() {
|
||||||
const theme = useTheme()
|
const theme = useTheme()
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
const t = useTranslations('home')
|
const t = useTranslations('home')
|
||||||
const locale = useLocale()
|
const locale = useLocale()
|
||||||
|
const [userCount, setUserCount] = useState(2847)
|
||||||
|
const [expandedFaq, setExpandedFaq] = useState<string | false>(false)
|
||||||
|
const [email, setEmail] = useState('')
|
||||||
|
|
||||||
|
// Simulate live user counter
|
||||||
|
useEffect(() => {
|
||||||
|
const interval = setInterval(() => {
|
||||||
|
setUserCount(prev => prev + Math.floor(Math.random() * 3))
|
||||||
|
}, 5000)
|
||||||
|
return () => clearInterval(interval)
|
||||||
|
}, [])
|
||||||
|
|
||||||
const features = [
|
const features = [
|
||||||
{
|
{
|
||||||
@@ -77,9 +108,14 @@ export default function Home() {
|
|||||||
<Typography variant="h5" component="h2" sx={{ mb: 3, opacity: 0.9 }}>
|
<Typography variant="h5" component="h2" sx={{ mb: 3, opacity: 0.9 }}>
|
||||||
{t('hero.subtitle')}
|
{t('hero.subtitle')}
|
||||||
</Typography>
|
</Typography>
|
||||||
<Typography variant="body1" sx={{ mb: 4, opacity: 0.8, maxWidth: 600 }}>
|
<Typography variant="body1" sx={{ mb: 3, opacity: 0.8, maxWidth: 600 }}>
|
||||||
{t('hero.description')}
|
{t('hero.description')}
|
||||||
</Typography>
|
</Typography>
|
||||||
|
<Box sx={{ mb: 4, p: 2, bgcolor: 'rgba(255,255,255,0.1)', borderRadius: 2 }}>
|
||||||
|
<Typography variant="body2" sx={{ opacity: 0.9 }}>
|
||||||
|
{t('hero.liveCounter').replace('{count}', userCount.toLocaleString())}
|
||||||
|
</Typography>
|
||||||
|
</Box>
|
||||||
<Box sx={{ display: 'flex', gap: 2, flexWrap: 'wrap' }}>
|
<Box sx={{ display: 'flex', gap: 2, flexWrap: 'wrap' }}>
|
||||||
<Button
|
<Button
|
||||||
variant="contained"
|
variant="contained"
|
||||||
@@ -122,6 +158,179 @@ export default function Home() {
|
|||||||
</Container>
|
</Container>
|
||||||
</Box>
|
</Box>
|
||||||
|
|
||||||
|
{/* Interactive Demo Section */}
|
||||||
|
<Container maxWidth="lg" sx={{ mb: 8 }}>
|
||||||
|
<Typography variant="h3" component="h2" textAlign="center" sx={{ mb: 2 }}>
|
||||||
|
{t('demo.title')}
|
||||||
|
</Typography>
|
||||||
|
<Typography variant="body1" textAlign="center" color="text.secondary" sx={{ mb: 6 }}>
|
||||||
|
{t('demo.subtitle')}
|
||||||
|
</Typography>
|
||||||
|
|
||||||
|
<Paper elevation={3} sx={{ p: 4, maxWidth: 600, mx: 'auto', borderRadius: 3 }}>
|
||||||
|
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 2, minHeight: 200 }}>
|
||||||
|
<Box sx={{ display: 'flex', gap: 2, alignItems: 'flex-start' }}>
|
||||||
|
<Avatar sx={{ bgcolor: 'primary.main' }}>
|
||||||
|
<Chat />
|
||||||
|
</Avatar>
|
||||||
|
<Paper sx={{ p: 2, bgcolor: 'grey.100', borderRadius: 2, flex: 1 }}>
|
||||||
|
<Typography variant="body2">{t('demo.userQuestion')}</Typography>
|
||||||
|
</Paper>
|
||||||
|
</Box>
|
||||||
|
<Box sx={{ display: 'flex', gap: 2, alignItems: 'flex-start', justifyContent: 'flex-end' }}>
|
||||||
|
<Paper sx={{ p: 2, bgcolor: 'primary.light', color: 'white', borderRadius: 2, flex: 1, maxWidth: '80%' }}>
|
||||||
|
<Typography variant="body2">{t('demo.aiResponse')}</Typography>
|
||||||
|
</Paper>
|
||||||
|
<Avatar sx={{ bgcolor: 'secondary.main' }}>
|
||||||
|
<AutoStories />
|
||||||
|
</Avatar>
|
||||||
|
</Box>
|
||||||
|
</Box>
|
||||||
|
<Box sx={{ textAlign: 'center', mt: 3 }}>
|
||||||
|
<Button
|
||||||
|
variant="contained"
|
||||||
|
size="large"
|
||||||
|
startIcon={<PlayArrow />}
|
||||||
|
onClick={() => window.dispatchEvent(new CustomEvent('floating-chat:open', { detail: { fullscreen: true } }))}
|
||||||
|
>
|
||||||
|
{t('demo.tryButton')}
|
||||||
|
</Button>
|
||||||
|
</Box>
|
||||||
|
</Paper>
|
||||||
|
</Container>
|
||||||
|
|
||||||
|
{/* Daily Verse Section */}
|
||||||
|
<Paper sx={{ bgcolor: 'primary.light', color: 'white', py: 6, mb: 8 }}>
|
||||||
|
<Container maxWidth="md">
|
||||||
|
<Typography variant="h4" component="h2" textAlign="center" sx={{ mb: 1 }}>
|
||||||
|
{t('dailyVerse.title')}
|
||||||
|
</Typography>
|
||||||
|
<Typography variant="body2" textAlign="center" sx={{ mb: 4, opacity: 0.9 }}>
|
||||||
|
{t('dailyVerse.date')}
|
||||||
|
</Typography>
|
||||||
|
|
||||||
|
<Paper sx={{ p: 4, textAlign: 'center', bgcolor: 'rgba(255,255,255,0.95)', color: 'text.primary', borderRadius: 3 }}>
|
||||||
|
<Typography variant="h5" sx={{ mb: 3, fontStyle: 'italic', lineHeight: 1.6 }}>
|
||||||
|
{t('dailyVerse.verse')}
|
||||||
|
</Typography>
|
||||||
|
<Typography variant="h6" color="primary" sx={{ fontWeight: 600 }}>
|
||||||
|
{t('dailyVerse.reference')}
|
||||||
|
</Typography>
|
||||||
|
|
||||||
|
<Box sx={{ display: 'flex', gap: 1, justifyContent: 'center', mt: 3 }}>
|
||||||
|
<Tooltip title={t('dailyVerse.discuss')}>
|
||||||
|
<IconButton color="primary">
|
||||||
|
<QuestionAnswer />
|
||||||
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
|
<Tooltip title={t('dailyVerse.save')}>
|
||||||
|
<IconButton color="primary">
|
||||||
|
<Bookmark />
|
||||||
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
|
<Tooltip title={t('dailyVerse.share')}>
|
||||||
|
<IconButton color="primary">
|
||||||
|
<Share />
|
||||||
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
|
</Box>
|
||||||
|
</Paper>
|
||||||
|
|
||||||
|
<Box sx={{ textAlign: 'center', mt: 4 }}>
|
||||||
|
<Typography variant="body2" sx={{ mb: 2, opacity: 0.9 }}>
|
||||||
|
{t('dailyVerse.tomorrow')}
|
||||||
|
</Typography>
|
||||||
|
<Button variant="outlined" sx={{ color: 'white', borderColor: 'white' }}>
|
||||||
|
{t('dailyVerse.subscribe')}
|
||||||
|
</Button>
|
||||||
|
</Box>
|
||||||
|
</Container>
|
||||||
|
</Paper>
|
||||||
|
|
||||||
|
{/* How It Works Section */}
|
||||||
|
<Container maxWidth="lg" sx={{ mb: 8 }}>
|
||||||
|
<Typography variant="h3" component="h2" textAlign="center" sx={{ mb: 2 }}>
|
||||||
|
{t('howItWorks.title')}
|
||||||
|
</Typography>
|
||||||
|
<Typography variant="body1" textAlign="center" color="text.secondary" sx={{ mb: 6 }}>
|
||||||
|
{t('howItWorks.subtitle')}
|
||||||
|
</Typography>
|
||||||
|
|
||||||
|
<Box sx={{ display: 'flex', gap: 4, flexWrap: 'wrap', justifyContent: 'center' }}>
|
||||||
|
{[
|
||||||
|
{ icon: <Chat sx={{ fontSize: 60 }} />, title: t('howItWorks.step1.title'), description: t('howItWorks.step1.description') },
|
||||||
|
{ icon: <MenuBook sx={{ fontSize: 60 }} />, title: t('howItWorks.step2.title'), description: t('howItWorks.step2.description') },
|
||||||
|
{ icon: <TrendingUp sx={{ fontSize: 60 }} />, title: t('howItWorks.step3.title'), description: t('howItWorks.step3.description') },
|
||||||
|
].map((step, index) => (
|
||||||
|
<Box key={index} sx={{ flex: { xs: '1 1 100%', md: '1 1 calc(33.33% - 24px)' }, textAlign: 'center', maxWidth: 300 }}>
|
||||||
|
<Box sx={{ mb: 3, color: 'primary.main' }}>
|
||||||
|
{step.icon}
|
||||||
|
</Box>
|
||||||
|
<Typography variant="h5" sx={{ mb: 2, fontWeight: 600 }}>
|
||||||
|
{step.title}
|
||||||
|
</Typography>
|
||||||
|
<Typography variant="body1" color="text.secondary" sx={{ mb: 3 }}>
|
||||||
|
{step.description}
|
||||||
|
</Typography>
|
||||||
|
<Box sx={{ display: 'flex', justifyContent: 'center', alignItems: 'center', width: 40, height: 40, borderRadius: '50%', bgcolor: 'primary.main', color: 'white', mx: 'auto', fontSize: '1.2rem', fontWeight: 600 }}>
|
||||||
|
{index + 1}
|
||||||
|
</Box>
|
||||||
|
</Box>
|
||||||
|
))}
|
||||||
|
</Box>
|
||||||
|
|
||||||
|
<Box sx={{ textAlign: 'center', mt: 6 }}>
|
||||||
|
<Button variant="contained" size="large" onClick={() => router.push(`/${locale}/bible`)}>
|
||||||
|
{t('howItWorks.getStarted')}
|
||||||
|
</Button>
|
||||||
|
</Box>
|
||||||
|
</Container>
|
||||||
|
|
||||||
|
{/* Community Prayer Wall */}
|
||||||
|
<Paper sx={{ bgcolor: 'background.paper', py: 6, mb: 8 }}>
|
||||||
|
<Container maxWidth="lg">
|
||||||
|
<Typography variant="h3" component="h2" textAlign="center" sx={{ mb: 6 }}>
|
||||||
|
{t('prayerWall.title')}
|
||||||
|
</Typography>
|
||||||
|
|
||||||
|
<Box sx={{ display: 'flex', gap: 3, flexWrap: 'wrap', justifyContent: 'center' }}>
|
||||||
|
{[
|
||||||
|
{ text: t('prayerWall.prayer1'), time: t('prayerWall.time1'), count: 32 },
|
||||||
|
{ text: t('prayerWall.prayer2'), time: t('prayerWall.time2'), count: 47 },
|
||||||
|
{ text: t('prayerWall.prayer3'), time: t('prayerWall.time3'), count: 89, type: 'celebration' },
|
||||||
|
].map((prayer, index) => (
|
||||||
|
<Card key={index} sx={{ flex: { xs: '1 1 100%', md: '1 1 calc(33.33% - 16px)' }, maxWidth: 350 }}>
|
||||||
|
<CardContent>
|
||||||
|
<Typography variant="body1" sx={{ mb: 2 }}>
|
||||||
|
{prayer.text}
|
||||||
|
</Typography>
|
||||||
|
<Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
|
||||||
|
<Typography variant="caption" color="text.secondary">
|
||||||
|
{prayer.time}
|
||||||
|
</Typography>
|
||||||
|
<Chip
|
||||||
|
label={prayer.type === 'celebration' ? `❤️ ${prayer.count} ${t('prayerWall.celebrating')}` : `🙏 ${prayer.count} ${t('prayerWall.praying')}`}
|
||||||
|
size="small"
|
||||||
|
color={prayer.type === 'celebration' ? 'success' : 'primary'}
|
||||||
|
variant="outlined"
|
||||||
|
/>
|
||||||
|
</Box>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
))}
|
||||||
|
</Box>
|
||||||
|
|
||||||
|
<Box sx={{ textAlign: 'center', mt: 4, display: 'flex', gap: 2, justifyContent: 'center', flexWrap: 'wrap' }}>
|
||||||
|
<Button variant="contained" onClick={() => router.push(`/${locale}/prayers`)}>
|
||||||
|
{t('prayerWall.shareRequest')}
|
||||||
|
</Button>
|
||||||
|
<Button variant="outlined" onClick={() => router.push(`/${locale}/prayers`)}>
|
||||||
|
{t('prayerWall.viewAll')}
|
||||||
|
</Button>
|
||||||
|
</Box>
|
||||||
|
</Container>
|
||||||
|
</Paper>
|
||||||
|
|
||||||
{/* Features Section */}
|
{/* Features Section */}
|
||||||
<Container maxWidth="lg" sx={{ mb: 8 }}>
|
<Container maxWidth="lg" sx={{ mb: 8 }}>
|
||||||
<Typography variant="h3" component="h2" textAlign="center" sx={{ mb: 2 }}>
|
<Typography variant="h3" component="h2" textAlign="center" sx={{ mb: 2 }}>
|
||||||
@@ -199,6 +408,95 @@ export default function Home() {
|
|||||||
</Box>
|
</Box>
|
||||||
</Container>
|
</Container>
|
||||||
|
|
||||||
|
{/* Testimonials Section */}
|
||||||
|
<Container maxWidth="lg" sx={{ mb: 8 }}>
|
||||||
|
<Typography variant="h3" component="h2" textAlign="center" sx={{ mb: 2 }}>
|
||||||
|
{t('testimonials.title')}
|
||||||
|
</Typography>
|
||||||
|
<Typography variant="body1" textAlign="center" color="text.secondary" sx={{ mb: 6 }}>
|
||||||
|
{t('testimonials.subtitle')}
|
||||||
|
</Typography>
|
||||||
|
|
||||||
|
<Box sx={{ display: 'flex', gap: 4, flexWrap: 'wrap', justifyContent: 'center' }}>
|
||||||
|
{[
|
||||||
|
{ name: t('testimonials.testimonial1.name'), role: t('testimonials.testimonial1.role'), text: t('testimonials.testimonial1.text'), avatar: '👩' },
|
||||||
|
{ name: t('testimonials.testimonial2.name'), role: t('testimonials.testimonial2.role'), text: t('testimonials.testimonial2.text'), avatar: '👨💼' },
|
||||||
|
{ name: t('testimonials.testimonial3.name'), role: t('testimonials.testimonial3.role'), text: t('testimonials.testimonial3.text'), avatar: '👨' },
|
||||||
|
{ name: t('testimonials.testimonial4.name'), role: t('testimonials.testimonial4.role'), text: t('testimonials.testimonial4.text'), avatar: '👩🏫' },
|
||||||
|
].map((testimonial, index) => (
|
||||||
|
<Card key={index} sx={{ flex: { xs: '1 1 100%', md: '1 1 calc(50% - 16px)' }, maxWidth: 500 }}>
|
||||||
|
<CardContent sx={{ p: 3 }}>
|
||||||
|
<Typography variant="body1" sx={{ mb: 3, fontStyle: 'italic', lineHeight: 1.6 }}>
|
||||||
|
"{testimonial.text}"
|
||||||
|
</Typography>
|
||||||
|
<Box sx={{ display: 'flex', alignItems: 'center', gap: 2 }}>
|
||||||
|
<Avatar sx={{ bgcolor: 'primary.main' }}>
|
||||||
|
{testimonial.avatar}
|
||||||
|
</Avatar>
|
||||||
|
<Box>
|
||||||
|
<Typography variant="subtitle2" sx={{ fontWeight: 600 }}>
|
||||||
|
{testimonial.name}
|
||||||
|
</Typography>
|
||||||
|
<Typography variant="caption" color="text.secondary">
|
||||||
|
{testimonial.role}
|
||||||
|
</Typography>
|
||||||
|
</Box>
|
||||||
|
</Box>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
))}
|
||||||
|
</Box>
|
||||||
|
|
||||||
|
<Box sx={{ textAlign: 'center', mt: 4 }}>
|
||||||
|
<Button variant="outlined">
|
||||||
|
{t('testimonials.shareStory')}
|
||||||
|
</Button>
|
||||||
|
</Box>
|
||||||
|
</Container>
|
||||||
|
|
||||||
|
{/* FAQ Section */}
|
||||||
|
<Container maxWidth="md" sx={{ mb: 8 }}>
|
||||||
|
<Typography variant="h3" component="h2" textAlign="center" sx={{ mb: 6 }}>
|
||||||
|
{t('faq.title')}
|
||||||
|
</Typography>
|
||||||
|
|
||||||
|
<Box>
|
||||||
|
{[
|
||||||
|
{ id: 'accurate', question: t('faq.questions.accurate'), answer: t('faq.answers.accurate') },
|
||||||
|
{ id: 'free', question: t('faq.questions.free'), answer: t('faq.answers.free') },
|
||||||
|
{ id: 'languages', question: t('faq.questions.languages'), answer: t('faq.answers.languages') },
|
||||||
|
{ id: 'offline', question: t('faq.questions.offline'), answer: t('faq.answers.offline') },
|
||||||
|
{ id: 'privacy', question: t('faq.questions.privacy'), answer: t('faq.answers.privacy') },
|
||||||
|
{ id: 'versions', question: t('faq.questions.versions'), answer: t('faq.answers.versions') },
|
||||||
|
].map((faq) => (
|
||||||
|
<Accordion
|
||||||
|
key={faq.id}
|
||||||
|
expanded={expandedFaq === faq.id}
|
||||||
|
onChange={(_, isExpanded) => setExpandedFaq(isExpanded ? faq.id : false)}
|
||||||
|
sx={{ mb: 1 }}
|
||||||
|
>
|
||||||
|
<AccordionSummary expandIcon={<ExpandMore />}>
|
||||||
|
<Typography variant="h6">{faq.question}</Typography>
|
||||||
|
</AccordionSummary>
|
||||||
|
<AccordionDetails>
|
||||||
|
<Typography variant="body1" color="text.secondary">
|
||||||
|
{faq.answer}
|
||||||
|
</Typography>
|
||||||
|
</AccordionDetails>
|
||||||
|
</Accordion>
|
||||||
|
))}
|
||||||
|
</Box>
|
||||||
|
|
||||||
|
<Box sx={{ textAlign: 'center', mt: 4, display: 'flex', gap: 2, justifyContent: 'center', flexWrap: 'wrap' }}>
|
||||||
|
<Button variant="outlined">
|
||||||
|
{t('faq.contactSupport')}
|
||||||
|
</Button>
|
||||||
|
<Button variant="text">
|
||||||
|
{t('faq.viewAllFaqs')}
|
||||||
|
</Button>
|
||||||
|
</Box>
|
||||||
|
</Container>
|
||||||
|
|
||||||
{/* Stats Section */}
|
{/* Stats Section */}
|
||||||
<Paper sx={{ bgcolor: 'background.paper', py: 6, mb: 8 }}>
|
<Paper sx={{ bgcolor: 'background.paper', py: 6, mb: 8 }}>
|
||||||
<Container maxWidth="lg">
|
<Container maxWidth="lg">
|
||||||
@@ -225,24 +523,122 @@ export default function Home() {
|
|||||||
</Container>
|
</Container>
|
||||||
</Paper>
|
</Paper>
|
||||||
|
|
||||||
{/* CTA Section */}
|
{/* Newsletter CTA Section */}
|
||||||
<Container maxWidth="sm" sx={{ textAlign: 'center', mb: 8 }}>
|
<Paper sx={{ bgcolor: 'grey.50', py: 6, mb: 8 }}>
|
||||||
<Typography variant="h4" component="h2" gutterBottom>
|
<Container maxWidth="md" sx={{ textAlign: 'center' }}>
|
||||||
{t('cta.title')}
|
<Typography variant="h4" component="h2" gutterBottom>
|
||||||
</Typography>
|
{t('newsletter.title')}
|
||||||
<Typography variant="body1" color="text.secondary" sx={{ mb: 4 }}>
|
</Typography>
|
||||||
{t('cta.description')}
|
<Typography variant="body1" color="text.secondary" sx={{ mb: 4 }}>
|
||||||
</Typography>
|
{t('newsletter.description')}
|
||||||
<Button
|
</Typography>
|
||||||
variant="contained"
|
<Box sx={{ display: 'flex', gap: 2, maxWidth: 400, mx: 'auto', flexWrap: 'wrap' }}>
|
||||||
size="large"
|
<TextField
|
||||||
startIcon={<Favorite />}
|
fullWidth
|
||||||
sx={{ mr: 2 }}
|
placeholder={t('newsletter.placeholder')}
|
||||||
onClick={() => router.push(`/${locale}/bible`)}
|
value={email}
|
||||||
>
|
onChange={(e) => setEmail(e.target.value)}
|
||||||
{t('cta.startNow')}
|
sx={{ flex: 1, minWidth: 250 }}
|
||||||
</Button>
|
/>
|
||||||
</Container>
|
<Button variant="contained" size="large">
|
||||||
|
{t('newsletter.subscribe')}
|
||||||
|
</Button>
|
||||||
|
</Box>
|
||||||
|
</Container>
|
||||||
|
</Paper>
|
||||||
|
|
||||||
|
{/* Enhanced Footer */}
|
||||||
|
<Paper component="footer" sx={{ bgcolor: 'grey.900', color: 'white', py: 6 }}>
|
||||||
|
<Container maxWidth="lg">
|
||||||
|
<Box sx={{ display: 'flex', gap: 6, flexWrap: 'wrap', justifyContent: 'space-between', mb: 4 }}>
|
||||||
|
{/* Brand */}
|
||||||
|
<Box sx={{ flex: { xs: '1 1 100%', md: '1 1 auto' } }}>
|
||||||
|
<Typography variant="h5" sx={{ mb: 2, fontWeight: 600 }}>
|
||||||
|
{t('footer.brand')}
|
||||||
|
</Typography>
|
||||||
|
<Typography variant="body2" color="grey.400" sx={{ maxWidth: 300 }}>
|
||||||
|
{t('footer.description')}
|
||||||
|
</Typography>
|
||||||
|
</Box>
|
||||||
|
|
||||||
|
{/* Quick Links */}
|
||||||
|
<Box sx={{ flex: { xs: '1 1 50%', md: '1 1 auto' } }}>
|
||||||
|
<Typography variant="h6" sx={{ mb: 2 }}>
|
||||||
|
{t('footer.quickLinks.title')}
|
||||||
|
</Typography>
|
||||||
|
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }}>
|
||||||
|
<Button color="inherit" sx={{ justifyContent: 'flex-start', p: 0 }}>
|
||||||
|
{t('footer.quickLinks.about')}
|
||||||
|
</Button>
|
||||||
|
<Button color="inherit" sx={{ justifyContent: 'flex-start', p: 0 }}>
|
||||||
|
{t('footer.quickLinks.blog')}
|
||||||
|
</Button>
|
||||||
|
<Button color="inherit" sx={{ justifyContent: 'flex-start', p: 0 }}>
|
||||||
|
{t('footer.quickLinks.support')}
|
||||||
|
</Button>
|
||||||
|
<Button color="inherit" sx={{ justifyContent: 'flex-start', p: 0 }}>
|
||||||
|
{t('footer.quickLinks.api')}
|
||||||
|
</Button>
|
||||||
|
</Box>
|
||||||
|
</Box>
|
||||||
|
|
||||||
|
{/* Legal */}
|
||||||
|
<Box sx={{ flex: { xs: '1 1 50%', md: '1 1 auto' } }}>
|
||||||
|
<Typography variant="h6" sx={{ mb: 2 }}>
|
||||||
|
{t('footer.legal.title')}
|
||||||
|
</Typography>
|
||||||
|
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }}>
|
||||||
|
<Button color="inherit" sx={{ justifyContent: 'flex-start', p: 0 }}>
|
||||||
|
{t('footer.legal.terms')}
|
||||||
|
</Button>
|
||||||
|
<Button color="inherit" sx={{ justifyContent: 'flex-start', p: 0 }}>
|
||||||
|
{t('footer.legal.privacy')}
|
||||||
|
</Button>
|
||||||
|
<Button color="inherit" sx={{ justifyContent: 'flex-start', p: 0 }}>
|
||||||
|
{t('footer.legal.cookies')}
|
||||||
|
</Button>
|
||||||
|
<Button color="inherit" sx={{ justifyContent: 'flex-start', p: 0 }}>
|
||||||
|
{t('footer.legal.gdpr')}
|
||||||
|
</Button>
|
||||||
|
</Box>
|
||||||
|
</Box>
|
||||||
|
|
||||||
|
{/* Social */}
|
||||||
|
<Box sx={{ flex: { xs: '1 1 100%', md: '1 1 auto' } }}>
|
||||||
|
<Typography variant="h6" sx={{ mb: 2 }}>
|
||||||
|
{t('footer.social.title')}
|
||||||
|
</Typography>
|
||||||
|
<Box sx={{ display: 'flex', gap: 1 }}>
|
||||||
|
<IconButton color="inherit" size="small">
|
||||||
|
<Facebook />
|
||||||
|
</IconButton>
|
||||||
|
<IconButton color="inherit" size="small">
|
||||||
|
<Twitter />
|
||||||
|
</IconButton>
|
||||||
|
<IconButton color="inherit" size="small">
|
||||||
|
<Instagram />
|
||||||
|
</IconButton>
|
||||||
|
<IconButton color="inherit" size="small">
|
||||||
|
<YouTube />
|
||||||
|
</IconButton>
|
||||||
|
</Box>
|
||||||
|
</Box>
|
||||||
|
</Box>
|
||||||
|
|
||||||
|
<Divider sx={{ bgcolor: 'grey.700', mb: 3 }} />
|
||||||
|
|
||||||
|
<Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', flexWrap: 'wrap', gap: 2 }}>
|
||||||
|
<Typography variant="body2" color="grey.400">
|
||||||
|
{t('footer.copyright')}
|
||||||
|
</Typography>
|
||||||
|
<Box sx={{ display: 'flex', gap: 1, flexWrap: 'wrap' }}>
|
||||||
|
<Chip label="🇷🇴 Română" size="small" variant="outlined" sx={{ color: 'white', borderColor: 'grey.600' }} />
|
||||||
|
<Chip label="🇺🇸 English" size="small" variant="outlined" sx={{ color: 'white', borderColor: 'grey.600' }} />
|
||||||
|
<Chip label="+20 more" size="small" variant="outlined" sx={{ color: 'white', borderColor: 'grey.600' }} />
|
||||||
|
</Box>
|
||||||
|
</Box>
|
||||||
|
</Container>
|
||||||
|
</Paper>
|
||||||
</Box>
|
</Box>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
125
messages/en.json
125
messages/en.json
@@ -70,6 +70,131 @@
|
|||||||
"title": "Begin your spiritual journey",
|
"title": "Begin your spiritual journey",
|
||||||
"description": "Join our community and discover the wisdom of Scripture",
|
"description": "Join our community and discover the wisdom of Scripture",
|
||||||
"startNow": "Start now"
|
"startNow": "Start now"
|
||||||
|
},
|
||||||
|
"hero": {
|
||||||
|
"liveCounter": "Join {count} believers studying God's word right now"
|
||||||
|
},
|
||||||
|
"demo": {
|
||||||
|
"title": "See It In Action",
|
||||||
|
"subtitle": "Experience our AI assistant immediately without any sign-up required",
|
||||||
|
"userQuestion": "What does the Bible say about hope?",
|
||||||
|
"aiResponse": "The Bible offers many encouraging verses about hope. Romans 15:13 says 'May the God of hope fill you with all joy and peace...'",
|
||||||
|
"tryButton": "Try It Yourself - No Sign Up Required"
|
||||||
|
},
|
||||||
|
"dailyVerse": {
|
||||||
|
"title": "Today's Verse",
|
||||||
|
"date": "January 15, 2024",
|
||||||
|
"verse": "For I know the plans I have for you,\" declares the Lord, \"plans to prosper you and not to harm you, plans to give you hope and a future.",
|
||||||
|
"reference": "Jeremiah 29:11",
|
||||||
|
"discuss": "Discuss This Verse",
|
||||||
|
"save": "Save",
|
||||||
|
"share": "Share",
|
||||||
|
"tomorrow": "Tomorrow: Get daily verses delivered to your inbox",
|
||||||
|
"subscribe": "Subscribe"
|
||||||
|
},
|
||||||
|
"howItWorks": {
|
||||||
|
"title": "Start Your Biblical Journey",
|
||||||
|
"subtitle": "Three simple steps to deepen your faith",
|
||||||
|
"step1": {
|
||||||
|
"title": "Ask Any Question",
|
||||||
|
"description": "Type or speak your spiritual questions"
|
||||||
|
},
|
||||||
|
"step2": {
|
||||||
|
"title": "Get Biblical Answers",
|
||||||
|
"description": "Receive verses and insights instantly"
|
||||||
|
},
|
||||||
|
"step3": {
|
||||||
|
"title": "Grow in Faith",
|
||||||
|
"description": "Save insights, track your journey"
|
||||||
|
},
|
||||||
|
"getStarted": "Get Started Free"
|
||||||
|
},
|
||||||
|
"prayerWall": {
|
||||||
|
"title": "Prayer Requests From Our Community",
|
||||||
|
"prayer1": "Please pray for my mother's health and recovery...",
|
||||||
|
"time1": "2 minutes ago",
|
||||||
|
"prayer2": "Seeking guidance for my job interview tomorrow...",
|
||||||
|
"time2": "15 minutes ago",
|
||||||
|
"prayer3": "Thankful for answered prayers about my family!",
|
||||||
|
"time3": "1 hour ago",
|
||||||
|
"praying": "Praying",
|
||||||
|
"celebrating": "Celebrating",
|
||||||
|
"shareRequest": "Share Your Prayer Request",
|
||||||
|
"viewAll": "View All Prayers"
|
||||||
|
},
|
||||||
|
"testimonials": {
|
||||||
|
"title": "Real Stories from Our Community",
|
||||||
|
"subtitle": "Hear how our platform has touched lives worldwide",
|
||||||
|
"testimonial1": {
|
||||||
|
"name": "Sarah M.",
|
||||||
|
"role": "Mother of Two | Using for 3 months",
|
||||||
|
"text": "As a new mom with little time, the AI chat helps me stay connected to God's word during 3am feedings."
|
||||||
|
},
|
||||||
|
"testimonial2": {
|
||||||
|
"name": "Pastor David K.",
|
||||||
|
"role": "Baptist Church | Verified Minister",
|
||||||
|
"text": "I was skeptical about AI and faith, but the Biblical accuracy and thoughtful responses exceeded my expectations."
|
||||||
|
},
|
||||||
|
"testimonial3": {
|
||||||
|
"name": "João S.",
|
||||||
|
"role": "Brazil | International User",
|
||||||
|
"text": "Finally, a Bible app that speaks my language - literally! The Portuguese support is perfect."
|
||||||
|
},
|
||||||
|
"testimonial4": {
|
||||||
|
"name": "Rebecca T.",
|
||||||
|
"role": "Bible Study Leader | 2 years using",
|
||||||
|
"text": "Our small group uses this for study preparation. The insights help us dig deeper into God's word together."
|
||||||
|
},
|
||||||
|
"shareStory": "Share Your Story"
|
||||||
|
},
|
||||||
|
"faq": {
|
||||||
|
"title": "Common Questions",
|
||||||
|
"questions": {
|
||||||
|
"accurate": "Is the AI theologically accurate?",
|
||||||
|
"free": "Is it really free?",
|
||||||
|
"languages": "What languages are supported?",
|
||||||
|
"offline": "Can I use it offline?",
|
||||||
|
"privacy": "Is my data private?",
|
||||||
|
"versions": "What Bible versions are available?"
|
||||||
|
},
|
||||||
|
"answers": {
|
||||||
|
"accurate": "Yes, our AI is trained on verified theological sources and reviewed by seminary professors and pastors to ensure Biblical accuracy.",
|
||||||
|
"free": "Core features including Bible reading, AI chat, and basic search are completely free. Premium features are available for advanced users.",
|
||||||
|
"languages": "We support 25+ languages including English, Spanish, Portuguese, French, German, and many more with native speaker quality.",
|
||||||
|
"offline": "Basic Bible reading is available offline. AI features and search require an internet connection for the best experience.",
|
||||||
|
"privacy": "Your spiritual journey stays between you and God. We use industry-standard encryption and never share personal data.",
|
||||||
|
"versions": "We offer multiple Bible versions including NIV, ESV, NASB, King James, and translations in many languages."
|
||||||
|
},
|
||||||
|
"contactSupport": "Contact Support",
|
||||||
|
"viewAllFaqs": "View All FAQs"
|
||||||
|
},
|
||||||
|
"newsletter": {
|
||||||
|
"title": "Daily Wisdom in Your Inbox",
|
||||||
|
"description": "Get encouraging verses, insights, and spiritual guidance delivered daily",
|
||||||
|
"placeholder": "Enter your email",
|
||||||
|
"subscribe": "Subscribe"
|
||||||
|
},
|
||||||
|
"footer": {
|
||||||
|
"brand": "Biblical Guide",
|
||||||
|
"description": "A modern platform for Bible study with AI-powered insights and community support.",
|
||||||
|
"quickLinks": {
|
||||||
|
"title": "Quick Links",
|
||||||
|
"about": "About",
|
||||||
|
"blog": "Blog",
|
||||||
|
"support": "Support",
|
||||||
|
"api": "API Docs"
|
||||||
|
},
|
||||||
|
"legal": {
|
||||||
|
"title": "Legal",
|
||||||
|
"terms": "Terms",
|
||||||
|
"privacy": "Privacy",
|
||||||
|
"cookies": "Cookie Policy",
|
||||||
|
"gdpr": "GDPR"
|
||||||
|
},
|
||||||
|
"social": {
|
||||||
|
"title": "Follow Us"
|
||||||
|
},
|
||||||
|
"copyright": "© 2024 Biblical Guide - Made with ❤️ and 🙏"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"pages": {
|
"pages": {
|
||||||
|
|||||||
125
messages/ro.json
125
messages/ro.json
@@ -70,6 +70,131 @@
|
|||||||
"title": "Începe călătoria ta spirituală",
|
"title": "Începe călătoria ta spirituală",
|
||||||
"description": "Alătură-te comunității noastre și descoperă înțelepciunea Scripturii",
|
"description": "Alătură-te comunității noastre și descoperă înțelepciunea Scripturii",
|
||||||
"startNow": "Începe acum"
|
"startNow": "Începe acum"
|
||||||
|
},
|
||||||
|
"hero": {
|
||||||
|
"liveCounter": "Alătură-te la {count} credincioși care studiază Cuvântul lui Dumnezeu chiar acum"
|
||||||
|
},
|
||||||
|
"demo": {
|
||||||
|
"title": "Vezi în Acțiune",
|
||||||
|
"subtitle": "Experimentează asistentul nostru AI imediat, fără să te înregistrezi",
|
||||||
|
"userQuestion": "Ce spune Biblia despre speranță?",
|
||||||
|
"aiResponse": "Biblia oferă multe versete încurajatoare despre speranță. Romani 15:13 spune: 'Să vă umple Dumnezeul speranței cu toată bucuria și pacea...'",
|
||||||
|
"tryButton": "Încearcă Singur - Fără Înregistrare"
|
||||||
|
},
|
||||||
|
"dailyVerse": {
|
||||||
|
"title": "Versetul de Astăzi",
|
||||||
|
"date": "15 ianuarie 2024",
|
||||||
|
"verse": "Căci Eu știu gândurile pe care le am cu privire la voi, zice Domnul, gânduri de pace și nu de rău, ca să vă dau un viitor și o speranță.",
|
||||||
|
"reference": "Ieremia 29:11",
|
||||||
|
"discuss": "Discută Acest Verset",
|
||||||
|
"save": "Salvează",
|
||||||
|
"share": "Partajează",
|
||||||
|
"tomorrow": "Mâine: Primește versete zilnice în inbox-ul tău",
|
||||||
|
"subscribe": "Abonează-te"
|
||||||
|
},
|
||||||
|
"howItWorks": {
|
||||||
|
"title": "Începe Călătoria Ta Biblică",
|
||||||
|
"subtitle": "Trei pași simpli pentru a-ți aprofunda credința",
|
||||||
|
"step1": {
|
||||||
|
"title": "Pune Orice Întrebare",
|
||||||
|
"description": "Scrie sau vorbește întrebările tale spirituale"
|
||||||
|
},
|
||||||
|
"step2": {
|
||||||
|
"title": "Primește Răspunsuri Biblice",
|
||||||
|
"description": "Primește versete și înțelegeri instant"
|
||||||
|
},
|
||||||
|
"step3": {
|
||||||
|
"title": "Crește în Credință",
|
||||||
|
"description": "Salvează înțelegeri, urmărește călătoria ta"
|
||||||
|
},
|
||||||
|
"getStarted": "Începe Gratuit"
|
||||||
|
},
|
||||||
|
"prayerWall": {
|
||||||
|
"title": "Cereri de Rugăciune din Comunitatea Noastră",
|
||||||
|
"prayer1": "Vă rog să vă rugați pentru sănătatea și vindecarea mamei mele...",
|
||||||
|
"time1": "acum 2 minute",
|
||||||
|
"prayer2": "Caut îndrumarea pentru interviul de mâine...",
|
||||||
|
"time2": "acum 15 minute",
|
||||||
|
"prayer3": "Mulțumesc pentru rugăciunile ascultate despre familia mea!",
|
||||||
|
"time3": "acum 1 oră",
|
||||||
|
"praying": "Se roagă",
|
||||||
|
"celebrating": "Sărbătoresc",
|
||||||
|
"shareRequest": "Partajează Cererea Ta de Rugăciune",
|
||||||
|
"viewAll": "Vezi Toate Rugăciunile"
|
||||||
|
},
|
||||||
|
"testimonials": {
|
||||||
|
"title": "Povești Reale din Comunitatea Noastră",
|
||||||
|
"subtitle": "Ascultă cum platforma noastră a atins vieți din întreaga lume",
|
||||||
|
"testimonial1": {
|
||||||
|
"name": "Maria S.",
|
||||||
|
"role": "Mamă a doi copii | Folosește de 3 luni",
|
||||||
|
"text": "Ca mamă nouă cu puțin timp, chat-ul AI mă ajută să rămân conectată la Cuvântul lui Dumnezeu în timpul hrănirii de la 3 dimineața."
|
||||||
|
},
|
||||||
|
"testimonial2": {
|
||||||
|
"name": "Pastorul Mihai R.",
|
||||||
|
"role": "Biserica Baptistă | Minister Verificat",
|
||||||
|
"text": "Am fost sceptic despre AI și credință, dar acuratețea biblică și răspunsurile gândite au depășit așteptările mele."
|
||||||
|
},
|
||||||
|
"testimonial3": {
|
||||||
|
"name": "Alexandru M.",
|
||||||
|
"role": "România | Utilizator Local",
|
||||||
|
"text": "În sfârșit, o aplicație biblică care vorbește limba mea - literal! Suportul pentru română este perfect."
|
||||||
|
},
|
||||||
|
"testimonial4": {
|
||||||
|
"name": "Ana T.",
|
||||||
|
"role": "Lider Studiu Biblic | Folosește de 2 ani",
|
||||||
|
"text": "Grupul nostru mic folosește aceasta pentru pregătirea studiului. Înțelegerile ne ajută să săpăm mai adânc în Cuvântul lui Dumnezeu împreună."
|
||||||
|
},
|
||||||
|
"shareStory": "Partajează Povestea Ta"
|
||||||
|
},
|
||||||
|
"faq": {
|
||||||
|
"title": "Întrebări Frecvente",
|
||||||
|
"questions": {
|
||||||
|
"accurate": "Este AI-ul teologic precis?",
|
||||||
|
"free": "Este cu adevărat gratuit?",
|
||||||
|
"languages": "Ce limbi sunt suportate?",
|
||||||
|
"offline": "Pot să îl folosesc offline?",
|
||||||
|
"privacy": "Sunt datele mele private?",
|
||||||
|
"versions": "Ce versiuni biblice sunt disponibile?"
|
||||||
|
},
|
||||||
|
"answers": {
|
||||||
|
"accurate": "Da, AI-ul nostru este antrenat pe surse teologice verificate și revizuit de profesori de seminar și pastori pentru a asigura acuratețea biblică.",
|
||||||
|
"free": "Funcțiile de bază incluzând citirea Bibliei, chat AI și căutarea de bază sunt complet gratuite. Funcții premium sunt disponibile pentru utilizatori avansați.",
|
||||||
|
"languages": "Suportăm 25+ limbi incluzând română, engleză, spaniolă, portugheză, franceză, germană și multe altele cu calitate de vorbitor nativ.",
|
||||||
|
"offline": "Citirea de bază a Bibliei este disponibilă offline. Funcțiile AI și căutarea necesită conexiune la internet pentru cea mai bună experiență.",
|
||||||
|
"privacy": "Călătoria ta spirituală rămâne între tine și Dumnezeu. Folosim criptare standard în industrie și nu partajăm niciodată date personale.",
|
||||||
|
"versions": "Oferim versiuni multiple ale Bibliei incluzând Cornilescu, Fidela, și traduceri în multe limbi."
|
||||||
|
},
|
||||||
|
"contactSupport": "Contactează Suportul",
|
||||||
|
"viewAllFaqs": "Vezi Toate Întrebările"
|
||||||
|
},
|
||||||
|
"newsletter": {
|
||||||
|
"title": "Înțelepciune Zilnică în Inbox-ul Tău",
|
||||||
|
"description": "Primește versete încurajatoare, înțelegeri și îndrumări spirituale zilnic",
|
||||||
|
"placeholder": "Introdu email-ul tău",
|
||||||
|
"subscribe": "Abonează-te"
|
||||||
|
},
|
||||||
|
"footer": {
|
||||||
|
"brand": "Ghid Biblic",
|
||||||
|
"description": "O platformă modernă pentru studiul Bibliei cu înțelegeri AI și suport comunitar.",
|
||||||
|
"quickLinks": {
|
||||||
|
"title": "Linkuri Rapide",
|
||||||
|
"about": "Despre",
|
||||||
|
"blog": "Blog",
|
||||||
|
"support": "Suport",
|
||||||
|
"api": "Documentație API"
|
||||||
|
},
|
||||||
|
"legal": {
|
||||||
|
"title": "Legal",
|
||||||
|
"terms": "Termeni",
|
||||||
|
"privacy": "Confidențialitate",
|
||||||
|
"cookies": "Politica Cookie",
|
||||||
|
"gdpr": "GDPR"
|
||||||
|
},
|
||||||
|
"social": {
|
||||||
|
"title": "Urmărește-ne"
|
||||||
|
},
|
||||||
|
"copyright": "© 2024 Ghid Biblic - Făcut cu ❤️ și 🙏"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"pages": {
|
"pages": {
|
||||||
|
|||||||
304
temp/biblical-guide-homepage.md
Normal file
304
temp/biblical-guide-homepage.md
Normal file
@@ -0,0 +1,304 @@
|
|||||||
|
# BiblicalGuide Homepage Sections
|
||||||
|
|
||||||
|
## Current Sections ✓
|
||||||
|
1. Hero/CTA (Read Bible & AI Chat)
|
||||||
|
2. Features Overview
|
||||||
|
3. Basic Stats
|
||||||
|
|
||||||
|
## Recommended Additional Sections (In Order)
|
||||||
|
|
||||||
|
### 1. **Hero Section Enhancement** (Update Current)
|
||||||
|
```
|
||||||
|
Headline: "Your Personal Biblical Guide"
|
||||||
|
Subheadline: "Explore Scripture with AI-Powered Insights in [Language]"
|
||||||
|
|
||||||
|
[Start Reading] [Chat with AI Guide]
|
||||||
|
|
||||||
|
Live Counter: "Join 2,847 believers studying God's word right now"
|
||||||
|
```
|
||||||
|
|
||||||
|
### 2. **Interactive Demo Section** 🌟
|
||||||
|
```
|
||||||
|
Title: "See It In Action"
|
||||||
|
|
||||||
|
[Live Chat Widget Preview]
|
||||||
|
User: "What does the Bible say about hope?"
|
||||||
|
AI: "The Bible offers many encouraging verses about hope..."
|
||||||
|
|
||||||
|
[Try It Yourself - No Sign Up Required]
|
||||||
|
```
|
||||||
|
**Why:** Reduce friction - let users experience the AI immediately without commitment
|
||||||
|
|
||||||
|
### 3. **Daily Verse Section** 📖
|
||||||
|
```
|
||||||
|
Today's Verse - January 15, 2024
|
||||||
|
|
||||||
|
"For I know the plans I have for you," declares the Lord,
|
||||||
|
"plans to prosper you and not to harm you,
|
||||||
|
plans to give you hope and a future."
|
||||||
|
- Jeremiah 29:11
|
||||||
|
|
||||||
|
[💬 Discuss This Verse] [🔖 Save] [📤 Share]
|
||||||
|
|
||||||
|
Tomorrow: Get daily verses delivered to your inbox [Subscribe]
|
||||||
|
```
|
||||||
|
**Why:** Gives immediate value and a reason to return daily
|
||||||
|
|
||||||
|
### 4. **Popular Questions Carousel** 💭
|
||||||
|
```
|
||||||
|
What Others Are Asking
|
||||||
|
|
||||||
|
[< ] "What does the Bible say about anxiety?"
|
||||||
|
"Understanding God's plan for my life"
|
||||||
|
"How to pray effectively"
|
||||||
|
"Finding peace in difficult times" [ >]
|
||||||
|
|
||||||
|
[Ask Your Own Question →]
|
||||||
|
```
|
||||||
|
**Why:** Shows real use cases and inspires engagement
|
||||||
|
|
||||||
|
### 5. **How It Works** (3 Steps) 🎯
|
||||||
|
```
|
||||||
|
Start Your Biblical Journey
|
||||||
|
|
||||||
|
1. Ask Any Question
|
||||||
|
Type or speak your spiritual questions
|
||||||
|
[Icon: Chat bubble]
|
||||||
|
|
||||||
|
2. Get Biblical Answers
|
||||||
|
Receive verses and insights instantly
|
||||||
|
[Icon: Book with sparkle]
|
||||||
|
|
||||||
|
3. Grow in Faith
|
||||||
|
Save insights, track your journey
|
||||||
|
[Icon: Growth chart]
|
||||||
|
|
||||||
|
[Get Started Free →]
|
||||||
|
```
|
||||||
|
**Why:** Reduces complexity anxiety for non-tech users
|
||||||
|
|
||||||
|
### 6. **Community Prayer Wall** (Live) 🙏
|
||||||
|
```
|
||||||
|
Prayer Requests From Our Community
|
||||||
|
|
||||||
|
"Please pray for my mother's health..." - 2 min ago
|
||||||
|
[🙏 32 Praying]
|
||||||
|
|
||||||
|
"Seeking guidance for my job interview..." - 15 min ago
|
||||||
|
[🙏 47 Praying]
|
||||||
|
|
||||||
|
"Thankful for answered prayers!" - 1 hour ago
|
||||||
|
[❤️ 89 Celebrating]
|
||||||
|
|
||||||
|
[Share Your Prayer Request] [View All Prayers]
|
||||||
|
```
|
||||||
|
**Why:** Creates immediate sense of community and belonging
|
||||||
|
|
||||||
|
### 7. **Trust Indicators Section** ✅
|
||||||
|
```
|
||||||
|
Trusted by Believers Worldwide
|
||||||
|
|
||||||
|
✓ Theologically Verified
|
||||||
|
Reviewed by seminary professors and pastors
|
||||||
|
|
||||||
|
✓ 100% Private & Secure
|
||||||
|
Your spiritual journey stays between you and God
|
||||||
|
|
||||||
|
✓ Always Free Core Features
|
||||||
|
Essential tools available to everyone
|
||||||
|
|
||||||
|
✓ Multi-Language Support
|
||||||
|
Available in 25+ languages
|
||||||
|
|
||||||
|
[Logos of: Christianity Today | Bible Society | Local Churches]
|
||||||
|
```
|
||||||
|
**Why:** Builds credibility, especially important for faith-based apps
|
||||||
|
|
||||||
|
### 8. **Use Cases / Who It's For** 👥
|
||||||
|
```
|
||||||
|
Perfect For Every Believer
|
||||||
|
|
||||||
|
[Tab: New Christians]
|
||||||
|
Start your faith journey with gentle guidance
|
||||||
|
- Basic Bible navigation
|
||||||
|
- Simple explanations
|
||||||
|
- Foundational topics
|
||||||
|
|
||||||
|
[Tab: Bible Students]
|
||||||
|
Deep dive into Scripture
|
||||||
|
- Original language insights
|
||||||
|
- Historical context
|
||||||
|
- Cross-references
|
||||||
|
|
||||||
|
[Tab: Parents & Teachers]
|
||||||
|
Share faith with the next generation
|
||||||
|
- Age-appropriate answers
|
||||||
|
- Discussion guides
|
||||||
|
- Family devotionals
|
||||||
|
|
||||||
|
[Tab: Pastors & Leaders]
|
||||||
|
Enhance your ministry
|
||||||
|
- Sermon preparation
|
||||||
|
- Counseling support
|
||||||
|
- Quick references
|
||||||
|
```
|
||||||
|
**Why:** Helps visitors self-identify and see personalized value
|
||||||
|
|
||||||
|
### 9. **Testimonials with Context** 💬
|
||||||
|
```
|
||||||
|
Real Stories from Our Community
|
||||||
|
|
||||||
|
"As a new mom with little time, the AI chat helps me stay
|
||||||
|
connected to God's word during 3am feedings."
|
||||||
|
- Sarah M., Mother of Two | Using for 3 months
|
||||||
|
|
||||||
|
"I was skeptical about AI and faith, but the Biblical accuracy
|
||||||
|
and thoughtful responses exceeded my expectations."
|
||||||
|
- Pastor David K., Baptist Church | Verified Minister
|
||||||
|
|
||||||
|
"Finally, a Bible app that speaks my language - literally!
|
||||||
|
The Portuguese support is perfect."
|
||||||
|
- João S., Brazil | International User
|
||||||
|
|
||||||
|
[Share Your Story]
|
||||||
|
```
|
||||||
|
**Why:** Social proof with relatable contexts
|
||||||
|
|
||||||
|
### 10. **FAQ Section** (Expandable) ❓
|
||||||
|
```
|
||||||
|
Common Questions
|
||||||
|
|
||||||
|
▼ Is the AI theologically accurate?
|
||||||
|
▼ Is it really free?
|
||||||
|
▼ What languages are supported?
|
||||||
|
▼ Can I use it offline?
|
||||||
|
▼ Is my data private?
|
||||||
|
▼ What Bible versions are available?
|
||||||
|
|
||||||
|
[Contact Support] [View All FAQs]
|
||||||
|
```
|
||||||
|
**Why:** Addresses objections before they become barriers
|
||||||
|
|
||||||
|
### 11. **Mobile App CTA** (If Applicable) 📱
|
||||||
|
```
|
||||||
|
Take Your Faith Everywhere
|
||||||
|
|
||||||
|
[App Store] [Google Play]
|
||||||
|
|
||||||
|
⭐⭐⭐⭐⭐ 4.8 rating | 10K+ downloads
|
||||||
|
|
||||||
|
QR Code: [Scan to Download]
|
||||||
|
```
|
||||||
|
**Why:** Many users prefer apps for daily spiritual practices
|
||||||
|
|
||||||
|
### 12. **Footer Enhancement** (Update Current)
|
||||||
|
```
|
||||||
|
Newsletter Signup:
|
||||||
|
"Daily Wisdom in Your Inbox"
|
||||||
|
[Email] [Subscribe]
|
||||||
|
|
||||||
|
Quick Links:
|
||||||
|
About | Blog | Support | API Docs
|
||||||
|
|
||||||
|
Legal:
|
||||||
|
Terms | Privacy | Cookie Policy | GDPR
|
||||||
|
|
||||||
|
Languages: [EN] [ES] [PT] [FR] [DE] [+20 more]
|
||||||
|
|
||||||
|
Social: [Facebook] [Instagram] [YouTube] [Twitter]
|
||||||
|
|
||||||
|
© 2024 BiblicalGuide - Made with ❤️ and 🙏
|
||||||
|
```
|
||||||
|
|
||||||
|
## Optional Advanced Sections
|
||||||
|
|
||||||
|
### **Interactive Bible Map** 🗺️
|
||||||
|
- Visual journey through Biblical locations
|
||||||
|
- "Explore where Jesus walked"
|
||||||
|
- Great for engagement but development-heavy
|
||||||
|
|
||||||
|
### **Live Study Groups** 👥
|
||||||
|
- "3 groups studying Romans right now"
|
||||||
|
- "Join a study group" CTA
|
||||||
|
- Requires more complex infrastructure
|
||||||
|
|
||||||
|
### **Verse of the Day Widget**
|
||||||
|
- Embeddable widget code
|
||||||
|
- "Add to your website"
|
||||||
|
- Good for viral growth
|
||||||
|
|
||||||
|
## Homepage Section Priority
|
||||||
|
|
||||||
|
### Must Have (Launch):
|
||||||
|
1. Enhanced Hero
|
||||||
|
2. Interactive Demo
|
||||||
|
3. How It Works
|
||||||
|
4. Trust Indicators
|
||||||
|
5. Enhanced Footer
|
||||||
|
|
||||||
|
### Should Have (Week 2):
|
||||||
|
6. Daily Verse
|
||||||
|
7. Popular Questions
|
||||||
|
8. Community Prayer Wall
|
||||||
|
9. FAQ
|
||||||
|
|
||||||
|
### Nice to Have (Month 2):
|
||||||
|
10. Use Cases
|
||||||
|
11. Testimonials
|
||||||
|
12. Mobile App CTA
|
||||||
|
|
||||||
|
## Design Principles
|
||||||
|
|
||||||
|
### Above the Fold:
|
||||||
|
- **Hero with clear value prop**
|
||||||
|
- **Two primary CTAs** (Read & Chat)
|
||||||
|
- **Trust indicator** (user count or endorsement)
|
||||||
|
- **Interactive demo** teaser
|
||||||
|
|
||||||
|
### Middle Sections:
|
||||||
|
- **Build trust** progressively
|
||||||
|
- **Show community** presence
|
||||||
|
- **Address objections** naturally
|
||||||
|
- **Provide value** immediately
|
||||||
|
|
||||||
|
### Bottom Sections:
|
||||||
|
- **Capture emails** for retention
|
||||||
|
- **Social proof** for hesitant users
|
||||||
|
- **Resources** for power users
|
||||||
|
- **Legal/trust** information
|
||||||
|
|
||||||
|
## A/B Testing Opportunities
|
||||||
|
|
||||||
|
1. **Hero Headlines**
|
||||||
|
- "Your Personal Biblical Guide"
|
||||||
|
- "Chat with Scripture"
|
||||||
|
- "AI-Powered Bible Study"
|
||||||
|
|
||||||
|
2. **Primary CTA**
|
||||||
|
- "Start Free"
|
||||||
|
- "Chat Now"
|
||||||
|
- "Explore Scripture"
|
||||||
|
|
||||||
|
3. **Demo Placement**
|
||||||
|
- Above fold vs below
|
||||||
|
- Auto-play vs click-to-start
|
||||||
|
|
||||||
|
4. **Social Proof Type**
|
||||||
|
- User count vs testimonials
|
||||||
|
- Ratings vs endorsements
|
||||||
|
|
||||||
|
## Mobile Considerations
|
||||||
|
|
||||||
|
- **Collapse sections** to accordions
|
||||||
|
- **Sticky CTA** at bottom
|
||||||
|
- **Swipeable** testimonials
|
||||||
|
- **Simplified** prayer wall
|
||||||
|
- **Touch-optimized** demo
|
||||||
|
|
||||||
|
## Performance Tips
|
||||||
|
|
||||||
|
- **Lazy load** below-fold sections
|
||||||
|
- **Static cache** daily verse
|
||||||
|
- **WebSocket** for live prayer wall
|
||||||
|
- **Skeleton screens** while loading
|
||||||
|
- **Progressive enhancement** for demo
|
||||||
Reference in New Issue
Block a user