mirror of
https://github.com/OwethuManagedServices/oms-website-nextjs.git
synced 2025-12-17 15:38:09 +00:00
fix: product development fixed
This commit is contained in:
libertyoms
@ -48,31 +48,31 @@ const coreValues = [
|
||||
icon: FaCheckCircle,
|
||||
title: "Service",
|
||||
description:
|
||||
"Dedicated to providing outstanding service at every touchpoint, meeting the highest standards, and creating lasting impact for our clients.",
|
||||
"We strive to elevate every experience — from client interactions to internal collaborations. With unwavering dedication, we deliver excellence that inspires growth, fosters partnerships, and creates a lasting, positive impact on everyone we touch.",
|
||||
},
|
||||
{
|
||||
icon: FaHandshake,
|
||||
title: "Accountability",
|
||||
description:
|
||||
"Taking ownership of our actions and delivering on promises with transparency. Our commitment fosters trust and ensures we consistently meet client expectations.",
|
||||
"We embrace ownership with pride, holding ourselves and each other to the highest standards. Our transparency and commitment to our promises build the trust that strengthens relationships, propels progress, and empowers everyone to thrive.",
|
||||
},
|
||||
{
|
||||
icon: FaHeart,
|
||||
title: "Passion",
|
||||
description:
|
||||
"Driven by a passion for innovation, we embrace new ideas and technologies, constantly seeking ways to improve and deliver creative, boundary-pushing solutions.",
|
||||
"Driven by a relentless passion for innovation, we embrace challenges as opportunities. We inspire creativity, ignite new ideas, and fuel transformation — always seeking to push the limits of what’s possible and make a difference in everything we do.",
|
||||
},
|
||||
{
|
||||
icon: FaComments,
|
||||
title: "Communication",
|
||||
description:
|
||||
"Clear, consistent, and proactive communication is central. We ensure all stakeholders are aligned, informed, and empowered, fostering collaboration.",
|
||||
"Open, honest, and proactive communication is the bridge that connects us all. We believe in the power of dialogue to align, inspire, and drive collaboration — ensuring that every voice is heard and every idea has the opportunity to flourish.",
|
||||
},
|
||||
{
|
||||
icon: FaShieldAlt,
|
||||
title: "Trust",
|
||||
description:
|
||||
"Cultivating trust through ethical practices, honesty, and transparency. We uphold the highest integrity for long-term, mutually beneficial relationships.",
|
||||
"At the heart of our work lies unwavering trust. Built on integrity, honesty, and respect, we nurture strong, meaningful relationships that create a foundation for long-term success — together, as partners, as a team, and as a community.",
|
||||
},
|
||||
];
|
||||
|
||||
@ -168,20 +168,24 @@ export default function AboutUsPage() {
|
||||
by Purpose
|
||||
</h2>
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 leading-relaxed mb-4 font-poppins">
|
||||
Expand on the founding story/motivation. E.g., Owethu Managed
|
||||
Services was born from a clear vision: to harness the
|
||||
transformative power of technology not just to solve problems,
|
||||
but to proactively create opportunities for businesses to
|
||||
thrive. We saw a need for a partner who truly understands both
|
||||
technology's potential and the unique challenges modern
|
||||
organizations face.
|
||||
Owethu Managed Services wasn’t built in a boardroom — it was
|
||||
born from a deeper calling: a desire to do more than simply
|
||||
exist in the tech space. We set out to use innovation not as a
|
||||
buzzword, but as a lifeline — pulling businesses out of
|
||||
stagnation and into a future full of possibility.
|
||||
</p>
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 leading-relaxed mb-4 font-poppins">
|
||||
From day one, we’ve challenged the status quo. We don’t just fix
|
||||
problems — we anticipate them, reimagine them, and turn them
|
||||
into powerful stepping stones for growth. Our mission is simple:
|
||||
break what seems impossible, and rebuild it into something
|
||||
extraordinary.
|
||||
</p>
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 leading-relaxed font-poppins">
|
||||
Elaborate on the journey. E.g., Our journey has been defined by
|
||||
a relentless pursuit of knowledge, adaptation to the
|
||||
ever-evolving tech landscape, and an unwavering commitment to
|
||||
client success. This focus has established us as trusted
|
||||
advisors and thought leaders in digital transformation.
|
||||
Today, OMS is more than a service provider. We are trusted
|
||||
digital transformation partners, creative problem-solvers, and
|
||||
passionate believers in human-driven innovation. This isn’t just
|
||||
business. This is our purpose.
|
||||
</p>
|
||||
</div>
|
||||
<div className="relative h-64 md:h-80 rounded-lg overflow-hidden shadow-lg">
|
||||
@ -224,9 +228,7 @@ export default function AboutUsPage() {
|
||||
<p className="text-gray-700 dark:text-gray-300 leading-relaxed font-poppins flex-grow">
|
||||
"To be global leaders in delivering cutting-edge IT
|
||||
solutions, pushing the boundaries of what's possible, and
|
||||
transforming industries for the better. We aim to empower
|
||||
organisations to break through technological barriers and
|
||||
achieve greater success."
|
||||
transforming industries for the better."
|
||||
</p>
|
||||
</div>
|
||||
{/* Mission Card */}
|
||||
@ -242,12 +244,9 @@ export default function AboutUsPage() {
|
||||
Our Mission
|
||||
</h3>
|
||||
<p className="text-gray-700 dark:text-gray-300 leading-relaxed font-poppins flex-grow">
|
||||
"We are dedicated to creating tailored, innovative
|
||||
solutions that drive business success. By combining expertise
|
||||
with cutting-edge technology, we solve complex problems and
|
||||
enable our clients to achieve outstanding results. We partner
|
||||
closely with clients to ensure every solution aligns with their
|
||||
unique needs for long-term success."
|
||||
"Our purpose is to help our clients drive transformative
|
||||
growth and innovation to propel their business forward –
|
||||
redefining what's possible."
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -300,9 +299,10 @@ export default function AboutUsPage() {
|
||||
Deep Domain Knowledge
|
||||
</h2>
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 leading-relaxed font-poppins">
|
||||
We combine broad technological capabilities with specialized
|
||||
expertise across key industries, understanding the unique
|
||||
challenges and opportunities within each sector.
|
||||
Retail/E-commerce: Experience in building scalable e-commerce
|
||||
platforms, optimizing digital customer journeys, enabling secure
|
||||
payment integrations, and leveraging data analytics to drive
|
||||
personalized shopping experiences and operational efficiency.
|
||||
</p>
|
||||
</div>
|
||||
<div className="lg:col-span-2 grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
@ -430,7 +430,7 @@ export default function AboutUsPage() {
|
||||
</h2>
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 leading-relaxed mb-4 font-poppins">
|
||||
We believe the best results come from true collaboration. We
|
||||
invest time in understanding your culture, goals, and
|
||||
invest time in understanding your culture, processes, goals, and
|
||||
challenges, working alongside your team as an extension of your
|
||||
own capabilities.
|
||||
</p>
|
||||
@ -516,10 +516,11 @@ export default function AboutUsPage() {
|
||||
</h2>
|
||||
<p className="text-lg md:text-xl max-w-3xl mx-auto leading-relaxed font-poppins text-gray-800">
|
||||
Ultimately, our success is measured by yours. We are committed to
|
||||
delivering solutions that not only meet technical requirements but
|
||||
also drive efficiency, foster growth, enhance user experiences, and
|
||||
provide a clear return on investment. Let's build a successful
|
||||
future, together.
|
||||
creating solutions that ignite momentum, unlock potential, and turn
|
||||
ambition into achievement,empowering you to rise above challenges
|
||||
and lead with confidence into the future. Together, let's build
|
||||
a future where your success is not just a possibility, but a
|
||||
reality.
|
||||
</p>
|
||||
{/* Optional CTA to contact */}
|
||||
<div className="mt-10">
|
||||
|
||||
@ -39,7 +39,7 @@ export const metadata: Metadata = {
|
||||
description:
|
||||
"Revolutionize lending with OBSE: Automated bank statement data extraction, OCR, fraud detection, and analysis for South African financial institutions. Improve accuracy, speed, and decision-making.",
|
||||
keywords: [
|
||||
"Optimised Bank Statement Extractor",
|
||||
"Optimized Bank Statement Extractor",
|
||||
"OBSE",
|
||||
"bank statement extraction",
|
||||
"OCR bank statements",
|
||||
@ -347,7 +347,7 @@ export default function ObsePage() {
|
||||
OBSE: Automated Accuracy, Speed, and Insight
|
||||
</h2>
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 leading-relaxed mb-4">
|
||||
Optimised Bank Statement Extractor (OBSE) is an advanced OCR and
|
||||
Optimized Bank Statement Extractor (OBSE) is an advanced OCR and
|
||||
data aggregation platform designed specifically for the South
|
||||
African financial landscape. It seamlessly extracts
|
||||
comprehensive, accurate data from any bank statement (individual
|
||||
|
||||
@ -58,7 +58,7 @@ export default async function HomePage() {
|
||||
eyebrow="Featured Product"
|
||||
title="Streamline Financial Analysis with"
|
||||
productName="OBSE"
|
||||
description="Our advanced Optimised Bank Statement Extractor automates data aggregation, reduces errors, and provides deep financial insights."
|
||||
description="Our advanced Optimized Bank Statement Extractor automates data aggregation, reduces errors, and provides deep financial insights."
|
||||
features={defaultObseFeatures}
|
||||
buttonText="Learn More & Demo"
|
||||
buttonHref="/products/obse" // Link to the OBSE product page
|
||||
|
||||
@ -1,25 +1,29 @@
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { Metadata } from "next";
|
||||
import {
|
||||
FaArrowRight,
|
||||
FaCheckCircle,
|
||||
FaCogs,
|
||||
FaDraftingCompass,
|
||||
FaHandshake,
|
||||
FaHeadset,
|
||||
FaLaptopCode,
|
||||
FaLightbulb,
|
||||
FaPuzzlePiece,
|
||||
FaRocket,
|
||||
FaSearch,
|
||||
FaShieldAlt,
|
||||
FaSyncAlt,
|
||||
FaTools,
|
||||
FaUserCheck,
|
||||
FaUsersCog,
|
||||
FaExclamationTriangle,
|
||||
FaFileInvoiceDollar,
|
||||
FaLaptopCode, // For Web App Dev, Backend
|
||||
FaLightbulb, // For Ideation, Innovation
|
||||
FaPuzzlePiece, // For Custom Software Solutions
|
||||
FaRocket, // For Product Launch, Scalable Tech
|
||||
FaSearch, // For User Research
|
||||
FaShieldAlt, // For Security Testing
|
||||
FaSyncAlt, // For Agile, Iteration
|
||||
FaUserCheck, // For User-Centred Design, Usability Testing
|
||||
FaUsersCog, // For Dedicated Teams
|
||||
// Additional icons that might be useful for the new content:
|
||||
FaMobileAlt, // For Mobile Apps
|
||||
FaDesktop, // For Desktop Apps
|
||||
FaBrain, // For AI & ML
|
||||
FaCubes, // For Blockchain (alternative: FaLink)
|
||||
FaNetworkWired, // For IoT (alternative: FaBroadcastTower)
|
||||
FaBullseye, // For Market Strategy
|
||||
FaChartLine, // For Growth/Scalability
|
||||
FaTasks, // For QA
|
||||
FaComments, // For Feedback
|
||||
FaPhone,
|
||||
FaEnvelope,
|
||||
} from "react-icons/fa";
|
||||
@ -28,34 +32,33 @@ import ContactForm from "@/components/ContactForm";
|
||||
|
||||
// SEO Metadata
|
||||
export const metadata: Metadata = {
|
||||
title: "Custom Software Development South Africa | Tailored Solutions by OMS",
|
||||
title: "Product Development Services | Digital Solutions by OMS",
|
||||
description:
|
||||
"OMS builds custom software solutions when off-the-shelf products don't fit. Leverage our expertise, proven by projects like OBSE, to solve your unique business challenges in South Africa.",
|
||||
"OMS delivers innovative, tailored digital solutions. Explore our end-to-end product development services, from ideation to launch and beyond.",
|
||||
keywords: [
|
||||
"custom software development",
|
||||
"bespoke software",
|
||||
"tailored software solutions",
|
||||
"software development South Africa",
|
||||
"business process automation",
|
||||
"enterprise software",
|
||||
"fintech development",
|
||||
"product development",
|
||||
"custom software solutions",
|
||||
"user-centred design",
|
||||
"agile development",
|
||||
"cross-platform solutions",
|
||||
"mobile app development",
|
||||
"web app development",
|
||||
"tech stack",
|
||||
"quality assurance",
|
||||
"OMS",
|
||||
"Owethu Management Services",
|
||||
"product development",
|
||||
"custom applications",
|
||||
],
|
||||
openGraph: {
|
||||
title:
|
||||
"Custom Software Development South Africa | Tailored Solutions by OMS",
|
||||
title: "Product Development Services | Digital Solutions by OMS",
|
||||
description:
|
||||
"Partner with OMS to develop custom software perfectly aligned with your business needs.",
|
||||
"Transform your ideas into market-ready products with OMS's comprehensive development expertise.",
|
||||
url: "https://www.oms.africa/services/product-development", // Replace with your actual URL
|
||||
images: [
|
||||
{
|
||||
url: "/images/product-dev-og-image.png", // Replace with an appropriate OG image URL
|
||||
width: 1200,
|
||||
height: 630,
|
||||
alt: "OMS Custom Software Development",
|
||||
alt: "OMS Product Development Services",
|
||||
},
|
||||
],
|
||||
locale: "en_ZA",
|
||||
@ -63,123 +66,267 @@ export const metadata: Metadata = {
|
||||
},
|
||||
twitter: {
|
||||
card: "summary_large_image",
|
||||
title:
|
||||
"Custom Software Development South Africa | Tailored Solutions by OMS",
|
||||
title: "Product Development Services | Digital Solutions by OMS",
|
||||
description:
|
||||
"Build the exact software you need with OMS's expert development services.",
|
||||
"Build innovative digital products with OMS. We cover the full lifecycle from concept to continuous improvement.",
|
||||
// images: ['/images/product-dev-twitter-image.png'], // Replace if needed
|
||||
},
|
||||
};
|
||||
|
||||
interface StepItem {
|
||||
icon: React.ElementType;
|
||||
interface FeatureItem {
|
||||
icon?: React.ElementType; // Icon is optional for some lists like tech stack
|
||||
title: string;
|
||||
description: string;
|
||||
}
|
||||
|
||||
const developmentProcess: StepItem[] = [
|
||||
{
|
||||
icon: FaSearch,
|
||||
title: "Discovery & Consultation",
|
||||
description:
|
||||
"We start by deeply understanding your business challenges, goals, and specific requirements.",
|
||||
},
|
||||
{
|
||||
icon: FaDraftingCompass,
|
||||
title: "Solution Design & Architecture",
|
||||
description:
|
||||
"Our experts design a robust, scalable, and secure software architecture tailored to your needs.",
|
||||
},
|
||||
{
|
||||
icon: FaLaptopCode,
|
||||
title: "Agile Development & Iteration",
|
||||
description:
|
||||
"We build your software using agile methodologies, ensuring flexibility and regular feedback loops.",
|
||||
},
|
||||
{
|
||||
icon: FaCheckCircle,
|
||||
title: "Rigorous Testing & QA",
|
||||
description:
|
||||
"Comprehensive testing ensures the software is reliable, performs optimally, and meets all requirements.",
|
||||
},
|
||||
{
|
||||
icon: FaRocket,
|
||||
title: "Deployment & Integration",
|
||||
description:
|
||||
"We manage the deployment process and ensure seamless integration with your existing systems.",
|
||||
},
|
||||
{
|
||||
icon: FaHeadset,
|
||||
title: "Ongoing Support & Maintenance",
|
||||
description:
|
||||
"We offer continued support and maintenance options to keep your software running smoothly.",
|
||||
},
|
||||
];
|
||||
const SectionTitle: React.FC<{ children: React.ReactNode }> = ({
|
||||
children,
|
||||
}) => (
|
||||
<h2 className="text-3xl md:text-4xl font-bold font-poppins text-gray-900 dark:text-white mb-4 text-center">
|
||||
{children}
|
||||
</h2>
|
||||
);
|
||||
|
||||
const coreBenefits: StepItem[] = [
|
||||
{
|
||||
icon: FaPuzzlePiece,
|
||||
title: "Perfect Fit Solution",
|
||||
description:
|
||||
"Software designed precisely for your unique workflows and business logic.",
|
||||
},
|
||||
{
|
||||
icon: FaSyncAlt,
|
||||
title: "Increased Efficiency",
|
||||
description:
|
||||
"Automate manual tasks and streamline operations for significant productivity gains.",
|
||||
},
|
||||
{
|
||||
icon: FaUsersCog,
|
||||
title: "Competitive Advantage",
|
||||
description:
|
||||
"Gain an edge with unique capabilities that off-the-shelf software cannot provide.",
|
||||
},
|
||||
{
|
||||
icon: FaCogs,
|
||||
title: "Scalability & Flexibility",
|
||||
description:
|
||||
"Build solutions that can grow and adapt alongside your business needs.",
|
||||
},
|
||||
{
|
||||
icon: FaShieldAlt,
|
||||
title: "Enhanced Security",
|
||||
description:
|
||||
"Incorporate specific security measures tailored to your data and compliance requirements.",
|
||||
},
|
||||
{
|
||||
icon: FaHandshake,
|
||||
title: "Seamless Integration",
|
||||
description:
|
||||
"Ensure smooth data flow between your custom software and other business systems.",
|
||||
},
|
||||
];
|
||||
const SectionParagraph: React.FC<{ children: React.ReactNode }> = ({
|
||||
children,
|
||||
}) => (
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 max-w-3xl mx-auto text-center mb-10 md:mb-12">
|
||||
{children}
|
||||
</p>
|
||||
);
|
||||
|
||||
const FeatureGrid: React.FC<{ items: FeatureItem[]; iconColor?: string }> = ({
|
||||
items,
|
||||
iconColor = COLORS.primary,
|
||||
}) => (
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||
{items.map((item) => (
|
||||
<div
|
||||
key={item.title}
|
||||
className="bg-white dark:bg-gray-700 p-6 rounded-lg shadow-md"
|
||||
>
|
||||
{item.icon && (
|
||||
<item.icon className="text-3xl mb-3" style={{ color: iconColor }} />
|
||||
)}
|
||||
<h4 className="text-xl font-semibold mb-2 font-poppins dark:text-white">
|
||||
{item.title}
|
||||
</h4>
|
||||
<p className="text-gray-600 dark:text-gray-300 text-sm leading-relaxed">
|
||||
{item.description}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
|
||||
export default function ProductDevelopmentPage() {
|
||||
const howOmsDeliversItems: FeatureItem[] = [
|
||||
{
|
||||
icon: FaPuzzlePiece,
|
||||
title: "Custom Software Solutions",
|
||||
description:
|
||||
"We craft bespoke applications designed to solve your unique business challenges, ensuring alignment with your goals and processes.",
|
||||
},
|
||||
{
|
||||
icon: FaUserCheck,
|
||||
title: "User-Centred Design",
|
||||
description:
|
||||
"We prioritise seamless functionality with an intuitive user experience, creating products that are not only powerful but also easy to use.",
|
||||
},
|
||||
{
|
||||
icon: FaRocket,
|
||||
title: "Scalable & Future-Proof Technology",
|
||||
description:
|
||||
"Our solutions are built with long-term growth in mind, ensuring adaptability to future demands and changes in technology.",
|
||||
},
|
||||
{
|
||||
icon: FaSyncAlt,
|
||||
title: "Agile Development Approach",
|
||||
description:
|
||||
"Through iterative development, we ensure faster time-to-market, with continuous feedback from users driving improvements along the way.",
|
||||
},
|
||||
];
|
||||
|
||||
const endToEndItems: FeatureItem[] = [
|
||||
{
|
||||
icon: FaLightbulb,
|
||||
title: "Ideation & Concept Development",
|
||||
description:
|
||||
"We collaborate with you to transform your ideas into a clear product vision and roadmap.",
|
||||
},
|
||||
{
|
||||
icon: FaDraftingCompass,
|
||||
title: "Prototyping & MVP Development",
|
||||
description:
|
||||
"We build prototypes and minimum viable products to validate concepts early, gather feedback, and ensure alignment with user needs.",
|
||||
},
|
||||
{
|
||||
icon: FaBullseye,
|
||||
title: "Product Launch & Market Strategy",
|
||||
description:
|
||||
"Our team helps with the go-to-market strategy, ensuring a successful product launch with strong market positioning and customer adoption.",
|
||||
},
|
||||
{
|
||||
icon: FaHeadset,
|
||||
title: "Post-Launch Support & Continuous Improvement",
|
||||
description:
|
||||
"We provide ongoing support, monitoring, and iterative enhancements based on user feedback and market trends.",
|
||||
},
|
||||
];
|
||||
|
||||
const crossPlatformItems: FeatureItem[] = [
|
||||
{
|
||||
icon: FaMobileAlt,
|
||||
title: "Mobile Application Development",
|
||||
description:
|
||||
"We create intuitive mobile apps for both iOS and Android, ensuring seamless performance and a high-quality user experience.",
|
||||
},
|
||||
{
|
||||
icon: FaLaptopCode,
|
||||
title: "Web Application Development",
|
||||
description:
|
||||
"Tailored web applications that are scalable, secure, and optimized for the best user interaction.",
|
||||
},
|
||||
{
|
||||
icon: FaDesktop,
|
||||
title: "Desktop Applications",
|
||||
description:
|
||||
"For businesses requiring more complex or resource-heavy solutions, we build powerful desktop applications with smooth integration.",
|
||||
},
|
||||
];
|
||||
|
||||
const techStackItems: FeatureItem[] = [
|
||||
{ title: "Frontend Development", description: "React, Angular, Vue.js" },
|
||||
{
|
||||
title: "Backend Development",
|
||||
description: "Node.js, Python, Java, Ruby on Rails",
|
||||
},
|
||||
{
|
||||
title: "Database Technologies",
|
||||
description: "MySQL, PostgreSQL, MongoDB, NoSQL",
|
||||
},
|
||||
{
|
||||
title: "Cloud Services & DevOps",
|
||||
description: "AWS, Azure, Google Cloud Platform",
|
||||
},
|
||||
{
|
||||
title: "AI & Machine Learning",
|
||||
description: "TensorFlow, PyTorch, Scikit-learn",
|
||||
},
|
||||
];
|
||||
|
||||
const qualityAssuranceItems: FeatureItem[] = [
|
||||
{
|
||||
icon: FaTasks,
|
||||
title: "Manual & Automated Testing",
|
||||
description:
|
||||
"Comprehensive testing to ensure the product meets all requirements and functions seamlessly.",
|
||||
},
|
||||
{
|
||||
icon: FaChartLine, // Or FaTachometerAlt if you add it
|
||||
title: "Performance & Load Testing",
|
||||
description:
|
||||
"We simulate high traffic and performance scenarios to ensure your product can scale and handle user demands.",
|
||||
},
|
||||
{
|
||||
icon: FaShieldAlt,
|
||||
title: "Security Testing",
|
||||
description:
|
||||
"Proactive identification and mitigation of potential security vulnerabilities to safeguard your product and user data.",
|
||||
},
|
||||
];
|
||||
|
||||
const collaborativeProcessItems: FeatureItem[] = [
|
||||
{
|
||||
icon: FaSyncAlt,
|
||||
title: "Agile Methodology",
|
||||
description:
|
||||
"Our flexible and iterative approach ensures that your product evolves based on real-time feedback, reducing risk and accelerating time-to-market.",
|
||||
},
|
||||
{
|
||||
icon: FaHandshake,
|
||||
title: "Client Involvement",
|
||||
description:
|
||||
"Regular check-ins, demos, and sprint reviews keep you involved and aligned with project progress, making sure we are building the product you envisioned.",
|
||||
},
|
||||
{
|
||||
icon: FaUsersCog,
|
||||
title: "Dedicated Development Teams",
|
||||
description:
|
||||
"Our dedicated teams work closely with your business to ensure that every decision aligns with your strategic goals and product vision.",
|
||||
},
|
||||
];
|
||||
|
||||
const userCentredApproachItems: FeatureItem[] = [
|
||||
{
|
||||
icon: FaSearch,
|
||||
title: "User Research & Personas",
|
||||
description:
|
||||
"We conduct thorough user research to understand the needs, behaviours, and challenges of your target audience.",
|
||||
},
|
||||
{
|
||||
icon: FaUserCheck,
|
||||
title: "Usability Testing",
|
||||
description:
|
||||
"Regular usability tests are conducted to ensure that your product is easy to navigate, efficient, and enjoyable to use.",
|
||||
},
|
||||
{
|
||||
icon: FaComments,
|
||||
title: "User Feedback & Iteration",
|
||||
description:
|
||||
"We continuously gather user feedback and iterate on product features to improve usability and customer satisfaction.",
|
||||
},
|
||||
];
|
||||
|
||||
const innovationItems: FeatureItem[] = [
|
||||
{
|
||||
icon: FaBrain,
|
||||
title: "Artificial Intelligence & Machine Learning",
|
||||
description:
|
||||
"We integrate AI and machine learning to create smarter, data-driven products that can adapt and scale as user needs evolve.",
|
||||
},
|
||||
{
|
||||
icon: FaCubes,
|
||||
title: "Blockchain Solutions",
|
||||
description:
|
||||
"We incorporate blockchain for secure, transparent, and decentralized applications.",
|
||||
},
|
||||
{
|
||||
icon: FaNetworkWired,
|
||||
title: "Internet of Things (IoT)",
|
||||
description:
|
||||
"We build IoT-enabled products that connect the physical and digital worlds for enhanced business intelligence and automation.",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="bg-white text-gray-800 overflow-x-hidden dark:bg-gray-900 dark:text-gray-200 font-poppins">
|
||||
{/* 1. Hero Section */}
|
||||
<section className="relative bg-gradient-to-r from-blue-900 via-blue-800 to-gray-900 text-white py-20 md:py-32">
|
||||
<section className="relative bg-gradient-to-r from-gray-800 via-gray-700 to-gray-800 text-white py-24 md:py-40">
|
||||
<div className="absolute inset-0 bg-black opacity-40 dark:opacity-60"></div>
|
||||
<div className="container mx-auto px-6 text-center relative z-10">
|
||||
<h1
|
||||
className="text-3xl md:text-5xl lg:text-6xl font-bold mb-4 font-poppins drop-shadow-md"
|
||||
style={{ color: COLORS.primary }} // Use gold color
|
||||
style={{ color: COLORS.primary }}
|
||||
>
|
||||
Build Your Vision: Custom Software Development by OMS
|
||||
Product Development
|
||||
</h1>
|
||||
<p className="text-lg md:text-xl max-w-4xl mx-auto leading-relaxed text-gray-200 dark:text-gray-300 mb-8">
|
||||
When off-the-shelf isn't enough, OMS crafts bespoke software
|
||||
solutions tailored precisely to your unique business challenges and
|
||||
opportunities.
|
||||
At OMS, we don’t just create products—we build digital solutions
|
||||
that accelerate business growth and transform industries. We
|
||||
understand that great products are the result of careful planning,
|
||||
technical expertise, and a deep understanding of user needs. From
|
||||
concept to launch, our product development services deliver
|
||||
innovative, tailored solutions that help businesses enhance
|
||||
efficiency, reduce complexity, and unlock new revenue streams.
|
||||
</p>
|
||||
<div className="flex flex-col sm:flex-row justify-center items-center gap-4">
|
||||
<Link
|
||||
href="#our-solution"
|
||||
href="#how-we-deliver"
|
||||
className="inline-flex items-center justify-center bg-gold-500 text-gray-900 font-bold py-3 px-8 rounded-md hover:bg-gold-600 transition-colors duration-300"
|
||||
style={{ backgroundColor: COLORS.primary }}
|
||||
>
|
||||
Discover Our Approach
|
||||
How We Deliver
|
||||
</Link>
|
||||
<Link
|
||||
href="#contact"
|
||||
@ -192,200 +339,32 @@ export default function ProductDevelopmentPage() {
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 2. The Challenge Section */}
|
||||
<section className="py-16 md:py-24 bg-gray-50 dark:bg-gray-800">
|
||||
<div className="container mx-auto px-6">
|
||||
<div className="text-center mb-12 md:mb-16">
|
||||
<h2 className="text-3xl md:text-4xl font-bold font-poppins text-gray-900 dark:text-white mb-4">
|
||||
The Limits of Standard Software
|
||||
</h2>
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 max-w-3xl mx-auto">
|
||||
Off-the-shelf software offers convenience but often falls short
|
||||
when faced with unique business processes, specific integration
|
||||
needs, or the desire for a true competitive differentiator.
|
||||
</p>
|
||||
</div>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||
{[
|
||||
{
|
||||
icon: FaPuzzlePiece,
|
||||
title: "Inflexible Workflows",
|
||||
desc: "Forcing your processes to fit generic software limitations hinders efficiency.",
|
||||
},
|
||||
{
|
||||
icon: FaExclamationTriangle,
|
||||
title: "Missing Features",
|
||||
desc: "Lacking critical functionality specific to your industry or business model.",
|
||||
},
|
||||
{
|
||||
icon: FaFileInvoiceDollar,
|
||||
title: "Costly Customization & Licenses",
|
||||
desc: "Expensive add-ons or per-user fees that don't fully solve the core problem.",
|
||||
},
|
||||
{
|
||||
icon: FaSyncAlt,
|
||||
title: "Integration Headaches",
|
||||
desc: "Difficulty connecting standard software with your existing systems and data.",
|
||||
},
|
||||
{
|
||||
icon: FaTools,
|
||||
title: "Lack of Competitive Edge",
|
||||
desc: "Using the same tools as everyone else limits opportunities for innovation.",
|
||||
},
|
||||
{
|
||||
icon: FaUsersCog,
|
||||
title: "Scalability Constraints",
|
||||
desc: "Outgrowing the capabilities or cost-effectiveness of standard solutions.",
|
||||
},
|
||||
].map((item) => (
|
||||
<div
|
||||
key={item.title}
|
||||
className="bg-white dark:bg-gray-700 p-6 rounded-lg shadow-md text-center transform transition duration-300 hover:-translate-y-1 hover:shadow-lg"
|
||||
>
|
||||
<item.icon
|
||||
className="text-4xl text-red-500 dark:text-red-400 mx-auto mb-4" // Using red for challenges
|
||||
/>
|
||||
<h4 className="text-xl font-semibold mb-2 font-poppins dark:text-white">
|
||||
{item.title}
|
||||
</h4>
|
||||
<p className="text-gray-600 dark:text-gray-300 text-sm">
|
||||
{item.desc}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 3. Our Solution Section */}
|
||||
{/* 2. How OMS Delivers Market-Ready Products Section */}
|
||||
<section
|
||||
id="our-solution"
|
||||
className="py-16 md:py-24 bg-white dark:bg-gray-900"
|
||||
id="how-we-deliver"
|
||||
className="py-16 md:py-24 bg-gray-50 dark:bg-gray-800"
|
||||
>
|
||||
<div className="container mx-auto px-6">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-12 items-center">
|
||||
<div>
|
||||
<h2 className="text-3xl md:text-4xl font-bold mb-6 font-poppins text-gray-900 dark:text-white leading-tight">
|
||||
OMS Custom Development: Software Built For You
|
||||
</h2>
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 leading-relaxed mb-4">
|
||||
We specialize in designing, developing, and deploying bespoke
|
||||
software applications that precisely match your operational
|
||||
needs and strategic goals. From automating complex workflows to
|
||||
creating unique customer experiences, we build solutions that
|
||||
deliver tangible results.
|
||||
</p>
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 leading-relaxed font-semibold">
|
||||
Our approach combines technical expertise with a deep
|
||||
understanding of business processes, ensuring the final product
|
||||
is not just functional, but truly transformative.
|
||||
</p>
|
||||
</div>
|
||||
<div className="relative h-64 md:h-80 rounded-lg overflow-hidden shadow-lg">
|
||||
<Image
|
||||
src="/images/custom-dev-placeholder.svg" // Replace with relevant image (e.g., code, blueprint, team working)
|
||||
alt="Custom Software Development Process"
|
||||
layout="fill"
|
||||
objectFit="cover"
|
||||
className="bg-gray-200 dark:bg-gray-700"
|
||||
/>
|
||||
<div className="absolute inset-0 bg-gradient-to-t from-black/10 to-transparent"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 4. Our Expertise Section (Showcasing OBSE) */}
|
||||
<section className="py-16 md:py-24 bg-gray-800 text-white">
|
||||
<div className="container mx-auto px-6">
|
||||
<div className="text-center mb-12 md:mb-16">
|
||||
<FaLightbulb
|
||||
className="text-5xl text-gold-500 mx-auto mb-4"
|
||||
style={{ color: COLORS.primary }}
|
||||
/>
|
||||
<h2 className="text-3xl md:text-4xl font-bold font-poppins mb-4">
|
||||
Proven Expertise in Complex Solutions
|
||||
</h2>
|
||||
<p className="text-lg md:text-xl max-w-3xl mx-auto leading-relaxed text-gray-300 mb-6">
|
||||
Our capabilities are demonstrated by our successful development of
|
||||
sophisticated platforms like OBSE (Optimised Bank Statement
|
||||
Extractor). This project showcases our ability to:
|
||||
</p>
|
||||
</div>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8 max-w-6xl mx-auto">
|
||||
{[
|
||||
{
|
||||
title: "Handle Complex Data",
|
||||
desc: "Develop systems that process and structure intricate data from varied sources.",
|
||||
icon: FaCogs,
|
||||
},
|
||||
{
|
||||
title: "Integrate Advanced Tech",
|
||||
desc: "Leverage OCR, machine learning, and robust APIs for powerful functionality.",
|
||||
icon: FaLaptopCode,
|
||||
},
|
||||
{
|
||||
title: "Build Scalable Platforms",
|
||||
desc: "Create solutions designed for high performance and future growth.",
|
||||
icon: FaRocket,
|
||||
},
|
||||
{
|
||||
title: "Focus on User Experience",
|
||||
desc: "Design intuitive interfaces that enhance usability and productivity.",
|
||||
icon: FaUserCheck,
|
||||
},
|
||||
].map((item) => (
|
||||
<SectionTitle>How OMS Delivers Market-Ready Products</SectionTitle>
|
||||
{/* No intro paragraph provided for this specific subtitle in the source */}
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 max-w-5xl mx-auto">
|
||||
{howOmsDeliversItems.map((item) => (
|
||||
<div
|
||||
key={item.title}
|
||||
className="bg-gray-700 p-6 rounded-lg text-center"
|
||||
>
|
||||
<item.icon
|
||||
className="text-4xl text-gold-500 mx-auto mb-4"
|
||||
style={{ color: COLORS.primary }}
|
||||
/>
|
||||
<h4 className="text-xl font-semibold mb-2 font-poppins text-white">
|
||||
{item.title}
|
||||
</h4>
|
||||
<p className="text-gray-300 text-sm">{item.desc}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<p className="text-center mt-8 text-gray-300 max-w-3xl mx-auto">
|
||||
This experience equips us to tackle diverse custom development
|
||||
challenges across various industries, particularly within the
|
||||
financial technology sector.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 5. Our Process Section */}
|
||||
<section className="py-16 md:py-24 bg-gradient-to-br from-gray-100 to-gray-200 dark:from-gray-800 dark:to-gray-700">
|
||||
<div className="container mx-auto px-6">
|
||||
<div className="text-center mb-12 md:mb-16">
|
||||
<h2 className="text-3xl md:text-4xl font-bold font-poppins text-gray-900 dark:text-white mb-4">
|
||||
Our Collaborative Development Journey
|
||||
</h2>
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 max-w-3xl mx-auto">
|
||||
We follow a structured yet flexible process to ensure your project
|
||||
is delivered successfully, on time, and within budget.
|
||||
</p>
|
||||
</div>
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||
{developmentProcess.map((step) => (
|
||||
<div
|
||||
key={step.title}
|
||||
className="bg-white dark:bg-gray-700 p-6 rounded-lg shadow-md flex items-start space-x-4"
|
||||
>
|
||||
<step.icon
|
||||
className="text-3xl text-gold-500 dark:text-gold-400 mt-1 flex-shrink-0"
|
||||
style={{ color: COLORS.primary }}
|
||||
/>
|
||||
{item.icon && (
|
||||
<item.icon
|
||||
className="text-3xl text-gold-500 dark:text-gold-400 mt-1 flex-shrink-0"
|
||||
style={{ color: COLORS.primary }}
|
||||
/>
|
||||
)}
|
||||
<div>
|
||||
<h4 className="text-lg font-semibold mb-1 font-poppins dark:text-white">
|
||||
{step.title}
|
||||
{item.title}
|
||||
</h4>
|
||||
<p className="text-gray-600 dark:text-gray-300 text-sm leading-relaxed">
|
||||
{step.description}
|
||||
{item.description}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -394,34 +373,60 @@ export default function ProductDevelopmentPage() {
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 6. Benefits Section */}
|
||||
{/* 3. End-to-End Product Development Section */}
|
||||
<section className="py-16 md:py-24 bg-white dark:bg-gray-900">
|
||||
<div className="container mx-auto px-6">
|
||||
<div className="text-center mb-12 md:mb-16">
|
||||
<h2 className="text-3xl md:text-4xl font-bold font-poppins text-gray-900 dark:text-white mb-4">
|
||||
Advantages of a Custom-Built Solution
|
||||
</h2>
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 max-w-3xl mx-auto">
|
||||
Investing in custom software development offers significant,
|
||||
long-term benefits for your organization.
|
||||
</p>
|
||||
</div>
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||
{coreBenefits.map((benefit) => (
|
||||
<SectionTitle>End-to-End Product Development</SectionTitle>
|
||||
<SectionParagraph>
|
||||
We support businesses throughout the entire product lifecycle, from
|
||||
ideation to post-launch support. Our comprehensive services cover
|
||||
every phase of development, ensuring that your product is not only
|
||||
designed and built to meet your current needs, but is also ready for
|
||||
future growth and evolution.
|
||||
</SectionParagraph>
|
||||
<FeatureGrid items={endToEndItems} />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 4. Cross-Platform Solutions Section */}
|
||||
<section className="py-16 md:py-24 bg-gray-50 dark:bg-gray-800">
|
||||
<div className="container mx-auto px-6">
|
||||
<SectionTitle>Cross-Platform Solutions</SectionTitle>
|
||||
<SectionParagraph>
|
||||
We deliver cross-platform products that work seamlessly across web,
|
||||
mobile, and desktop environments. This ensures your product is
|
||||
accessible to a wider audience and provides a consistent user
|
||||
experience, regardless of the device or platform.
|
||||
</SectionParagraph>
|
||||
<FeatureGrid items={crossPlatformItems} />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 5. Tech Stack Expertise Section */}
|
||||
<section className="py-16 md:py-24 bg-white dark:bg-gray-900">
|
||||
<div className="container mx-auto px-6">
|
||||
<SectionTitle>Tech Stack Expertise</SectionTitle>
|
||||
<SectionParagraph>
|
||||
Our product development solutions are powered by a diverse range of
|
||||
technologies. Whether you need a high-performance web app, a mobile
|
||||
solution, or a complex enterprise application, our team uses the
|
||||
latest and most suitable technologies to ensure the product is
|
||||
reliable, secure, and future-ready.
|
||||
</SectionParagraph>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
|
||||
{techStackItems.map((item) => (
|
||||
<div
|
||||
key={benefit.title}
|
||||
className="relative bg-gray-50 dark:bg-gray-800 p-6 rounded-lg shadow-sm border-t-4 border-gold-500 dark:border-gold-400 transition-shadow hover:shadow-md"
|
||||
style={{ borderColor: COLORS.primary }}
|
||||
key={item.title}
|
||||
className="bg-gray-100 dark:bg-gray-800 p-6 rounded-lg shadow-sm"
|
||||
>
|
||||
<benefit.icon
|
||||
className="text-3xl mb-3 text-gold-500 dark:text-gold-400"
|
||||
<h4
|
||||
className="text-lg font-semibold mb-2 font-poppins text-gold-600 dark:text-gold-400"
|
||||
style={{ color: COLORS.primary }}
|
||||
/>
|
||||
<h4 className="text-lg font-semibold mb-2 font-poppins dark:text-white">
|
||||
{benefit.title}
|
||||
>
|
||||
{item.title}
|
||||
</h4>
|
||||
<p className="text-gray-600 dark:text-gray-300 text-sm leading-relaxed">
|
||||
{benefit.description}
|
||||
<p className="text-gray-700 dark:text-gray-300 text-sm">
|
||||
{item.description}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
@ -429,23 +434,79 @@ export default function ProductDevelopmentPage() {
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 7. Call to Action (CTA) Section */}
|
||||
{/* 6. Quality Assurance & Testing Section */}
|
||||
<section className="py-16 md:py-24 bg-gray-50 dark:bg-gray-800">
|
||||
<div className="container mx-auto px-6">
|
||||
<SectionTitle>Quality Assurance & Testing</SectionTitle>
|
||||
<SectionParagraph>
|
||||
Our product development approach includes robust testing and quality
|
||||
assurance to ensure that your product is error-free, secure, and
|
||||
optimized for performance. We conduct thorough testing at each stage
|
||||
of the development process to deliver a high-quality final product.
|
||||
</SectionParagraph>
|
||||
<FeatureGrid items={qualityAssuranceItems} />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 7. Collaborative Development Process Section */}
|
||||
<section className="py-16 md:py-24 bg-white dark:bg-gray-900">
|
||||
<div className="container mx-auto px-6">
|
||||
<SectionTitle>Collaborative Development Process</SectionTitle>
|
||||
<SectionParagraph>
|
||||
We believe that collaboration is key to successful product
|
||||
development. Our agile and transparent development process ensures
|
||||
that you are always in the loop, from initial discussions to final
|
||||
delivery.
|
||||
</SectionParagraph>
|
||||
<FeatureGrid items={collaborativeProcessItems} />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 8. User-Centred Approach Section */}
|
||||
<section className="py-16 md:py-24 bg-gray-50 dark:bg-gray-800">
|
||||
<div className="container mx-auto px-6">
|
||||
<SectionTitle>User-Centred Approach</SectionTitle>
|
||||
<SectionParagraph>
|
||||
We design products with the end-user in mind, focusing on creating
|
||||
intuitive, engaging, and valuable experiences that delight customers
|
||||
and drive retention.
|
||||
</SectionParagraph>
|
||||
<FeatureGrid items={userCentredApproachItems} />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 9. Innovation & Emerging Technologies Section */}
|
||||
<section className="py-16 md:py-24 bg-white dark:bg-gray-900">
|
||||
<div className="container mx-auto px-6">
|
||||
<SectionTitle>Innovation & Emerging Technologies</SectionTitle>
|
||||
<SectionParagraph>
|
||||
At OMS, we believe in staying ahead of the curve by leveraging the
|
||||
latest innovations and emerging technologies to build
|
||||
next-generation products. We are constantly exploring new ways to
|
||||
incorporate cutting-edge solutions into our product development
|
||||
process.
|
||||
</SectionParagraph>
|
||||
<FeatureGrid items={innovationItems} />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 10. Call to Action (CTA) Section */}
|
||||
<section
|
||||
className="py-16 md:py-24 bg-gold-500 text-gray-900"
|
||||
style={{ backgroundColor: COLORS.primary }}
|
||||
>
|
||||
<div className="container mx-auto px-6 text-center">
|
||||
<h2 className="text-3xl md:text-4xl font-bold mb-4 font-poppins">
|
||||
Ready to Build Your Unique Software Solution?
|
||||
Ready to Transform Your Ideas into Reality?
|
||||
</h2>
|
||||
<p className="text-lg md:text-xl max-w-3xl mx-auto leading-relaxed mb-8 font-poppins text-gray-800">
|
||||
Let's discuss your specific needs and explore how OMS can
|
||||
develop custom software to drive your business forward. Schedule a
|
||||
consultation with our experts today.
|
||||
Let's discuss your product vision and explore how OMS can
|
||||
develop innovative digital solutions to drive your business forward.
|
||||
Schedule a consultation with our experts today.
|
||||
</p>
|
||||
<div className="flex flex-col sm:flex-row justify-center items-center gap-4">
|
||||
<Link
|
||||
href="/contact?subject=Custom Development Inquiry" // Pre-fill subject
|
||||
href="/contact?subject=Product Development Inquiry" // Pre-fill subject
|
||||
className="inline-block bg-gray-800 text-white font-bold py-3 px-8 rounded-md hover:bg-gray-900 dark:bg-gray-900 dark:hover:bg-black transition-colors duration-300"
|
||||
>
|
||||
Request a Consultation
|
||||
@ -460,7 +521,7 @@ export default function ProductDevelopmentPage() {
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 8. Contact Information Section */}
|
||||
{/* 11. Contact Information Section */}
|
||||
<section
|
||||
id="contact"
|
||||
className="py-16 md:py-24 bg-gray-100 dark:bg-gray-800"
|
||||
@ -471,7 +532,7 @@ export default function ProductDevelopmentPage() {
|
||||
Get in Touch
|
||||
</h2>
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 max-w-3xl mx-auto">
|
||||
Have a project in mind or need more information about our custom
|
||||
Have a project in mind or need more information about our product
|
||||
development services? Reach out today.
|
||||
</p>
|
||||
</div>
|
||||
@ -505,12 +566,11 @@ export default function ProductDevelopmentPage() {
|
||||
Email
|
||||
</h3>
|
||||
<a
|
||||
href="mailto:info@oms.africa?subject=Custom Development Inquiry" // General info or specific contact
|
||||
href="mailto:info@oms.africa?subject=Product Development Inquiry"
|
||||
className="text-gray-600 hover:text-gray-800 dark:text-gray-300 dark:hover:text-gray-100 transition text-sm"
|
||||
>
|
||||
info@oms.africa
|
||||
</a>{" "}
|
||||
{/* Or use Zanelem@oms.africa if preferred */}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<Link
|
||||
|
||||
@ -22,15 +22,12 @@ import {
|
||||
FaUsers, // For Teams/Resources
|
||||
FaChartLine, // For Reporting/MI
|
||||
FaLightbulb, // For Innovation/Solutions
|
||||
FaPhone, // Contact
|
||||
FaEnvelope, // Contact
|
||||
FaTools, // General Capabilities
|
||||
FaLayerGroup, // Frameworks (SAFe, etc.)
|
||||
FaFileInvoiceDollar, // Cost/Pricing
|
||||
FaBusinessTime, // Experience/Past Projects
|
||||
} from "react-icons/fa";
|
||||
import { COLORS } from "@/constants"; // Assuming COLORS constant is available
|
||||
import ContactForm from "@/components/ContactForm"; // Assuming ContactForm is available
|
||||
|
||||
// SEO Metadata
|
||||
export const metadata: Metadata = {
|
||||
@ -98,7 +95,7 @@ interface ServiceModel {
|
||||
const serviceModels: ServiceModel[] = [
|
||||
{
|
||||
icon: FaClock,
|
||||
title: "Resource Augmentation Model (Time & Material)",
|
||||
title: "Resource Augmentation Model",
|
||||
description:
|
||||
"Access skilled IT professionals on demand to supplement your existing team.",
|
||||
details: [
|
||||
@ -111,15 +108,14 @@ const serviceModels: ServiceModel[] = [
|
||||
},
|
||||
{
|
||||
icon: FaTasks,
|
||||
title: "Milestone-Based Model (Managed Service)",
|
||||
title: "Milestone-Based Model",
|
||||
description:
|
||||
"OMS takes full responsibility for delivering specific IT project phases or entire projects.",
|
||||
details: [
|
||||
"Includes Project Planning & Management.",
|
||||
"Covers End-to-end Process Design (Requirements, BPD, Arch, UX/UI).",
|
||||
"Includes Data & MI Design (Architecture, Transformation, BI).",
|
||||
"Comprehensive Testing & QA (Strategy, Implementation, Management).",
|
||||
"OMS manages all deployed team members, deliverables, and velocity.",
|
||||
"Covers End-to-end Process Design (Requirements, Business Process Design, Architecture, User Experience/User Interface, Data Architecture, Transformation, and Business Intelligence).",
|
||||
"Change Management & Training ",
|
||||
"Comprehensive Testing and Quality Assurance.",
|
||||
],
|
||||
pricingModel:
|
||||
"Milestone-Based pricing, payable on delivery of key milestones.",
|
||||
@ -553,7 +549,7 @@ export default function ResourceAugmentationPage() {
|
||||
{model.title}
|
||||
</h3>
|
||||
</div>
|
||||
<p className="text-gray-600 dark:text-gray-300 mb-4 text-sm flex-grow">
|
||||
<p className="text-gray-600 dark:text-gray-300 mb-4 text-sm">
|
||||
{model.description}
|
||||
</p>
|
||||
<ul className="space-y-2 mb-4">
|
||||
@ -566,17 +562,19 @@ export default function ResourceAugmentationPage() {
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
{/* Add the sentence as a separate paragraph for the Milestone model */}
|
||||
{model.title === "Milestone-Based Model" && (
|
||||
<p className="text-sm text-gray-700 dark:text-gray-300 mb-4 italic">
|
||||
OMS manages all deployed team members, deliverables, and
|
||||
velocity.
|
||||
</p>
|
||||
)}
|
||||
<p className="text-sm font-semibold text-gray-800 dark:text-gray-200 mt-auto pt-4 border-t border-gray-200 dark:border-gray-600">
|
||||
{model.pricingModel}
|
||||
</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<p className="text-center text-md text-gray-700 dark:text-gray-300 mt-12 max-w-3xl mx-auto">
|
||||
OMS operates using both <span className="font-semibold">AGILE</span>{" "}
|
||||
and <span className="font-semibold">Waterfall</span> Frameworks,
|
||||
depending on client preference and project suitability.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@ -704,8 +702,10 @@ export default function ResourceAugmentationPage() {
|
||||
Financial Services & Compliance
|
||||
</h4>
|
||||
<p className="text-sm text-gray-600 dark:text-gray-300">
|
||||
FIC/KYC Remediation (Data Architecture, MI), Core Banking
|
||||
Systems, Lending/Credit Process Optimisation.
|
||||
Expertise in FIC/KYC remediation, including data architecture
|
||||
and management information design, as well as core banking
|
||||
systems and end-to-end optimisation of lending and credit
|
||||
processes.
|
||||
</p>
|
||||
</div>
|
||||
<div className="bg-gray-50 dark:bg-gray-800 p-6 rounded-lg shadow-sm">
|
||||
@ -717,8 +717,9 @@ export default function ResourceAugmentationPage() {
|
||||
Customer Management & Onboarding
|
||||
</h4>
|
||||
<p className="text-sm text-gray-600 dark:text-gray-300">
|
||||
Design, Testing, Requirements, Process Engineering, UX/UI for
|
||||
customer-facing platforms.
|
||||
Crafting seamless, data-driven onboarding experiences through
|
||||
straight-through processing, enhanced customer journeys,
|
||||
real-time insights, and a 360-degree customer view.
|
||||
</p>
|
||||
</div>
|
||||
<div className="bg-gray-50 dark:bg-gray-800 p-6 rounded-lg shadow-sm">
|
||||
@ -730,8 +731,10 @@ export default function ResourceAugmentationPage() {
|
||||
Platform & Process Automation
|
||||
</h4>
|
||||
<p className="text-sm text-gray-600 dark:text-gray-300">
|
||||
Straight-Through Processing (STP) on Banking Platforms, API
|
||||
Integration, Salesforce implementations.
|
||||
Specialising in Straight-Through Processing (STP) for banking
|
||||
platforms, seamless API integration, and end-to-end Salesforce
|
||||
implementations to drive efficiency and reduce manual
|
||||
intervention.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -831,100 +834,6 @@ export default function ResourceAugmentationPage() {
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* 11. Contact Information Section */}
|
||||
<section className="py-16 md:py-24 bg-gray-100 dark:bg-gray-800">
|
||||
<div className="container mx-auto px-6">
|
||||
<div className="text-center mb-12">
|
||||
<h2 className="text-3xl md:text-4xl font-bold font-poppins text-gray-900 dark:text-white mb-4">
|
||||
Get in Touch
|
||||
</h2>
|
||||
<p className="text-md md:text-lg text-gray-700 dark:text-gray-300 max-w-3xl mx-auto">
|
||||
We're ready to assist you. Reach out via phone, email, or use
|
||||
the form below to start the conversation about your IT resource
|
||||
needs.
|
||||
</p>
|
||||
</div>
|
||||
<div className="max-w-4xl mx-auto grid grid-cols-1 md:grid-cols-2 gap-8 items-start">
|
||||
{/* Contact Details */}
|
||||
<div className="space-y-6 bg-white dark:bg-gray-700 p-6 rounded-lg shadow-md">
|
||||
<h3 className="text-xl font-semibold font-poppins text-gray-900 dark:text-white mb-4">
|
||||
Contact Information
|
||||
</h3>
|
||||
<div className="flex items-center space-x-4">
|
||||
<FaPhone
|
||||
className="w-6 h-6 flex-shrink-0"
|
||||
style={{ color: COLORS.primary }}
|
||||
/>
|
||||
<div>
|
||||
<h4 className="text-lg font-semibold font-poppins text-gray-800 dark:text-gray-100">
|
||||
Phone
|
||||
</h4>
|
||||
{/* Using specific numbers from PDF */}
|
||||
<a
|
||||
href="tel:+27120513281"
|
||||
className="block text-gray-600 hover:text-gray-800 dark:text-gray-300 dark:hover:text-gray-100 transition text-sm"
|
||||
>
|
||||
Zanele: (012) 051 3281
|
||||
</a>
|
||||
<a
|
||||
href="tel:+27120513282"
|
||||
className="block text-gray-600 hover:text-gray-800 dark:text-gray-300 dark:hover:text-gray-100 transition text-sm"
|
||||
>
|
||||
Lindiwe: (012) 051 3282
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center space-x-4">
|
||||
<FaEnvelope
|
||||
className="w-6 h-6 flex-shrink-0"
|
||||
style={{ color: COLORS.primary }}
|
||||
/>
|
||||
<div>
|
||||
<h4 className="text-lg font-semibold font-poppins text-gray-800 dark:text-gray-100">
|
||||
Email
|
||||
</h4>
|
||||
{/* Using specific emails from PDF */}
|
||||
<a
|
||||
href="mailto:Zanelem@oms.africa"
|
||||
className="block text-gray-600 hover:text-gray-800 dark:text-gray-300 dark:hover:text-gray-100 transition text-sm"
|
||||
>
|
||||
Zanelem@oms.africa
|
||||
</a>
|
||||
<a
|
||||
href="mailto:Lindiwes@oms.africa"
|
||||
className="block text-gray-600 hover:text-gray-800 dark:text-gray-300 dark:hover:text-gray-100 transition text-sm"
|
||||
>
|
||||
Lindiwes@oms.africa
|
||||
</a>
|
||||
<a
|
||||
href="mailto:admin@oms.africa"
|
||||
className="block text-gray-600 hover:text-gray-800 dark:text-gray-300 dark:hover:text-gray-100 transition text-sm mt-1"
|
||||
>
|
||||
admin@oms.africa (General)
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{/* Optional: Link to main contact page */}
|
||||
<Link
|
||||
href="/contact"
|
||||
className="inline-flex items-center text-gold-600 dark:text-gold-400 hover:text-gold-700 dark:hover:text-gold-300 font-semibold transition-colors duration-300 mt-4"
|
||||
style={{ color: COLORS.primary }}
|
||||
>
|
||||
Go to Full Contact Page <FaArrowRight className="ml-2" />
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
{/* Contact Form */}
|
||||
<div className="bg-white dark:bg-gray-700 p-6 rounded-lg shadow-md">
|
||||
<h3 className="text-xl font-semibold font-poppins text-gray-900 dark:text-white mb-4">
|
||||
Send a Quick Inquiry
|
||||
</h3>
|
||||
<ContactForm /> {/* Reuse your existing contact form */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user