Divine Vision Home Care: Healthcare Service Marketing Platform
Divine Vision Home Care: Healthcare Service Marketing Platform
Divine Vision Home Care Agency required a comprehensive website to establish their market presence and compete effectively in the home care industry. I developed a full-featured marketing platform using React, TypeScript, and Vite, styled with a hybrid approach of Styled Components and Tailwind CSS. The project focused on showcasing their services while providing multiple communication channels through integrated forms for appointments, contact messages, and career applications.
The website addresses the critical business need for professional online representation in a competitive healthcare market. The platform emphasizes service quality and accessibility while streamlining client acquisition and staff recruitment through purpose-built forms that deliver information directly to the agency via EmailJS integration.
Key Features and Innovations
- Service Showcase: Detailed presentation of home care services with clear categorization
- Multi-Purpose Form System: Integrated forms for appointments, contact inquiries, and job applications
- Career Portal: Dedicated section for recruitment with application submission functionality
- Testimonial Display: Client feedback presentation to build trust and credibility
- Team Section: Professional profiles of key staff members
- Location Integration: Interactive maps and service area information
Technical Challenges and Solutions
The project presented several technical challenges that required creative solutions:
Hybrid Styling Approach
Leveraging both Styled Components and Tailwind CSS for maximum flexibility:
// Component with hybrid styling approach
const ServiceCard: FC<Props> = ({ title, description, icon }) => {
return (
<CardContainer className="rounded-lg shadow-md transition-shadow hover:shadow-xl">
{/* other code */}
</CardContainer>
)
}
// Styled Components for custom styling
const CardContainer = styled.div`
border: 1px solid #f0f0f0;
transition: transform 0.3s ease;
&:hover {
transform: translateY(-5px);
}
`
Multi-Purpose Form System
Creating a flexible form system to handle different submission types:
// Form factory for different form types
const getFormConfig = (formType) => {
switch (formType) {
case 'appointment':
return appointmentData
case 'career':
return careerData
case 'contact':
return contactData
default:
return appointmentData
}
}
EmailJS Implementation for Multiple Forms
Setting up EmailJS to handle different types of form submissions:
// EmailJS handlers for different form types
const handleFormSubmit = async (
formType,
values,
{ setSubmitting, resetForm },
) => {
const template = `template_${formType}`
try {
await emailjs.send(
'service_divinevision',
template,
values,
'the_public_key',
)
} catch (error) {
// handle error
} finally {
setSubmitting(false)
resetForm()
}
}
Responsive Design Implementation
Ensuring a consistent experience across all devices:
// Responsive navigation component
const Navigation = () => {
const [isMenuOpen, setIsMenuOpen] = useState(false)
return (
<NavContainer>
<MenuButton
className="lg:hidden"
onClick={() => setIsMenuOpen(!isMenuOpen)}
/>
<DesktopMenu className="hidden lg:flex"> {/* ... */} </DesktopMenu>
{isMenuOpen && (
<MobileMenu className="lg:hidden"> {/* ... */} </MobileMenu>
)}
</NavContainer>
)
}
Client Collaboration Process
Working with the healthcare agency required a structured approach:
- Competitive Analysis: Researched competitor websites to identify opportunities for differentiation
- Service Documentation: Collaborated closely with agency staff to accurately represent their services
- Recruitment Strategy: Developed the career portal based on their staffing needs and hiring processes
- Compliance Review: Ensured content adhered to healthcare marketing regulations and best practices
User Experience Enhancement
Feedback from the agency and their clients led to several improvements:
"The website has significantly improved our professional image and streamlined our intake process. The career portal has been instrumental in attracting qualified applicants." - Agency Director
Business Impact
Since launching the website, Divine Vision Home Care has experienced:
- 45% increase in service inquiries
- 30% growth in qualified job applicants
- Improved client conversion rate through streamlined communication
- Enhanced market positioning against larger competitors
Future Development Plans
Potential enhancements include:
- Client Portal: Secure login area for existing clients and family members
- Service Calculator: Interactive tool for estimating care needs and costs
- Resource Library: Informational content for caregivers and family members
- Multilingual Support: Translation options for diverse client populations
Live Project
Visit the website: Divine Vision Home Care Website