Freelancers using TypeScript in Sindh

Freelancers using TypeScript in SindhFreelancers using TypeScript in Sindh

Projects People

Muhammad Hassan

proKarachi, Pakistan

Full-Stack & AI Developer | Next.js, AI Agents

$50k+: Earned

12x: Hired

5.0: Rating

242: Followers

Full-Stack & AI Developer | Next.js, AI Agents

Cover image for Add Session Timings to Calendar Directly Using Agent

Add Session Timings to Calendar Directly Using Agent

0

5

Cover image for Automatic Rules Set for creating tasks

Automatic Rules Set for creating tasks

0

4

Cover image for Prsoo: Concept to Launch in 4 Weeks

Prsoo: Concept to Launch in 4 Weeks

1

70

Cover image for React : The ultimate guide 2023 - Certificate

React : The ultimate guide 2023 - Certificate

1

77

proKarachi, Pakistan

Full-Stack & AI Developer | Next.js, AI Agents

$25k+: Earned

7x: Hired

5.0: Rating

54: Followers

Full-Stack & AI Developer | Next.js, AI Agents

Cover image for NextClean - Cleaning Service Platform

NextClean - Cleaning Service Platform

2

27

Cover image for Another product shipped.
We just launched

Another product shipped. We just launched the iOS app for Legacy Building Journals, a platform built to help people preserve the stories, memories, and moments that matter most. https://apps.apple.com/pk/app/legacy-building-journals/id6778774585 This wasn't another journaling app. The goal was to create a space where users can capture life experiences through writing, photos, and voice recordings, then preserve them for future generations. Our team handled everything from product strategy to development, working closely with the client to turn their vision into a polished, production-ready iOS experience. What we shipped: 1. Full iOS app (React Native) 2. Photo, text, and voice recording capture 3. Stripe + Apple Pay integration Building products people use daily is always rewarding. Building one that helps families preserve their legacy hits different. Proud of the team for bringing this to life. On to the next one.

8

13

665

Cover image for Project X - AI-Powered Hiring Platform MVP

$1.5K+ earned

Project X - AI-Powered Hiring Platform MVP

0

20

Cover image for Legacy Building: Media Export & Community Features

Legacy Building: Media Export & Community Features

0

10

Syed Ahmer Shah

Hyderabad, Pakistan

Bringing Your Ideas to Life with Modern, Custom Websites

5.0: Rating

5: Followers

Bringing Your Ideas to Life with Modern, Custom Websites

Cover image for Syed Ahmer Shah developed a

Syed Ahmer Shah developed a powerful AI Chatbot & Virtual Assistant Mobile Platform that brings conversational artificial intelligence, content generation, task assistance, and productivity tools together within a single cross-platform application. The solution enables users to interact with intelligent assistants and access AI-powered support across a wide range of personal, educational, and professional use cases. The project demonstrates expertise in Artificial Intelligence Development, AI Chatbot Development, AI Agent Development, Generative AI, Mobile Application Development, Backend Engineering, and UI/UX Design. The platform was designed to make advanced AI capabilities accessible through a simple and responsive mobile interface for Android and iOS users. Users can engage with AI assistants to answer questions, create and refine content, summarize documents or text, translate languages, improve written communication, organize business activities, support learning, generate recipes, and receive productivity or financial guidance. Specialized assistants provide tailored experiences for different needs, including creative writing, business planning, education, language learning, logo creation, cooking, and financial assistance. The AI-powered infrastructure supports conversational workflows, prompt management, persistent chat history, configurable assistant profiles, secure authentication, real-time synchronization, usage monitoring, subscription management, and integration with Large Language Models (LLMs). Push notifications and optimized backend services help maintain a responsive experience, while the scalable architecture supports continued growth across Android and iOS devices. This project showcases Syed Ahmer Shah’s capability to build AI-powered mobile products, Generative AI platforms, virtual assistants, LLM-based applications, intelligent AI agents, and custom automation solutions for startups, enterprises, technology companies, and digital businesses. Technologies Used: React Native, Node.js, Express.js, Python, FastAPI, PostgreSQL, Firebase, AWS Cloud, OpenAI API, LLM API Integrations, REST APIs, Push Notification Services. Services Provided: Artificial Intelligence Development, AI Chatbot Development, AI Agent Development, Generative AI Development, Mobile App Development, Android App Development, iOS App Development, React Native Development, LLM Integration, Backend Development, API Development, UI/UX Design, Cloud Infrastructure Development. Keywords: AI Chatbot Development, AI Agent Development, Generative AI Development, Virtual Assistant App, Mobile App Development, React Native Development, Android App Development, iOS App Development, LLM App Development, OpenAI API Integration, Conversational AI, AI Productivity App, AI Writing Assistant, Python, FastAPI, Node.js, Firebase, AWS, REST API, Custom Software Development, Software Engineer.

1

70

Cover image for Syed Ahmer Shah developed a

Syed Ahmer Shah developed a comprehensive Expense Tracking & Personal Finance Mobile Platform designed to help individuals organize their money, monitor spending, build savings, and work toward financial goals from a single secure application. The cross-platform solution combines budgeting tools, financial analytics, transaction management, and personalized insights for Android and iOS users. The project demonstrates expertise in Mobile Application Development, FinTech Software Development, Personal Finance Technology, Custom Software Development, Backend Engineering, and UI/UX Design. The platform was created to simplify everyday financial management while giving users a clearer understanding of their spending and saving patterns. Users can record and monitor income and expenses, connect and manage multiple accounts or digital wallets, establish monthly spending limits, analyze cash flow, and organize transactions into categories. Additional functionality includes savings goals, spending insights, financial summaries, detailed reports, and interactive analytics dashboards. AI-powered budgeting recommendations can help users identify spending patterns and make more informed decisions about their finances. A scalable cloud infrastructure supports secure authentication, encrypted financial information, real-time synchronization, automated transaction processing, financial reporting, intelligent analytics, and push notifications. An administrative dashboard provides centralized controls for managing users, accounts, transactions, and reports. The application is designed to maintain strong security, responsiveness, and reliability as the user base grows across Android and iOS. This project showcases Syed Ahmer Shah’s ability to develop FinTech applications, expense management platforms, personal budgeting solutions, financial analytics tools, and customized money-management software for startups, financial technology companies, service providers, and digital businesses. Technologies Used: React Native, Node.js, Express.js, Firebase, PostgreSQL, AWS Cloud, REST APIs, Secure Authentication, Financial Analytics, Push Notification Services. Services Provided: Mobile App Development, Android App Development, iOS App Development, React Native Development, FinTech App Development, Personal Finance App Development, Expense Tracker Development, Budget Management Software Development, Custom Software Development, Backend Development, API Development, UI/UX Design, Cloud Infrastructure Development. Keywords: Expense Tracker App Development, Personal Finance App Development, Budget Tracker App, FinTech App Development, Mobile App Development, React Native Development, Android App Development, iOS App Development, Money Management App, Financial Management Software, Expense Analytics, Budget Planning App, Node.js, Firebase, PostgreSQL, AWS, REST API, Custom Software Development, Software Engineer.

1

75

Cover image for Syed Ahmer Shah developed a

Syed Ahmer Shah developed a feature-rich Hotel Booking & Travel Mobile Platform that enables travelers to search, evaluate, and reserve accommodations through a streamlined cross-platform application. The solution combines hotel discovery, real-time availability, booking management, secure payments, and travel-focused recommendations into a convenient experience for Android and iOS users. The project highlights expertise in Mobile Application Development, Travel Technology, Hotel Reservation Systems, Hospitality Software Development, Custom Software Engineering, Backend Development, API Integration, and UI/UX Design. The platform was designed to support travelers while providing accommodation businesses with the tools required to manage inventory, reservations, pricing, and customer activity. Users can discover hotels based on destination, travel dates, budget, ratings, facilities, and other preferences. Each property can include photographs, room information, location details, guest feedback, available rooms, pricing, and promotional offers. Travelers can complete reservations securely, save preferred properties, review previous bookings, receive location-based suggestions, and take advantage of limited-time or last-minute accommodation deals. The cloud infrastructure provides secure authentication, live room availability, hotel inventory management, payment processing, automated booking confirmations, Google Maps integration, push notifications, external travel API connectivity, and centralized administration. The admin dashboard allows authorized teams to manage properties, reservations, rates, promotions, customers, refunds, and operational analytics. The architecture is designed for responsive performance, reliability, and scalable operation across Android and iOS devices. This project demonstrates Syed Ahmer Shah’s expertise in creating hotel reservation platforms, travel booking applications, hospitality management software, accommodation marketplaces, and customized mobile travel solutions for hotels, travel agencies, tourism companies, hospitality operators, and technology startups. Technologies Used: React Native, Node.js, Express.js, Firebase, PostgreSQL, AWS Cloud, REST APIs, Google Maps API, Payment Gateway Integration, Push Notification Services. Services Provided: Mobile App Development, Android App Development, iOS App Development, React Native Development, Hotel Booking App Development, Travel App Development, Hospitality Software Development, Custom Software Development, Backend Development, API Development, UI/UX Design, Cloud Infrastructure Development. Keywords: Hotel Booking App Development, Travel App Development, Hospitality Software Development, Mobile App Development, React Native Development, Android App Development, iOS App Development, Hotel Reservation System, Travel Marketplace Development, Booking Platform Development, Google Maps API, Payment Gateway Integration, Node.js, Firebase, Custom Software Development, Software Engineer.

1

98

Cover image for Syed Ahmer Shah built a

Syed Ahmer Shah built a secure and feature-rich Bitcoin & Cryptocurrency Wallet Mobile Application that gives users a convenient way to manage digital assets, follow cryptocurrency markets, and carry out crypto transactions from a single mobile platform. The application combines financial tools, real-time market data, security features, and portfolio management in an intuitive experience for Android and iOS users. The project highlights expertise in Mobile App Development, Cryptocurrency Application Development, FinTech Software Engineering, Blockchain Solutions, Digital Wallet Development, Custom Software Development, Backend Engineering, and UI/UX Design. The platform was designed to support both everyday crypto users and businesses seeking a scalable digital asset management solution. Users can manage Bitcoin and other supported cryptocurrencies, view live market prices, buy and sell digital assets, exchange one cryptocurrency for another, and review their complete transaction activity. Portfolio tracking tools allow users to monitor asset allocation and performance, while market-focused features such as watchlists, price notifications, and analytics provide timely insights into cryptocurrency movements. Security was a core component of the platform, with features including protected account onboarding, identity/KYC verification, two-factor authentication, encrypted data handling, secure wallet management, transaction monitoring, and administrative controls. The backend infrastructure supports real-time market data integrations, transaction-related services, push notifications, and reliable synchronization between the application and cloud services. The solution demonstrates Syed Ahmer Shah’s ability to develop cryptocurrency wallets, blockchain-powered applications, FinTech platforms, digital asset management systems, and secure financial software for crypto startups, digital finance companies, blockchain businesses, and emerging technology ventures. Technologies Used: React Native, Node.js, Express.js, PostgreSQL, Firebase, AWS Cloud, REST APIs, Cryptocurrency Market APIs, KYC Verification, Two-Factor Authentication, Push Notification Services. Services Provided: Mobile App Development, Android App Development, iOS App Development, React Native Development, FinTech Application Development, Crypto App Development, Digital Wallet Development, Blockchain Development, Custom Software Development, Backend Development, API Development, UI/UX Design, Cloud Infrastructure Development.

1

61

Abdul Moiz Memon

proKarachi, Pakistan

Senior Full-Stack & Web3 Engineer | Technical Lead

$1k+: Earned

1x: Hired

5.0: Rating

20: Followers

Senior Full-Stack & Web3 Engineer | Technical Lead

Cover image for EthicalNode V2 — AI Assisted Platform Rebuild

EthicalNode V2 — AI Assisted Platform Rebuild

1

8

Cover image for Sahal Wallet — Cosmos Staking & Wallet Integrations

Sahal Wallet — Cosmos Staking & Wallet Integrations

1

12

Cover image for NIPRM V2 — Website, CMS & Biometric Attendance System

NIPRM V2 — Website, CMS & Biometric Attendance System

0

7

Cover image for Emplifai — DeFi Yield Vaults With Solidity & Foundry

Emplifai — DeFi Yield Vaults With Solidity & Foundry

0

47

proKarachi, Pakistan

AI SaaS Engineer | Next.js + Node.js | MVPs to Production

1x: Hired

5.0: Rating

12: Followers

AI SaaS Engineer | Next.js + Node.js | MVPs to Production

Cover image for EduPilotPro Mobile — Parent & Student App (iOS + Android)

EduPilotPro Mobile — Parent & Student App (iOS + Android)

0

8

Cover image for EduPilotPro AI Attendance Agent Project

EduPilotPro AI Attendance Agent Project

0

11

Cover image for Development of EduPilotPro AI-Powered School Operating System

Development of EduPilotPro AI-Powered School Operating System

0

23

Cover image for Kismaa Mobile — Engineering a Real-Time Experience

Kismaa Mobile — Engineering a Real-Time Experience

0

7

proKarachi, Pakistan

Production-ready AI agents and SaaS built to scale reliably.

$25k+: Earned

2x: Hired

108: Followers

Production-ready AI agents and SaaS built to scale reliably.

Cover image for KovaRisk: When the Interface Knew

KovaRisk: When the Interface Knew More Than the System ────────────────────────────────────────── The Expert in the Room Compliance officers don't struggle to understand risk. They struggle to act on it fast enough. The team behind KovaRisk understood this precisely. They had spent years inside financial institutions watching the same dysfunction repeat: alerts buried in spreadsheets, investigations tracked in email threads, audit trails reconstructed after the fact. They knew what the interface needed to feel like because they'd lived with the one that didn't. So they built it. Fast. Exactly as they'd imagined it. What emerged was sharp: a risk monitoring dashboard with filterable alert feeds, entity profiles with 12-month risk trajectories, a rule engine with toggle controls, and an audit log that felt immutable. The scenario switcher let compliance teams stress-test different alert load states. The side panel made investigations feel contained and intentional. It looked like a system that had survived production. It hadn't been asked to yet. ────────────────────────────────────────── What Existed Was a Strong Interface - Not a System Every alert in KovaRisk was generated at startup. Every risk score was computed by a random seed function. Every status change - Investigating, Resolved, Escalated - lived in component state. Every timeline event was appended to an in-memory array. Every rule toggle disappeared on refresh. The audit log recorded nothing. The export downloaded a snapshot of what React was holding at that moment. The entity risk history was a curve drawn from a formula, not a record. The logic was there. But it had nowhere to live. A compliance officer investigating a high-risk wire transfer would open the side panel, read the plain-English rule explanation, mark the alert as Investigating, add an internal note - and lose every one of those actions the moment they refreshed the browser. No colleague could see what they'd done. No regulator could verify it had happened. In financial compliance, that's not a UX problem. It's a liability. The prototype validated the workflow brilliantly. It exposed exactly how a compliance team would move through their day. But three things were missing: a source of truth, a coordination layer, and a trail that could be audited under pressure. ────────────────────────────────────────── They Didn't Need More Features - They Needed a System Behind the Interface The team came with a clear idea and a working prototype. What they needed was the architecture that made the prototype a product - the layer that turned interface actions into durable facts. Not a rebuild. A foundation. ────────────────────────────────────────── The Layer That Made It Dependable Data Models: Giving State a Home The first thing to reconstruct was where the data should actually live. KovaRisk's frontend implied a clear schema - alerts, entities, rules, audit events - but none of it persisted. The production system needed a PostgreSQL core with five primary entities: • Alert — with foreign keys to Entity, Rule, Transaction, and a JSONB timeline column for ordered event history • Entity — with risk tier, jurisdiction metadata, and a one-to-many relationship to RiskScore snapshots • Rule — with active/disabled state, trigger thresholds, false-positive tracking, and a versioning mechanism so changes to rules didn't retroactively alter historical alerts • AuditEvent — append-only, with actor ID, action type, target reference, and a server-generated timestamp that clients cannot modify • InternalNote — owned by an alert, with authorship and a soft-delete flag to preserve compliance integrity Every status change, note, escalation, and flag the UI handled ephemerally became a write to this schema. The Alert Generation Engine: Replacing the Seed Function In the prototype, 85 alerts appeared because a loop ran 85 times at startup. In production, alerts are the output of a Transaction Monitoring Service - a background process that runs continuously against incoming transaction streams. This service: • Evaluates each transaction against every active Rule definition • Computes a risk score using rule weights, entity risk tier, jurisdiction flags, and behavioral baselines • Creates an Alert record only when a threshold is breached • Emits an event to a notification queue for high-risk triggers The rule engine the UI let users toggle wasn't decorative. Each rule mapped to an evaluation function in the monitoring service. Disabling a rule didn't just grey out a card - it removed it from the active evaluation set. Re-enabling it didn't retroactively generate alerts it would have caught; it resumed from the point of activation. That distinction mattered for regulatory defensibility. ────────────────────────────────────────── Async Workflows: The Operations the UI Implied But Couldn't Sustain Several interactions in the prototype implied workflows that couldn't complete synchronously. Escalation - When an alert was escalated, the UI changed a status badge. In production, escalation triggers a queue job that: notifies the senior compliance officer via a configured channel, creates a case record linking the alert, and starts a response SLA timer. The UI reflects the outcome - it doesn't produce it. Scheduled Screening - The Sanctions Screening Match rule in the prototype was static. In production, it's a nightly job that re-screens all active entities against updated OFAC, EU, and UN sanctions lists - generating new alerts if a previously clean entity now appears. The results feed back into the alert pipeline. Report Export - The dashboard's Export Report button downloaded a text file of whatever React was holding in memory. In production, report generation is an async job: the user requests the report, the job runs server-side against the live database, and a download link is returned when ready. The content is a verifiable, timestamped record - not a UI snapshot. ────────────────────────────────────────── The Audit Log: From Feed to Fact The prototype's audit log was populated by a generateAuditLog function. It looked comprehensive and immutable. It was neither. Production audit events are written by the API layer on every state-modifying operation - before the response is returned to the client. The table is append-only. No update operations are permitted on AuditEvent records. Timestamps are server-generated in UTC and stored with full precision. Actor identity comes from the authenticated session, not from a string the client sends. The audit log the interface displayed was a simulation of accountability. The production version is the accountability. ────────────────────────────────────────── Tech Stack 1. Frontend: React + Vite, React Router v6, Recharts, React Context + local state, TanStack Query 2. Backend: Node.js + TypeScript, Fastify, Prisma, PostgreSQL, Redis, BullMQ, Passport.js + express-session 3. Infrastructure: AWS ECS / Railway / Render, S3, AWS Secrets Manager / Doppler, Sentry + Datadog, GitHub Actions 4. External Integrations: OFAC / ComplyAdvantage, Refinitiv World-Check, SendGrid / SMTP, Webhooks ────────────────────────────────────────── From Interface to System The prototype answered the right questions. It proved the workflow was sound, the information hierarchy was correct, and the alert investigation pattern worked the way compliance officers needed it to. What it couldn't answer was: what happens when two investigators open the same alert simultaneously? What happens when a rule change needs to take effect immediately across 200 pending alerts? What happens when a regulator asks for every action taken on a specific entity over the past 18 months? Those questions don't live in the interface. They live in the system. KovaRisk's interface was always strong. What it needed was the architecture to make it real - persistent, coordinated, auditable, and defensible under scrutiny. The logic existed from the beginning. We gave it somewhere to live.

2

1.9K

Cover image for Paytrix: From Interface Logic to

Paytrix: From Interface Logic to Compensation Infrastructure The Insight The builder behind Paytrix understood compensation deeply, not as a payroll function, but as a structural problem. They knew that most companies manage salary bands in spreadsheets, that job title normalization is a nightmare at scale, and that equity analysis gets ignored until it becomes a legal liability. They knew this because they lived it. So they built what they knew. Fast. What Existed Paytrix, as delivered, was a polished React application, built with Vite, Tailwind, Radix primitives, and Recharts, spanning six distinct modules: a dashboard, an HRIS data upload flow, a compensation modeling engine, a scenario simulator, an equity analysis suite, and a settings panel. The interface was sharp. The workflows were correct. A user could upload employee data, watch AI "normalize" job titles into a structured architecture, model salary bands against market percentiles, run budget impact scenarios, and review compression risks across career levels. It looked like a product. But every piece of logic lived on the client. Where It Breaks The 114 employees in the system are not uploaded. They are hardcoded in a TypeScript file. The "AI normalization" is a setInterval cycling through four progress labels over two seconds. Market benchmarks are arithmetic constants (industryPremium = 0.08). The equity analysis, compa-ratios, range penetration histograms, compression heatmaps, renders from static arrays defined at the top of the component. Scenario simulation multiplies a base salary by a percentile offset. The entire application state persists to localStorage. None of this is a criticism. It's what a vibe-coded prototype should be: directionally correct, visually convincing, structurally hollow. The problems emerge when you try to use it: • No persistence. Clear your browser, lose your scenarios. There's no database, no user accounts, no tenant isolation. • No real data ingestion. The upload flow accepts nothing. There's no CSV parser, no file handler, no validation pipeline. The "AI" that maps "Sr. Software Engineer" to "Engineering / L3 - Mid-Level" is a pre-written array with confidence scores already assigned. • No market data layer. Salary benchmarks are invented constants. There's no connection to BLS, Radford, Mercer, or any compensation data provider. The "industry premium" and "funding stage adjustment" are fixed floats that don't change regardless of input. • No computation engine. Compa-ratios, range penetrations, and compression risks are display values, not derived metrics. Change an employee's salary in the mock data and the equity charts do not move, because the charts read from a different hardcoded array. • No multi-user support. "Welcome back, Alex" is a string literal. There's no auth, no RBAC, no concept of who should see what. The logic was all there. It just had nowhere to live. The System That Needed to Exist What Paytrix required was not more UI work. It required the invisible layer that makes compensation software trustworthy. Data Ingestion Pipeline A backend service that accepts HRIS CSV uploads, validates schema (employee ID, title, department, salary, location, demographics), handles malformed data gracefully, and stages records for processing. This is not a file drop. It is an ETL pipeline with column mapping, deduplication, and audit logging. The upload endpoint needs to support files from Workday, BambooHR, Rippling, and manual exports, each with different schemas. Job Architecture Normalization Service The prototype simulates AI-driven title mapping. In production, this is a classification service, likely backed by an LLM or a trained model, that ingests raw job titles and maps them to a canonical taxonomy of families and levels. It needs to handle ambiguity ("Sr. Software Engineer" vs. "Senior Software Engineer" vs. "SWE III"), surface confidence scores that reflect model uncertainty, and support human-in-the-loop correction that feeds back into the model. This is a backend job queue, not a frontend animation. Market Data Integration Layer Compensation modeling requires real benchmark data. The system needs API integrations with at least one primary data provider (Radford, Mercer, Comptryx) and the ability to ingest custom survey data. Market rates need to be indexed by role, geography, industry, company size, and funding stage. This is a multi-dimensional lookup that changes quarterly. This data must be versioned and cacheable, with fallback logic when specific cuts are not available. Compensation Calculation Engine The core math, midpoint derivation, band construction, compa-ratio computation, range penetration, compression detection, needs to run server-side against real employee records and real market data. The prototype calculates midpoint = baseMarket * (1 + industryPremium + fundingAdjustment) * percentileMultiplier. In production, this becomes a parameterized model where each variable is resolved from the market data layer, scoped to the company’s configuration, and applied across every employee in the dataset. Band width, skills premiums, and geographic differentials are all configurable per job family. Scenario Persistence and Comparison The prototype stores scenarios in React context backed by localStorage. Production requires a database-backed scenario system where a user can save named configurations, compare them side by side, share them with stakeholders, and track which scenario was ultimately adopted. Each scenario needs to carry its full parameter set, the resulting budget impact, and a snapshot of the employee population it was run against. Equity Analysis Engine The hardcoded charts need to be replaced by a statistical analysis service. Gender and ethnicity pay gap calculations require controlled regression, adjusting for level, tenure, location, and department, not raw averages. Compression detection needs to compare adjacent levels within the same job family dynamically. Flagged roles need to be generated algorithmically, not listed manually. Authentication, Tenancy, and Access Control Compensation data is among the most sensitive in any organization. The system needs proper auth (SSO at minimum for enterprise), tenant isolation so each company sees only its data, and role-based access so an HR analyst sees different things than a VP of People. Audit logging is non-negotiable. Every view, edit, and export must be tracked. What Changed The interface did not need to be rebuilt. It needed something behind it. What was a demo became a system. What was localStorage became a database. What were constants became integrations. What was a progress bar became a processing pipeline. The prototype proved the idea was right. The architecture made it real. From demo-ready to production-ready. From UI-driven logic to system-driven reliability. We built the layer that made it dependable.

1

1.8K

Cover image for From Instinct to Infrastructure: How

From Instinct to Infrastructure: How Athliq Went From Trainer's Notebook to Production Performance Platform ────────────────────────────────────────── The Person Who Understood the Problem Before Anyone Else Did Marcus had been a strength and conditioning coach for eleven years. He'd worked with professional football squads, Olympic track athletes, and NCAA programs. He knew exactly what was wrong with how performance data was managed, not because someone told him, but because he'd lived inside the problem every day. Every morning, he'd open four browser tabs, a spreadsheet, and a WhatsApp thread just to answer one question: Is this athlete safe to train today? HRV from one app. Sleep data from another. Yesterday's load from a Google Sheet. Wellness check-ins in a form nobody filled out consistently. Injury notes in a physio's personal folder. The picture was always incomplete, not because the data didn't exist, but because no system was designed to assemble it. He wasn't guessing the problem. He was the problem's daily victim. So he built something. ────────────────────────────────────────── The First Version Had Real Value What Marcus and a developer friend put together in six weeks was genuinely useful. A React frontend. Static JSON files simulating the data feeds he wished he had. A morning readiness dashboard showing each athlete's status: green, amber, red. ACWR calculations. A training plan view. A return-to-play protocol tracker. It looked like a real platform. It felt like one. When he demoed it to his performance director, the response was immediate: "This is what we've been trying to build for two years." The prototype surfaced something important. The problem wasn't that nobody had the data. The problem was nobody had designed the right lens to look at it through. Marcus had. His system organized information around the questions coaches actually ask, not the questions software vendors assume they ask. The initial build worked. For one squad. In static conditions. With fake data. And that was exactly the point where it started to matter, and exactly the point where its limitations became unavoidable. ────────────────────────────────────────── What Started Breaking The prototype had no backend. Data was hardcoded. Every "insight" was pre-written. The readiness scores didn't calculate; they were authored. When a second sport scientist saw the demo and said, "Can we plug in our GPS data?" there was no honest answer that didn't involve a complete rebuild. More specifically: The data layer was decorative. The JSON files looked real but required manual authoring for every scenario. There was no pipeline, no ingestion, no validation. Any live deployment would mean the dashboard showed stale or fabricated numbers, which in a performance context is worse than showing nothing at all. The AI insights were static strings. Every "AI-generated" recommendation was hardcoded text. In the prototype, this was fine. It demonstrated the concept. In production, it would mean the same insight appearing for every athlete regardless of their actual state, silently eroding clinician trust. The system had no concept of time. Training load calculations, ACWR ratios, wellness trends, all of these are temporal by definition. The prototype rendered them as snapshots. A real system needed rolling windows, historical comparison, and the ability to detect change over time. There was no role isolation. The role switcher in the UI was cosmetic. A physio and a performance director seeing the same underlying data with a CSS class change was not access control, it was theater. Nothing would survive a real integration. Real wearables return messy, incomplete, delayed data. The system had no error handling, no retry logic, no fallback states. The first real data feed would have broken the UI in ways that were invisible until they were catastrophic. The system was not wrong. It was early. ────────────────────────────────────────── Why They Didn't Just Fix It Themselves Marcus understood sport science. His developer understood React. Neither of them had built a production data system before, and that gap is not a skills deficiency, it is a domain specialization. What they needed was not someone to rewrite their frontend. The frontend was actually good. The visual hierarchy was sharp, the domain terminology was accurate, the workflows reflected how coaches genuinely think. That institutional knowledge was irreplaceable and not to be discarded. What they needed was: • A real-time data layer that could ingest from multiple sources reliably • A calculation engine that could run ACWR, load zone distributions, and readiness scoring against live data • A structured API contract between the front and back end • Authentication and role-based data scoping that actually enforced access boundaries • Observability, so when something silently broke, someone would know The prototype had proven the concept. The job now was to make the concept dependable. ────────────────────────────────────────── What We Actually Did We kept the frontend. Almost entirely. The visual design, the component architecture, the domain-accurate terminology, all of it stayed. We refactored the data layer, not the UI layer. The prototype's greatest strength was its UX fidelity to how coaches actually work, and we had no interest in rebuilding that from scratch. We built a real data ingestion pipeline. Rather than static JSON, we designed a service layer that could ingest from GPS units, HRV monitors, and wellness form submissions. Each source had its own adapter with validation, normalization, and error handling. Partial data was acceptable; silently wrong data was not. We replaced static calculations with a live computation engine. ACWR calculations now ran against a rolling 28-day window of actual load data. Readiness scoring pulled from real HRV baselines, not fixed numbers, and recalibrated as an athlete's personal baseline shifted over a training block. We replaced pre-written AI insights with a rules-based inference layer. Every insight shown in the platform now corresponded to a condition that was evaluated against live data. If Lena Vasquez's ACWR crossed 1.3 and her HRV dropped more than 15% from her 7-day baseline, the injury risk flag was triggered, not because it was hardcoded, but because those conditions were true. We implemented real role-based access control. A physio sees medical data, injury history, and RTP protocols. A sport scientist sees load analytics and benchmarks. A performance director sees the squad-level overview. A head coach sees readiness and today's session. The frontend already had role-switching built in, we gave it actual enforcement. We added observability throughout. Every data ingestion event was logged. Every calculation that produced an out-of-range result generated an alert. If a data source stopped sending, the system surfaced a staleness warning rather than silently displaying old numbers as current. ────────────────────────────────────────── Tech Stack React 19 + Vite, Tailwind CSS v3, Recharts, React Router v7, Node.js + Fastify, PostgreSQL + TimescaleDB, Redis, GPS/HRV/sleep data adapters (Catapult, Polar, Garmin), Google Forms/Typeform ingestion, Auth0, row-level security, Sentry, Datadog, Railway/Render, Vercel, Supabase Storage What Changed The morning workflow Marcus had been running across four tabs and a spreadsheet now ran in a single view that was populated automatically before he arrived at the training ground. The difference wasn't just convenience. It was confidence. When the dashboard flagged an athlete as high-risk, the coaching staff could interrogate why and trust the answer. When a return-to-play progression showed 80% completion, that number reflected actual criteria met against measured data, not a manually updated percentage. The platform was no longer a demo tool. It was a clinical decision-support system. For the squads using it, the shift was measurable: fewer reactive injury responses, more consistent load monitoring, and perhaps most importantly, a shared language between coaching staff, physios, and sport scientists built around the same data rather than competing interpretations of separate sources. ────────────────────────────────────────── The Part That Rarely Gets Said Most platforms built in this space start from the software side. Someone builds a data collection tool, adds a dashboard, and then tries to reverse-engineer what coaches actually care about. Athliq started from the other direction. A domain expert who understood the problem at a professional level built the frame first, and built it correctly. The pain points were real, the workflows were accurate, the terminology was precise. The engineering work didn't fix a bad idea. It made a good idea survivable. That distinction matters more than most technical case studies acknowledge. The hardest part of building a platform like this is not the infrastructure. It's knowing which questions to answer. That knowledge was already there. Our job was to make sure the system could keep answering them reliably, at scale, over time. ────────────────────────────────────────── Athliq is now in active deployment across two professional squads and one university performance program. The morning readiness dashboard processes real-time data from four integrated sources and serves role-scoped views to performance directors, sport scientists, physiotherapists, and athletes.

1

3

1.9K

Cover image for Case Study: From Prototype to

Case Study: From Prototype to Production — Building a Credit Management Platform for Ad Operations The Starting Point The founder wasn't guessing the problem. They had spent years inside the ad-credit ecosystem, managing wallet balances across regions, reconciling top-ups via bank wire and stablecoin, chasing compliance documents, and watching campaigns stall because a pixel stopped firing at 2am. They knew exactly what a credit management platform needed to look like. So they built one. Using Figma wireframes translated directly into a React frontend, they shipped a working prototype in days. Two portals were created. One for clients managing wallets and ad accounts, and one for internal operators handling treasury, compliance, and risk. It included real-time spend charts, AI-driven anomaly detection banners, a work queue for ops teams, and an embedded AI assistant that could answer questions about balances, compliance status, and pixel health. The prototype proved the concept. Clients could see their wallet balances, request top-ups, allocate funds to ad accounts, and track campaign performance. Admins could manage treasury operations, review KYB pipelines, monitor risk scores, and process a prioritized work queue. The domain logic was sound. The UX was sharp. But the system was never designed to survive real load. What Started Breaking The prototype worked on mock data. Every API call returned hardcoded arrays after a random delay. There was no backend. No database. No real authentication. The login screen accepted any email and assigned a role based on a toggle switch. Session state lived in localStorage as a raw JSON blob. This was fine for demos. It stopped being fine the moment real money entered the picture. The specific fractures: 1. No transactional integrity. Wallet balances, top-ups, fund transfers, and ad account allocations were all simulated. In a live system, a transfer of $25,000 from a master wallet to a regional sub-wallet is not a UI state change. It is a financial transaction that requires atomicity, audit trails, and rollback capability. The prototype had none of this. 2. Compliance was cosmetic. KYB document statuses were static labels. In production, document verification involves third-party identity providers, expiration tracking, automated re-upload reminders, and regulatory audit logs. The prototype rendered badges like "Verified", "Pending", and "Missing", but nothing enforced the state machine behind them. 3. Risk scoring was decorative. The AI risk badges showed tooltips like "Large P2P transfer detected, document expiring", but these were string literals, not outputs from a scoring model. Real risk assessment requires transaction pattern analysis, velocity checks, cross-referencing compliance status, and escalation workflows that route to the right ops agent. 4. The work queue had no backend. Urgent items like "$45,000 P2P transfer anomaly" appeared in the queue, but resolving them was just a frontend state toggle. There was no case history, no assignment logic, no SLA tracking, and no integration with the compliance or treasury systems that actually needed to act on these events. 5. Multi-tenancy was absent. The platform served one mock client and one mock admin. Scaling to dozens of clients, each with their own wallets, sub-wallets, ad accounts, compliance profiles, and credit limits, required data isolation, permissioning, and tenant-aware queries that did not exist. 6. Ad platform integration was faked. TikTok metrics like impressions, clicks, ROAS, and pixel health were all static datasets. Production requires OAuth-based API integrations, rate-limited data syncing, webhook listeners for pixel status changes, and graceful degradation when platform APIs go down. The founder understood all of this. The prototype was never meant to be the product. It was meant to prove that the product was worth building. Why They Brought In a Team The gap between the prototype and production was not a matter of fixing bugs. It was an architecture problem. The founder needed: - A real backend with transactional guarantees for financial operations - A compliance engine that could enforce document workflows across jurisdictions - A risk system that could ingest transaction data and surface actionable alerts, not static strings - Multi-tenant data architecture with proper isolation and access control - Ad platform integrations that could handle real API contracts, rate limits, and failures - Observability including logging, monitoring, and alerting so the ops team could trust the system under load They did not need someone to rewrite the frontend. They needed someone to build the system underneath it. What We Delivered Financial Operations Layer We replaced the mock API with a transactional backend. Every wallet operation, including top-ups, transfers, allocations, and refunds, now runs through an auditable pipeline with: - Atomic balance updates with optimistic locking - Double-entry ledger for every fund movement - Idempotent transaction processing to prevent duplicate charges - Full audit trail with actor, timestamp, and before and after state Top-up requests now flow through a verification pipeline with submission, proof-of-payment upload, approval, and balance credit. Each step is recorded and reversible. Compliance and KYB Engine - We built a document lifecycle system that replaces static badges with enforced state transitions: - Documents move through missing → uploaded → under_review → verified → expired with rules governing each transition - Expiration monitoring triggers automated client notifications before deadlines - Third-party identity verification integration for director ID matching - Jurisdiction-aware requirements where different regions require different document sets - Audit-grade logging for every status change, reviewer action, and override The KYB pipeline now routes cases to specific compliance agents based on workload, region, and verification type. Risk and Anomaly Detection We replaced hardcoded risk labels with a scoring system that evaluates: - Transaction velocity based on spend acceleration versus historical baseline - P2P transfer patterns and threshold breaches - Compliance status correlation, such as expired documents combined with high spend - Account dormancy detection where inactivity triggers review Risk scores update in near real time. High-risk events automatically generate work queue items with priority, context, and suggested actions. Work Queue and Case Management We transformed the frontend-only task list into an event-driven operations system: - Events from treasury, compliance, and risk systems automatically create queue items - Assignment logic routes items to the right agent based on type, region, and capacity - SLA tracking with escalation rules for overdue items - Case history that records every action, note, and resolution - Enforced status transitions so items cannot be resolved without required actions Multi-Tenant Architecture We designed the data layer for tenant isolation from the ground up: - Each client organization has isolated wallets, documents, ad accounts, and transaction histories - Role-based access control separates client-facing and admin-facing data - API endpoints are tenant-scoped to prevent cross-tenant data leakage - Admin views aggregate across tenants with proper permissioning Ad Platform Integration We built a sync layer for TikTok Ads with an architecture that supports additional platforms: - OAuth-based account linking with token refresh management - Scheduled metric pulls with rate limit awareness and backoff - Pixel health monitoring via event signal tracking instead of static labels - Graceful degradation where stale data is clearly labeled if APIs fail Observability We added the infrastructure the ops team needs to trust the system: - Structured logging for every financial operation, compliance action, and API call - Health dashboards for backend services, integration sync status, and queue throughput - Alerting on anomalies such as failed transactions, sync delays, and SLA breaches - Error tracking with business context, not just stack traces The Outcome The system went from a prototype that could demo well to a platform that could process real money, enforce real compliance, and surface real risk under real load. What changed: - Financial operations now run with transactional guarantees. Wallet balances are accurate, auditable, and reconcilable. - Compliance is enforced, not displayed. Document workflows follow regulated state machines with full audit trails. - Risk detection is continuous and contextual. The ops team acts on scored alerts instead of static labels. - The work queue drives operations. Events flow in automatically, route correctly, and track resolution against SLAs. - Multi-tenancy works. New clients onboard into isolated environments without architectural changes. - Ad integrations sync reliably. When they fail, the system clearly shows it instead of masking stale data. The founder’s instinct was right from the start. The domain model, the UX, and the operational workflows all held up. What we built was the engineering foundation that made it dependable. The system worked until it didn’t. Not because the idea was flawed, but because it was never designed to handle this level of complexity. The prototype proved the product. The production system proved it could scale. Tech Stack Overview 1. Backend: Node.js (NestJS) 2. API: GraphQL 3. Auth: Auth0 4. Database: PostgreSQL 5. Cache/Queue: Redis 6. Search: Elasticsearch 7. Infrastructure: AWS 8. Containers: ECS Fargate 9. CI/CD: GitHub Actions 10. IaC: Terraform 11. Integrations: Stripe 12. Risk Engine: Python (FastAPI) 13. ML Pipeline: scikit-learn 14. AI Assistant: OpenAI GPT-4 15. Vector Store: Pinecone

2

1.9K

proKarachi, Pakistan

Building high-performance products for ambitious startups

New to Contra

Building high-performance products for ambitious startups

Cover image for Building a Dreamy Kawaii E-Commerce

Building a Dreamy Kawaii E-Commerce Store with Squish Physics & Ambient Soundscapes ☁️🧸 Hey Contra community! 👋 I’ve been designing and developing CloudPuff, an interactive, joy-first e-commerce experience for plushie lovers. Instead of another cookie-cutter shop, I wanted every interaction to feel tactile, cozy, and playful. What I’ve built so far: Interactive Squish Physics: Spring animations, squeeze physics, and tactile micro-interactions on hover and click. Custom Plushie Studio (/customizer): Real-time workshop to build custom plushies (fur tone, scent selection, embroidered collar tags). Web Audio Soundscapes: Built-in soothing ambient lullaby chime, squish FX, and audio feedback. In-Page Real-World Size Guide: Visual comparison against everyday objects (coffee mug, 13" laptop, sleeping house cat, pillows). Adoption Registry & Live Tracker: Official printable birth certificates and a simulated live cuddle courier radar. Day & Twilight Night Mode: Custom dual-palette design system built purely in Vanilla CSS & Next.js. Looking for your feedback: Do you prefer the dreamy pastel cotton candy aesthetic or the deep twilight glassmorphism? What’s missing? If you were adopting a plushie buddy, what delight feature or micro-interaction would make you say "take my money"? Drop your thoughts or suggestions below. I’d really appreciate your critique! 👇✨

3

2

268

Cover image for Status: 🚧 Active Development (Work in

Status: 🚧 Active Development (Work in Progress) Platform: iOS & Android (Cross-Platform Mobile Application) Executive Summary FitMind AI (FM AI) is an elite, dual-sided mobile ecosystem engineered to bridge the gap between AI-driven athlete biometrics and high-performance human coaching. Most modern fitness apps rely on static, cookie-cutter PDF routines or generic algorithmic chatbots that ignore real-time human physiology. FM AI changes this paradigm by synthesizing live telemetry from wearable sensors (Whoop 4.0, Apple Watch, Garmin) into adaptive daily training, nutrition formulas, and real-time video form analysis, backed by a comprehensive Coach Command Center with intake CRM, split builders, and royalty monetization. > The Problem & Vision i) The Problem Disconnected Biometrics: Wearables gather massive amounts of sleep and HRV data, yet athletes still blindly follow fixed workout splits regardless of central nervous system (CNS) fatigue or recovery deficits. ii) Siloed Coaching Workflows: Remote coaches juggle WhatsApp for messaging, Google Sheets for workouts, Loom for video reviews, and Stripe/PayPal for billing. iii) Lack of Visual & Interactive Fidelity: Fitness apps often feel like utilitarian databases rather than dynamic, motivating athletic dashboards. The Solution: FitMind AI FM AI delivers a cohesive, glassmorphic dark-mode mobile experience featuring: i) An Athlete Mode that automatically adapts workout load, sets, and RPE based on overnight recovery and daily readiness. ii) A Coach Mode offering an agency-grade mobile CRM to prescribe routines, review video form checks with visual cues, manage inbound orders, and host 1-on-1 consultations. > Key Architectural Highlights & Features 1. Dual-Sided Executive Bento Grid Interface i) Athlete Dashboard: Features an interactive glassmorphic Bento HUD displaying real-time Whoop recovery scores, day streak gamification, FM Coin treasury rewards, and contextual daily workouts. ii) Coach Command Center: Instantly toggle between Client and Coach modes with a single tap. Coaches get real-time client roster vitals, pending intake orders, video submission queues, and quick-launch links to the Web Command Studio. iii) Custom Glassmorphism Design System: Built from the ground up using expo-blur and multi-stop linear gradients, featuring floating pill navbars with bottom blur curtains and ambient LED edge glows. 2. Live Biometric Synchronization & Intelligent Readiness i) Tracks Heart Rate Variability (HRV), resting heart rate, sleep cycles, and daily strain to calculate an AI Recovery Score (0–100%). ii) Dynamically calibrates prescribed workout weights, volume, and rest timers in real-time (e.g., dialing down squat volume when recovery is sub-50% or recommending heavy progressive overload on high-recovery days). 3. Coach Studio & Athlete Management CRM i) Multi-Day Split Builder: Interactive workout generator with RPE targets, tempo notation (eccentric/pause/concentric), and exercise tutorial integrations. ii) Custom Meal & Macro Formula Prescriber: Coaches can prescribe targeted daily caloric targets and macronutrient distributions (protein/carb/fat) with instant push notifications to the athlete. iii) Video Form Checks: Video submission pipeline allowing coaches to review athlete lift execution and return feedback cues. iv) Team Coaching & Royalties: Multi-tier agency support allowing head coaches to oversee sub-coaches and track monthly sales volume and royalty splits. 4. FM AI Adaptive Music Engine i) Biometrically reactive soundscape player with a floating, animated mini-player. ii) Automatically surfaces high-tempo, energetic playlists based on the current workout block (warmup, working sets, PR attempts, cooldown). Technical Stack & Implementation Framework: React Native, Expo SDK (Managed Workflow with Custom Plugins) Navigation: Expo Router v3 (File-based typed routing, nested layouts, modal stacks) Language: TypeScript (Strict mode, end-to-end type safety for orders, biometrics & threads) UI & Animations: React Native Reanimated 3 (60fps spring physics, enter/exit transitions, pulse glows) Aesthetics & Glass: Expo Blur (BlurView), Expo Linear Gradient, Custom HSL Dark Palettes Hardware Integrations: Device sensor access, camera intake for AI food and form scanning Media & Audio: Expo AV / Sound Engine, Expo Image for cached high-performance media delivery 📈 Ongoing Work & Upcoming Milestones (WIP) Core athlete tracking engine and gamified coin reward economy. Dual-dashboard switching (Athlete Mode ↔ Coach Command Center). Glassmorphic Bento Grid navigation & responsive floating dock. Coach routine builder and macro prescription protocol. In Progress: On-device computer vision for real-time rep velocity tracking (VBT). In Progress: Stripe Connect integration for automated subscription billing and instant coach payouts. Upcoming: Apple HealthKit & Whoop API direct background background sync. 💡 Why This Project Demonstrates Product & Engineering Mastery This project showcases the ability to architect complex state hierarchies, manage dual-persona authorization flows, design production-grade UI/UX that rivals top-tier Silicon Valley consumer apps, and build cross-platform mobile software optimized for performance and aesthetic appeal.

3

1

220

Cover image for Rocky - The Rockefeller 🌲
Demo

Rocky - The Rockefeller 🌲 Demo / Work in Progress - Not a Final Render A preview of a whimsical animated short bringing Rocky, a little Christmas tree, to life. Set in a magical snow-covered forest, the story follows Rocky as he discovers friendship, confidence, and a little holiday magic along the way. This demo explores the character animation, storytelling, environments, and overall visual direction of the project. This is a demo and not the final render. It is intended to showcase the creative direction, animation approach, and work-in-progress development of the piece. Final rendering, polish, lighting, effects, and other production elements may differ from what is shown here. What we're exploring: Character-driven animation Expressive movement and storytelling Snowy forest environments Character interactions Cinematic framing and camera movement A warm, playful storybook-inspired visual direction The aim is to create a world that feels cozy, magical, and alive - like a Christmas storybook brought to motion.

0

24

Cover image for Vanguard & Sterling LLP -

Vanguard & Sterling LLP - Ultra-Luxury Corporate Litigation Web Platform & Executive Portal Role & Services Role: Lead Full-Stack Web Architect & Product Designer Services: Custom WordPress Development, Full-Stack Architecture, UI/UX Design System, LegalTech Engineering, Cloud DevOps (Docker & Railway) Project Overview Vanguard & Sterling LLP is an elite corporate defense and appellate litigation practice operating in high-stakes venues, including the Delaware Court of Chancery and the U.S. Federal Courts. The objective was to transcend conventional corporate legal websites by creating an ultra-luxury sovereign web presence coupled with an authenticated Executive Portal Enclave. The platform provides clients, general counsels, and senior partners with real-time court docket synchronization, conflict-of-interest clearance screening, an FRCP 26(b)(3) privileged document vault, and an ABA Model Rule 1.15-compliant IOLTA fiduciary trust ledger. The Challenge Generic Industry Norms: Traditional law firm websites feel sterile, outdated, and template-driven, failing to project the prestige and authority required for multi-billion-dollar corporate disputes. Dual-Sided Architecture: The platform needed to serve two distinct audiences: prospective Fortune 500 corporate clients seeking counsel, and authenticated enterprise clients/partners accessing privileged litigation work product. Complex Compliance & Data Handling: Legal-grade compliance demands: strict ABA Model Rules 1.6 (Confidentiality), 1.7–1.10 (Conflicts of Interest), and 1.15 (Trust Accounting) workflows with segregated access controls. The Solution & Deliverables Bespoke Sovereign Design System Visual Aesthetic: Tailored obsidian dark mode palette (#060A14, #0A1224), brushed champagne and royal gold accents (#B89552, #DFC080), and polished marble glassmorphism (backdrop-filter: blur(16px)). Institutional Typography: Classical stone-carved judicial serif (Cinzel) paired with contemporary structural sans-serif (Plus Jakarta Sans) and editorial body type (Cormorant Garamond). Interactive Micro-Interactions: Real-time ticker feeds, responsive chamber locator maps across Wilmington, Washington D.C., New York, and London, and zero-flicker glass modals. Executive Portal & Sovereign CMS Modules Engineered an administrative control suite natively inside WordPress without relying on bloated third-party plugins: Certified Litigation Dockets (vg_matter): Chronological procedural histories with PACER docket numbers, presiding judge assignments, and hearing schedules. IOLTA Trust Ledger & Statements (vg_invoice): Complete fiduciary trust accounting engine tracking escrow balances, monthly legal fee drawdowns, itemized hours/disbursements, and instant PDF generation. Conflict Clearance Desk (vg_conflict): Real-time conflict checking mechanism with SLA response countdowns, adverse party tracking, and ethical wall sequestration directives. Privileged Document Vault (vg_vault_doc): Work-product classification system featuring SHA-256 cryptographic digests, audit logs, and encrypted access gates. 3. Custom In-Dashboard Dossier Experience Built an in-dashboard dossier view (vanguard-portal-view) that eliminates public website headers and footers during administrative reviews while preserving the full WordPress CMS sidebar and top bar. Custom architectural twilight rendering on wp-login.php with frosted glass container cards and glowing focus states. Tech Stack & Tools Core Engine: WordPress (Custom Theme & MU-Plugin Architecture), PHP 8.2 Frontend: Semantic HTML5, Vanilla Modern CSS3, JavaScript (ES6+), SVG Vector Engineering Database & Hosting: MySQL, Docker Containerization, Railway Cloud Infrastructure Design & Assets: Custom Design System, Architectural Renderings, Font Interactivity (Google Fonts)

0

54

Karachi, Pakistan

Full-Stack Next.js Developer | SaaS & AI Products

8: Followers

Full-Stack Next.js Developer | SaaS & AI Products

Cover image for Development of Amanises AI Agent Platform

Development of Amanises AI Agent Platform

1

3

Cover image for VEX Luxury Real Estate Advisory

VEX Luxury Real Estate Advisory Landing Page A clean minimal landing page for a luxury real estate advisory brand. Video hero, property listings grid, neighborhoods section, buying process, agent profiles, testimonials and FAQ the complete package for any premium property brand. Sections: Video hero, Press marquee, Listings grid, Why us, Stats, Neighborhoods, Process, Testimonials, Agents, FAQ, CTA, Footer Built with: React, Tailwind CSS, Bun Project URL: https://vex.munain605.workers.dev/

1

194

Cover image for Keychron K-04 Scroll-Driven Hardware Product

Keychron K-04 Scroll-Driven Hardware Product Landing Page A premium product landing page for a mechanical keyboard brand. Built with a clean minimal aesthetic, scroll-driven disassembly animation, full specs, switch selector, pricing tiers, testimonials and FAQ. Sections: Scroll hero, Brand marquee, Features, Switch selector, Specs table, Testimonials, Pricing tiers, FAQ, CTA, Footer Built with: React, Tailwind CSS, Bun,GSAP Project URL: https://keychron.munain605.workers.dev/

1

191

Cover image for Shoefy Dark Sneaker Ecommerce Landing

Shoefy Dark Sneaker Ecommerce Landing Page A bold, high-energy ecommerce landing page for a premium sneaker brand. Built with a dark aesthetic, bold typography, product grid, featured drops, blog section and newsletter the complete package for any fashion or footwear brand. Sections: Hero, Why Us, Featured Drop, Shop By Vibe, Trending Now grid, Product Detail, Blog, FAQ, Newsletter, Footer Built with: Next.js, TypeScript, Tailwind CSS, ImageKit Project URL: https://shoefyy.netlify.app/

1

177